.text-center {text-align:center;}

#custom_off_canvas_container {left:-100vw;}
#custom_off_canvas_container.show-overlay::before {
    content:""; 
    position:fixed; 
    left:0; 
    right:0; 
    top:0; 
    bottom:0; 
    width:100vw; 
    height:100vh; 
    background-color: rgba(0, 0, 0, 0.8);
    z-index: -1;
    opacity: 0;
    animation: fadeInOverlay 0.2s ease-in-out forwards;
}
@keyframes fadeInOverlay {
    to { opacity: 1; }
}
#custom_off_canvas_close {
    position: absolute;
    top:20px;
    right: -50px;
    z-index: 2;
    transition: all 0.3s ease-in-out;
    display: none;
    opacity: 0;
}
#custom_off_canvas_container.show-overlay #custom_off_canvas_close {
    right: 20px;
    display: block;
    opacity: 1;
    font-size:20px;
}
#custom_off_canvas_close svg path {fill:#fff;}

.xpro-elementor-search-button {width:70px; height:40px;}
.xpro-elementor-search-button svg path {fill:#01082E;}
.svg-light-red-color svg path {fill:#ff002d;}
.svg-dark-red-color svg path {fill:#710015;}

@media (max-width: 769px) {
    .mobile-info-box {background:#01082E; padding:1.5rem 1rem 2rem 1rem;}
    .mobile-info-box svg path {fill:#00c3ff;}
    .mobile-info-box .xpro-box-icon-title {color:#fff !important;}
    .mobile-info-box .xpro-box-icon-description {color:#ccc !important;}
}

.woocommerce-Price-amount {color:#fff !important; font-weight:300 !important; font-size:0.9rem !important;}
.woocommerce-breadcrumb {margin:0 !important;}

.tinvwl-shortcode-add-to-cart {border:solid 1px #000; padding:15px; border-radius:5px; text-align:center;}
.tinvwl-shortcode-add-to-cart a::before {color:#000;}
.tinvwl-shortcode-add-to-cart  .tinvwl_add_to_wishlist-text {color:#000; font-family:"Poppins", Sans-serif;}

/* Number of people watching this product */
.product-viewers {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  color: #333;
}

.product-viewers-icon svg {
  color: #c82713;
  vertical-align: middle;
}

.product-viewers-text {
  font-weight: 500;
}

.why-choose-us-section-about-page:nth-child(1) svg path {fill:#a72ae3; stroke:#fff;}
.why-choose-us-section-about-page:nth-child(2) svg {fill:#aeb1dd; stroke:#aeb1dd;}
.why-choose-us-section-about-page:nth-child(2) svg path {fill:#aeb1dd; stroke:#aeb1dd;}
.why-choose-us-section-about-page:nth-child(3) svg path {fill:#a72ae3; stroke:#fff;}
.why-choose-us-section-about-page::before {border-radius:5px;}

.contact-us-page-icons svg path {stroke:#522df4;}
.contact-us-page-icons svg {fill:#522df4;}
.contact-us-page-icons path {stroke:#522df4;}

/* New Arrival Section On Home Page */
.home-product-grid-custom .xpro-woo-product-img-section {border:solid 1px #e1e1e1 !important;}

/* On Checkout Page */
.custom-payment-image {margin-top:0;}

/* Cart Page */
.custom-breadcrumb {text-align:center; padding:3rem 0;}
.custom-breadcrumb h1 {margin:0; margin-bottom:5px; font-family:"Playfair Display", sans-serif; color:#2e00be;}

/*************************
	CONTACT FORM 7
**************************/
.cf7-flex-container {display:flex; width:100%;}
.cf7-flex-item-50 {flex:50%; display:block; padding:7px;}
.cf7-flex-item-100 {flex:100%; display:block; padding:7px;}
.cf7-flex-item-33 {flex: 0 0 33.33%; padding: 10px; /* Or whatever padding you used for the 50% items */ box-sizing: border-box;}
/* Optional: Make it stack on mobile */
@media (max-width: 768px) {
.cf7-flex-item-33 {
		flex: 0 0 100%;
	}
}
.custom-contact-form-7-labels {color:#555555; font-size:0.9rem; font-weight:500;}
.wpcf7-form-control {border:solid 1px #ccc; border-radius:5px !important; width:100%; padding:10px; box-sizing: border-box; font-family:"Poppins", sans-serif; font-size:0.9rem; margin-top:4px; background:white;}
.wpcf7-submit {background:#3d00f9 !important; color:#000; border:0; text-transform:uppercase; font-weight:600; font-size:1rem; padding:12px 0 12px 0; transition:all 0.3s ease-in-out;}
.wpcf7-submit:hover {background:#1b1b1b !important; color:#fff; transition:all 0.3s ease-in-out;}
.asterisk {color:#f00;}
.wpcf7 form .wpcf7-response-output {margin: 0em 0.5em 0em;}

/****************************************************************
    ADD ICONS TO MY ACCOUNT LINKS
*****************************************************************/
/* Container styling for the menu list */
.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Individual list item styling */
.woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid #eee;
}

/* Styling the link and positioning the icon */
.woocommerce-MyAccount-navigation li a {
    display: flex;
    justify-content: space-between; /* Pushes text to left and icon to right */
    align-items: center;
    padding: 5px 10px;
    text-decoration: none;
    color: #333;
    font-weight: 500;
    transition: background 0.3s ease;
}

.woocommerce-MyAccount-navigation li a:hover {
    background-color: #f9f9f9;
}

/* Base style for all icons */
.woocommerce-MyAccount-navigation li a::after {
    content: '';
    width: 20px;
    height: 20px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.6; /* Slight fade for a modern look */
}

/* 1. Dashboard Icon (Grid) */
.woocommerce-MyAccount-navigation-link--dashboard a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7'%3E%3C/rect%3E%3Crect x='14' y='3' width='7' height='7'%3E%3C/rect%3E%3Crect x='14' y='14' width='7' height='7'%3E%3C/rect%3E%3Crect x='3' y='14' width='7' height='7'%3E%3C/rect%3E%3C/svg%3E");
}

/* 2. Orders Icon (Shopping Bag) */
.woocommerce-MyAccount-navigation-link--orders a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='Work'%3E%3C/path%3E%3Cpath d='M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'%3E%3C/path%3E%3Cpath d='M3 6h18'%3E%3C/path%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'%3E%3C/path%3E%3C/svg%3E");
}

/* 3. Addresses Icon (Map Pin) */
.woocommerce-MyAccount-navigation-link--edit-address a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'%3E%3C/path%3E%3Ccircle cx='12' cy='10' r='3'%3E%3C/circle%3E%3C/svg%3E");
}

/* 4. Account Details Icon (User) */
.woocommerce-MyAccount-navigation-link--edit-account a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E");
}

/* 5. Wishlist Icon (Heart) */
.woocommerce-MyAccount-navigation-link--wishlist a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l8.84-8.84 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'%3E%3C/path%3E%3C/svg%3E");
}

/* 6. Logout Icon (Log Out) */
.woocommerce-MyAccount-navigation-link--customer-logout a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'%3E%3C/path%3E%3Cpolyline points='16 17 21 12 16 7'%3E%3C/polyline%3E%3Cline x1='21' y1='12' x2='9' y2='12'%3E%3C/line%3E%3C/svg%3E");
}