/* ==========================================
   CUSTOM DUNE HEADER STYLES
========================================== */
.custom-dune-header {
    width: 100%;
    z-index: 999;
    background-color: #ffffff;
    border-bottom: 1px solid #eaeaea;
}

.dune-header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 85px;
}

/* লোগো সাইজ */
.site-branding img {
    max-height: 45px; 
    width: auto;
}

/* মেইন মেনু এলাইনমেন্ট */
.dune-nav .main-navigation ul {
    display: flex;
    gap: 35px;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
}

.dune-nav .main-navigation a {
    font-size: 15px;
    text-transform: capitalize;
    font-weight: 500;
    text-decoration: none;
    color: #100d0d;
    transition: color 0.3s ease;
}

.dune-nav .main-navigation a:hover {
    opacity: 0.7;
}

/* টুলস (কার্ট, সার্চ আইকন) এলাইনমেন্ট */
.dune-tools {
    display: flex;
    align-items: center;
    gap: 20px;
}
.dune-tools svg {
    width: 22px;
    height: 22px;
    fill: #100d0d;
}

/* ==========================================
   RESPONSIVE CLASSES (MOBILE & DESKTOP)
========================================== */
@media (min-width: 992px) {
    .hide-on-desktop { display: none !important; }
}

@media (max-width: 991px) {
    .hide-on-mobile { display: none !important; }
    .dune-header-inner { height: 70px; }
    .dune-tools { gap: 15px; }
    .dune-nav .main-navigation ul { gap: 20px; }
}


/* ==========================================
   DHEW BRAND FOOTER STYLES (WITH LOGO FIX)
========================================== */
.dune-brand-footer {
    background-color: #100d0d;
    color: #ffffff;
    padding: 80px 0 30px 0;
    margin-top: 80px;
}

/* ফুটার লোগো সাইজ ও কালার ফিক্স (ডার্ক ব্যাকগ্রাউন্ডে লোগো সাদা করার জন্য) */
.dune-brand-footer .footer-logo img {
    max-height: 45px;
    width: auto;
    margin-bottom: 20px;
    filter: brightness(0) invert(1);
}

.dune-brand-footer .footer-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    gap: 40px !important;
    margin-bottom: 60px !important;
}

.dune-brand-footer .footer-col {
    flex: 1 1 22% !important;
    min-width: 220px;
}

.dune-brand-footer .footer-heading {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 20px;
    color: #ffffff;
}

.dune-brand-footer .footer-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #b0b0b0;
    margin-bottom: 20px;
}

.dune-brand-footer .footer-links ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.dune-brand-footer .footer-links li {
    margin-bottom: 12px !important;
}

.dune-brand-footer .footer-links a, 
.dune-brand-footer .footer-socials a {
    color: #b0b0b0;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
}

.dune-brand-footer .footer-links a:hover, 
.dune-brand-footer .footer-socials a:hover {
    color: #ffffff;
}

.dune-brand-footer .footer-socials {
    display: flex;
    gap: 20px;
}

/* নিউজলেটার ফর্ম স্টাইল */
.footer-newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 15px;
}

.footer-newsletter-form input {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 12px 15px;
    color: #fff;
    font-size: 14px;
    outline: none;
    border-radius: 0;
}

.footer-newsletter-form input::placeholder {
    color: #888;
}

.footer-newsletter-form .btn {
    background: #ffffff !important;
    color: #100d0d !important;
    text-align: center;
    padding: 12px !important;
}
.footer-newsletter-form .btn:hover {
    background: #e0e0e0 !important;
}

/* ফুটার বটম সেকশন */
.dune-brand-footer .footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 25px;
    font-size: 13px;
    color: #888;
}

.footer-payments {
    display: flex;
    align-items: center;
    gap: 10px;
}

.payment-badge {
    background: rgba(255, 255, 255, 0.1);
    padding: 4px 8px;
    font-size: 11px;
    letter-spacing: 0.05em;
    color: #fff;
    text-transform: uppercase;
}

/* মোবাইল ও ট্যাবলেট রেস্পন্সিভ */
@media (max-width: 991px) {
    .dune-brand-footer .footer-col {
        flex: 1 1 45% !important;
    }
}

@media (max-width: 576px) {
    .dune-brand-footer .footer-col {
        flex: 1 1 100% !important;
        text-align: center;
    }
    .dune-brand-footer .footer-socials {
        justify-content: center;
    }
    .dune-brand-footer .footer-bottom {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    .footer-payments {
        justify-content: center;
    }
}



/* ==========================================
   FIX FOR HEADER & CONTAINER WIDTH ON SHOP PAGES
========================================== */
.woocommerce-shop .site-header .site-header-inner,
.archive.woocommerce .site-header .site-header-inner,
.tax-product_cat .site-header .site-header-inner,
.woocommerce-shop .page-width,
.archive.woocommerce .page-width,
.tax-product_cat .page-width {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    width: 100% !important;
}

/* হেডারের ব্যাকগ্রাউন্ড বা ফুল-উইডথ বার ঠিক রেখে ভেতরের কন্টেন্ট ফিক্স করা */
.woocommerce-shop .custom-dune-header,
.archive.woocommerce .custom-dune-header,
.tax-product_cat .custom-dune-header {
    width: 100% !important;
}

/* ==========================================
   PERFECT HEADER CONTAINER FIX FOR ALL PAGES
========================================== */

/* হোম, শপ, কার্ট, চেকআউট সহ সব পেজে হেডারের মূল র‍্যাপার এবং ইনার কন্টেইনার ফিক্স */
.site-header .page-width,
.site-header .woostify-container,
.site-header .site-header-inner,
.custom-dune-header .page-width,
.custom-dune-header .woostify-container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* যদি হেডারে কোনো এক্সট্রা ফুল-উইডথ রো বা ব্যাকগ্রাউন্ড থাকে তা ব্যালেন্স করার জন্য */
.site-header, 
.custom-dune-header {
    width: 100% !important;
    display: block !important;
}

/* ==========================================
   CHECKOUT PAGE CONTAINER & LAYOUT FIX
========================================== */

/* চেকআউট পেজের মূল র‍্যাপার এবং ফর্ম কন্টেইনার ফিক্স */
.woocommerce-checkout .site-content,
.woocommerce-checkout .woostify-container,
.woocommerce-checkout .page-width {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    float: none !important;
    box-sizing: border-box !important;
}

/* চেকআউট ফর্মের মূল দুই কলাম সেকশন ফিক্স */
.woocommerce-checkout form.woocommerce-checkout {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important;
    justify-content: space-between !important;
    margin: 0 !important;
}

/* বিলিং ইনফো এবং অর্ডার রিভিউ কলাম দুটোকে ফিক্সড উইডথ দেওয়া */
.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
    width: 100% !important;
}

/* বড় স্ক্রিনে কলামগুলোকে পাশাপাশি এবং ব্যালেন্সড রাখা */
@media (min-width: 992px) {
    .woocommerce-checkout #customer_details {
        flex: 0 0 55% !important;
        max-width: 55% !important;
    }
    .woocommerce-checkout #order_review, 
    .woocommerce-checkout #order_review_heading {
        flex: 0 0 40% !important;
        max-width: 40% !important;
    }
}