/*-----------------------------------------------------------------------------------
    Ladam Rolls - Brand Style Override

    Colour Palette:
    - Dark Brown Primary: #42110d
    - Gold Accent: #d4af37
    - Light Gold Background: #f5e6a3

    Typography:
    - Headings: Playfair Display (elegant serif)
    - Body: Inter (clean sans-serif)
-----------------------------------------------------------------------------------*/

/* ===== CSS Variables ===== */
:root {
    /* Brand Colours */
    --ladam-cream: #fdf8ec;
    --ladam-cream-dark: #f5e6a3;
    --ladam-ivory: #f5e6a3;
    --ladam-charcoal: #42110d;
    --ladam-charcoal-light: #5c2a1a;
    --ladam-gold: #d4af37;
    --ladam-gold-hover: #b8961e;
    --ladam-gold-light: #f5e6a3;

    /* Neutral Colours */
    --ladam-white: #FFFFFF;
    --ladam-border: #e8d9a8;
    --ladam-muted: #7A7A7A;
}

/* ===== Base Styles ===== */
body {
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--ladam-charcoal);
    background-color: var(--ladam-cream);
    line-height: 1.8;
}

/* ===== Typography ===== */
h1, h2, h3, h4, h5, h6 {
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 600;
    color: var(--ladam-charcoal);
    letter-spacing: -0.01em;
}

/* More generous heading sizes */
h1 { font-size: 2.75rem; }
h2 { font-size: 2.25rem; }
h3 { font-size: 1.875rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1.125rem; }

p {
    color: var(--ladam-charcoal-light);
    line-height: 1.9;
}

/* ===== Links ===== */
a:hover {
    color: var(--ladam-gold);
}

/* ===== Section Backgrounds ===== */
.bg-color-01,
.section {
    background-color: var(--ladam-cream);
}

/* Alternating sections for visual rhythm */
.section:nth-child(even) {
    background-color: var(--ladam-white);
}

/* ===== Buttons ===== */
.btn {
    font-family: "Inter", sans-serif;
    font-weight: 500;
    letter-spacing: 0.05em;
    border-radius: 6px;
    border-width: 2px;
    transition: all 0.25s ease;
}

.btn:focus-visible {
    outline: 2px solid var(--ladam-gold);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(197, 160, 89, 0.15);
}

/* Primary Button - Gold */
.btn-primary {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
}

.btn-primary:focus,
.btn-primary:active,
.btn-primary:hover {
    background-color: var(--ladam-gold-hover);
    border-color: var(--ladam-gold-hover);
    color: var(--ladam-white);
}

/* Dark Button - Charcoal */
.btn-dark {
    background-color: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

.btn-dark:focus,
.btn-dark:active,
.btn-dark:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
}

/* Black Button */
.btn-black {
    background-color: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

.btn-black:focus,
.btn-black:active,
.btn-black:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
}

/* Outline Buttons */
.btn-outline-dark {
    border-color: var(--ladam-charcoal);
    color: var(--ladam-charcoal);
}

.btn-outline-dark:focus,
.btn-outline-dark:active,
.btn-outline-dark:hover {
    background-color: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

.btn-outline-primary {
    border-color: var(--ladam-gold);
    color: var(--ladam-gold);
}

.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
}

/* Hover Effects */
.btn-primary-hover:hover,
.btn-hover-primary:hover {
    background-color: var(--ladam-gold) !important;
    border-color: var(--ladam-gold) !important;
    color: var(--ladam-white) !important;
}

/* ===== Form Fields ===== */
input.form-field:not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=range]),
textarea.form-field,
.form-control {
    border-color: var(--ladam-border);
    background-color: var(--ladam-white);
    color: var(--ladam-charcoal);
}

input.form-field:not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=range]):focus,
textarea.form-field:focus,
.form-control:focus {
    border-color: var(--ladam-gold);
    box-shadow: 0 0 0 0.2rem rgba(197, 160, 89, 0.15);
}

/* ===== Header ===== */
.header-section {
    background-color: var(--ladam-charcoal);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Transparent header with gradient for visibility */
.header-transparent {
    background: linear-gradient(to bottom, rgba(45, 45, 45, 0.7) 0%, rgba(45, 45, 45, 0.3) 70%, transparent 100%);
    border-bottom: none;
}

/* White text/icons on transparent header */
.header-transparent .header-primary-menu li > .menu-item-link {
    color: var(--ladam-white);
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.header-transparent .header-primary-menu li:hover > .menu-item-link,
.header-transparent .header-primary-menu li > .menu-item-link.active {
    color: var(--ladam-gold-light);
}

.header-transparent .header-primary-menu li > .menu-item-link > span::before {
    background-color: var(--ladam-gold-light);
}

.header-transparent .header-meta__action li button i,
.header-transparent .header-meta__action li a i {
    color: var(--ladam-white);
}

.header-transparent .header-meta__action li button:hover i,
.header-transparent .header-meta__action li a:hover i {
    color: var(--ladam-gold-light);
}

/* Light text on dark header */
.header-primary-menu li > .menu-item-link {
    color: var(--ladam-cream);
    font-weight: 500;
}

.header-primary-menu li:hover > .menu-item-link,
.header-primary-menu li > .menu-item-link.active {
    color: var(--ladam-gold);
}

.header-primary-menu li > .menu-item-link > span::before {
    background-color: var(--ladam-gold);
}

/* Header Icons */
.header-right-action li a i,
.header-meta__action li button i,
.header-meta__action li a i {
    color: var(--ladam-cream);
}

.header-right-action li a:hover i,
.header-meta__action li button:hover i,
.header-meta__action li a:hover i {
    color: var(--ladam-gold);
}

/* Cart Badge */
.header-meta__action .badge.bg-primary,
.cart-count {
    background-color: var(--ladam-gold) !important;
    color: var(--ladam-white);
}

/* Sticky Header - dark background matching footer */
.header-sticky.sticky {
    background: var(--ladam-charcoal) !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.15);
}

.header-sticky.sticky .header-primary-menu li > .menu-item-link {
    color: var(--ladam-cream);
    text-shadow: none;
}

.header-sticky.sticky .header-primary-menu li:hover > .menu-item-link,
.header-sticky.sticky .header-primary-menu li > .menu-item-link.active {
    color: var(--ladam-gold);
}

.header-sticky.sticky .header-meta__action li button i,
.header-sticky.sticky .header-meta__action li a i {
    color: var(--ladam-cream);
}

.header-sticky.sticky .header-meta__action li button:hover i,
.header-sticky.sticky .header-meta__action li a:hover i {
    color: var(--ladam-gold);
}

/* ===== Offcanvas ===== */
.offcanvas {
    background-color: var(--ladam-white);
}

.offcanvas-cart .offcanvas-header {
    border-bottom: 1px solid var(--ladam-border);
}

.offcanvas-cart .offcanvas-title {
    font-family: "Playfair Display", Georgia, serif;
    color: var(--ladam-charcoal);
}

.offcanvas-cart .offcanvas-footer {
    border-top: 1px solid var(--ladam-border);
    background-color: var(--ladam-cream);
}

.mini-cart-item__title {
    font-family: "Playfair Display", Georgia, serif;
    color: var(--ladam-charcoal);
}

.mini-cart-totla .value {
    color: var(--ladam-gold);
    font-weight: 600;
}

/* Mobile Menu */
.offcanvas-menu {
    background-color: var(--ladam-charcoal) !important;
}

.mobile-primary-menu li a {
    color: var(--ladam-cream);
    font-family: "Playfair Display", Georgia, serif;
}

.mobile-primary-menu li a:hover,
.mobile-primary-menu li a.active {
    color: var(--ladam-gold);
}

/* Scroll to Top */
.scroll-top {
    background-color: var(--ladam-gold);
    color: var(--ladam-white);
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(197, 160, 89, 0.4);
}

.scroll-top:hover {
    background-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

/* ===== Footer ===== */
.footer-section,
.footer-section.dark-footer {
    background-color: var(--ladam-charcoal) !important;
    color: var(--ladam-cream);
}

.footer-widget-section {
    padding-top: 80px;
    padding-bottom: 60px;
}

.footer-widget__title,
.dark-footer .footer-widget__title {
    color: var(--ladam-white);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.25rem;
    margin-bottom: 1.5rem;
}

.footer-widget__content,
.footer-widget__content p,
.footer-widget__content a,
.footer-widget__link li a,
.dark-footer .footer-widget__link li a {
    color: rgba(255, 251, 247, 0.75);
    font-size: 0.95rem;
}

.footer-widget__link li a:hover,
.footer-widget__content a:hover,
.dark-footer .footer-widget__link li a:hover {
    color: var(--ladam-gold);
}

.footer-widget__social a,
.dark-footer .footer-widget__social a {
    color: var(--ladam-cream);
    border-color: rgba(255, 251, 247, 0.3);
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid rgba(255, 251, 247, 0.3);
    transition: all 0.3s ease;
}

.footer-widget__social a:hover,
.dark-footer .footer-widget__social a:hover {
    color: var(--ladam-charcoal);
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
}

.footer-copyright,
.footer-copyright-two,
.dark-footer .footer-copyright-two {
    background-color: rgba(0, 0, 0, 0.12);
    border-top: 1px solid rgba(255, 251, 247, 0.06);
    padding: 20px 0;
}

.footer-copyright-text p,
.dark-footer .footer-copyright-text p {
    color: rgba(255, 251, 247, 0.6);
    font-size: 0.875rem;
}

.footer-copyright-text a,
.dark-footer .footer-copyright-text a {
    color: var(--ladam-gold);
}

.footer-copyright-text a:hover {
    color: var(--ladam-gold-light);
}

/* ===== Breadcrumb ===== */
.breadcrumb {
    background-color: var(--ladam-charcoal);
}

.breadcrumb_title {
    font-family: "Playfair Display", Georgia, serif;
    color: var(--ladam-white);
}

.breadcrumb_list li,
.breadcrumb_list li a {
    color: rgba(255, 251, 247, 0.8);
}

.breadcrumb_list li a:hover {
    color: var(--ladam-gold);
}

/* ===== Section Titles ===== */
.section-title__title,
.section-title-02__title,
.section-title-03__title,
.section-title-04__title,
.section-title-05__title,
.section-title-06__title,
.section-title-08__title,
.section-title-09__title {
    font-family: "Playfair Display", Georgia, serif;
    color: var(--ladam-charcoal);
}

.section-title-09__subtitle {
    color: var(--ladam-gold);
    font-family: "Inter", sans-serif;
    font-weight: 600;
    letter-spacing: 0.1em;
}

.section-title-09__btn {
    color: var(--ladam-charcoal);
    border-bottom-color: var(--ladam-charcoal);
}

.section-title-09__btn:hover {
    color: var(--ladam-gold);
    border-bottom-color: var(--ladam-gold);
}

.section-title-09 .btn_black {
    background-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

.section-title-09 .btn_black:hover {
    background-color: var(--ladam-gold);
}

/* ===== Product Cards ===== */
.product-card {
    background-color: var(--ladam-white);
    border: 1px solid rgba(232, 228, 220, 0.7);
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(45, 45, 45, 0.04);
    transition: all 0.25s ease;
}

.product-card:hover {
    box-shadow: 0 8px 30px rgba(45, 45, 45, 0.08);
    border-color: var(--ladam-gold-light);
}

.product-card__title a {
    font-family: "Playfair Display", Georgia, serif;
    color: var(--ladam-charcoal);
}

.product-card__title a:hover {
    color: var(--ladam-gold);
}

.product-card__price {
    color: var(--ladam-gold);
    font-weight: 600;
}

/* Product Actions */
.product-card__action a {
    background-color: var(--ladam-white);
    color: var(--ladam-charcoal);
    border: 1px solid var(--ladam-border);
}

.product-card__action a:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
}

/* ===== Shop Banner / Hero ===== */
.shop-banner {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

/* Warm overlay */
.shop-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(160deg, rgba(60, 40, 15, 0.35) 0%, rgba(45, 30, 10, 0.4) 50%, rgba(35, 25, 10, 0.55) 100%);
    z-index: 1;
}

.shop-banner .container {
    position: relative;
    z-index: 2;
}

/* --- Hero content --- */
.shop-banner_content {
    position: relative;
}

/* --- Hierarchy: subtitle refined, value prop, tagline --- */
.shop-banner .section-title-09__subtitle {
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ladam-gold-light);
    margin-bottom: 0.75rem;
}

.shop-banner_content .section-title-09__title {
    font-size: clamp(2.5rem, 6vw, 5.75rem);
    line-height: 1.15;
    letter-spacing: -0.02em;
}

/* Value proposition line */
.shop-banner_value {
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: rgba(255, 251, 247, 0.75);
    margin-bottom: 0.25rem;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.shop-banner .section-title-09__text {
    font-size: 1.05rem;
    color: rgba(255, 251, 247, 0.85);
    letter-spacing: 0.02em;
}

/* --- CTA --- */
.shop-banner_cta-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.shop-banner_btn-primary {
    background-color: var(--ladam-gold) !important;
    border-color: var(--ladam-gold) !important;
    color: var(--ladam-white) !important;
}

.shop-banner_btn-primary:hover {
    background-color: var(--ladam-gold-hover) !important;
    border-color: var(--ladam-gold-hover) !important;
    box-shadow: 0 6px 24px rgba(197, 160, 89, 0.4) !important;
    transform: translateY(-2px);
}

/* --- Social links: pill style --- */
.shop-banner_social--pills {
    gap: 0.75rem !important;
    margin-top: 30px !important;
}

.shop-banner_social--pills li a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 50px;
    padding: 6px 16px;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    color: rgba(255, 251, 247, 0.8);
    text-transform: none;
    margin-right: 0 !important;
    transition: all 0.25s ease;
    backdrop-filter: blur(4px);
}

.shop-banner_social--pills li a i {
    font-size: 0.85rem;
}

.shop-banner_social--pills li a:hover {
    background: rgba(197, 160, 89, 0.25);
    border-color: var(--ladam-gold-light);
    color: var(--ladam-white);
}

/* --- Mobile responsiveness --- */
@media only screen and (max-width: 767px) {
    .shop-banner {
        min-height: 85vh;
    }

    .shop-banner_content .section-title-09__title {
        font-size: clamp(2rem, 8vw, 2.75rem);
    }

    .shop-banner_value {
        font-size: 0.85rem;
    }

    .shop-banner_social--pills {
        flex-wrap: wrap;
        justify-content: center;
    }

    .shop-banner_social--pills li a {
        padding: 5px 12px;
        font-size: 0.7rem;
    }
}

/* ===== Menu Banner ===== */
.menu-banner {
    background: linear-gradient(135deg, #2D2D2D 0%, #3A3028 50%, #2D2D2D 100%);
    position: relative;
    overflow: hidden;
}

/* Subtle grain texture overlay */
.menu-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 128px 128px;
    opacity: 0.5;
    z-index: 1;
    pointer-events: none;
}

/* Soft vignette */
.menu-banner::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, 0.25) 100%);
    z-index: 1;
    pointer-events: none;
}

.menu-banner > .container {
    position: relative;
    z-index: 2;
}

/* Image container - artisan bakery card feel */
.menu-banner .menu-banner_image {
    border: none;
    padding: 0;
    width: 90%;
    border-radius: 10px;
    overflow: hidden;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 2px 8px rgba(0, 0, 0, 0.2);
    position: relative;
}

.menu-banner .menu-banner_image::before {
    content: '';
    position: absolute;
    top: 6px;
    left: 6px;
    right: 6px;
    bottom: 6px;
    border: 1px solid rgba(255, 251, 247, 0.15);
    border-radius: 6px;
    z-index: 2;
    pointer-events: none;
}

.menu-banner .menu-banner_image a {
    display: block;
    line-height: 0;
}

.menu-banner .menu-banner_image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 10px;
    transition: transform 0.4s ease;
}

.menu-banner .menu-banner_image:hover img {
    transform: scale(1.03);
}

/* Content spacing */
.menu-banner_content .section-title-09 {
    padding-left: 1rem;
}

.menu-banner_content .section-title-09__subtitle {
    font-size: 0.8rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
}

/* Decorative divider */
.menu-banner_divider {
    display: block;
    width: 50px;
    height: 2px;
    background: linear-gradient(90deg, var(--ladam-gold), var(--ladam-gold-light));
    border-radius: 2px;
    margin: 0.75rem 0 1.25rem;
}

.menu-banner_content .section-title-09__title {
    margin-bottom: 1.25rem;
}

.menu-banner_content .section-title-09__text {
    color: rgba(255, 251, 247, 0.8);
    line-height: 1.9;
    max-width: 480px;
    margin-bottom: 1.5rem;
}

/* Trust / Quick Info Row */
.menu-banner_trust {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-bottom: 2rem;
    font-size: 0.8rem;
    color: rgba(255, 251, 247, 0.55);
    letter-spacing: 0.02em;
}

.menu-banner_trust span {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

/* CTA Button - premium artisan feel */
.menu-banner_cta {
    display: inline-block;
    padding: 14px 36px;
    border: 2px solid var(--ladam-white);
    border-radius: 0;
    color: var(--ladam-white);
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.25s ease;
}

.menu-banner_cta:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
    box-shadow: 0 4px 20px rgba(197, 160, 89, 0.35);
    transform: translateY(-2px);
}

.menu-banner_cta:focus-visible {
    outline: 2px solid var(--ladam-gold);
    outline-offset: 3px;
}

/* Mobile adjustments */
@media only screen and (max-width: 767px) {
    .menu-banner .menu-banner_image {
        width: 75%;
        margin: 0 auto 2rem;
    }

    .menu-banner_content .section-title-09 {
        padding-left: 0;
        text-align: center !important;
        align-items: center !important;
    }

    .menu-banner_divider {
        margin-left: auto;
        margin-right: auto;
    }

    .menu-banner_trust {
        justify-content: center;
    }

    .menu-banner_cta {
        padding: 12px 28px;
    }
}

/* ===== Gift Banner ===== */
.gift-banner {
    background-color: var(--ladam-cream-dark);
    position: relative;
}

.gift-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(35, 25, 10, 0.55);
    z-index: 1;
}

.gift-banner::after {
    background-color: transparent !important;
}

.gift-banner > .container {
    position: relative;
    z-index: 2;
}

.gift-banner_offer__text,
.gift-banner_custom__text {
    color: var(--ladam-charcoal);
}

/* ===== Portfolio Banner ===== */
.portfolio-banner {
    background-color: var(--ladam-charcoal);
}

/* ===== Newsletter ===== */
.newsletter-banner {
    background-color: var(--ladam-cream-dark);
    position: relative;
    height: 50vh;
}

.newsletter-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(35, 25, 10, 0.55);
    z-index: 1;
}

.newsletter-banner::after {
    background-color: transparent !important;
}

.newsletter-banner > .container {
    position: relative;
    z-index: 2;
}

.newsletter-banner_form__field {
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
    color: var(--ladam-charcoal);
}

.newsletter-banner_form__field:focus {
    border-color: var(--ladam-gold);
}

.newsletter-banner_form__btn {
    background-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

.newsletter-banner_form__btn:hover {
    background-color: var(--ladam-gold);
}

/* ===== Shop List / Cart ===== */
.shop-product-section {
    background-color: var(--ladam-cream);
}

.cart-table th {
    background-color: var(--ladam-charcoal);
    color: var(--ladam-white);
    font-family: "Playfair Display", Georgia, serif;
}

.cart-table td {
    border-color: var(--ladam-border);
}

.cart-total-table {
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
}

/* ===== Checkout ===== */
.checkout-section {
    background-color: var(--ladam-cream);
}

.order-summary {
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
}

/* ===== My Account ===== */
.my-account-tab-list li a {
    color: var(--ladam-charcoal);
    border-color: var(--ladam-border);
}

.my-account-tab-list li a:hover,
.my-account-tab-list li a.active {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
}

.myaccount-content {
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
}

/* ===== Auth Pages ===== */
.auth-wrapper {
    background-color: var(--ladam-cream);
}

.auth-form-wrapper {
    background-color: var(--ladam-white);
}

.auth-cover::before {
    background: linear-gradient(to right, rgba(45, 45, 45, 0.7), rgba(45, 45, 45, 0.5));
}

/* ===== Cards & Alerts ===== */
.card {
    background-color: var(--ladam-white);
    border-color: var(--ladam-border);
}

.alert-light {
    background-color: var(--ladam-cream-dark);
    border-color: var(--ladam-border);
    color: var(--ladam-charcoal);
}

/* ===== Badges ===== */
.badge.bg-primary {
    background-color: var(--ladam-gold) !important;
}

.badge.bg-dark {
    background-color: var(--ladam-charcoal) !important;
}

/* ===== Tables ===== */
.table {
    color: var(--ladam-charcoal);
}

.table thead th {
    background-color: var(--ladam-charcoal);
    color: var(--ladam-white);
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 500;
}

.table tbody td {
    border-color: var(--ladam-border);
}

/* ===== White Space & Minimal Clutter ===== */

/* Increase section padding for more breathing room */
.section-padding-01,
.section-padding-03,
.section-padding-04,
.section-padding-05 {
    padding-top: 100px;
    padding-bottom: 100px;
}

@media only screen and (max-width: 991px) {
    .section-padding-01,
    .section-padding-03,
    .section-padding-04,
    .section-padding-05 {
        padding-top: 70px;
        padding-bottom: 70px;
    }
}

@media only screen and (max-width: 767px) {
    .section-padding-01,
    .section-padding-03,
    .section-padding-04,
    .section-padding-05 {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

/* Container max-width for better readability */
.custom-container {
    max-width: 1140px;
}

/* Card spacing */
.product-card {
    padding: 20px;
}

/* Form spacing */
.form-group,
.mb-3 {
    margin-bottom: 1.5rem;
}

/* ===== Scrollbar Styling ===== */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--ladam-cream);
}

::-webkit-scrollbar-thumb {
    background: var(--ladam-gold-light);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--ladam-gold);
}

/* ===== Selection Color ===== */
::selection {
    background-color: var(--ladam-gold);
    color: var(--ladam-white);
}

::-moz-selection {
    background-color: var(--ladam-gold);
    color: var(--ladam-white);
}

/* ===== Focus States for Accessibility ===== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid var(--ladam-gold);
    outline-offset: 2px;
}

/* ===== Loading & Transitions ===== */
.fade-in {
    animation: fadeIn 0.5s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Smooth transitions for interactive elements */
a, button, .btn, .card, .product-card, input, textarea {
    transition: all 0.2s ease;
}

/* ===== Mobile Optimizations ===== */
@media only screen and (max-width: 767px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }

    .section-title-09__title {
        font-size: 1.75rem;
    }

    .btn {
        padding: 0 24px;
        height: 48px;
        line-height: 48px;
    }
}

/* ===== B) NAVBAR REFINEMENTS ===== */

/* Slightly larger logo with white pill backdrop */
.header-logo a {
    display: inline-block;
    background-color: rgba(255, 255, 255, 0.85);
    padding: 4px 14px;
    border-radius: 50px;
    backdrop-filter: blur(4px);
    transition: background-color 0.25s ease;
}

.header-transparent .header-logo a,
.header-sticky.sticky .header-logo a {
    background-color: transparent;
    backdrop-filter: none;
}

.header-logo img {
    width: 220px;
    height: auto;
}

/* Thicker, rounded underline on nav links */
.header-primary-menu li > .menu-item-link > span::before {
    height: 2.5px;
    border-radius: 2px;
    transition: transform 0.25s ease;
}

/* Active nav link: gold underline + subtle bold */
.header-primary-menu li > .menu-item-link.active {
    font-weight: 600;
}

.header-primary-menu li > .menu-item-link.active > span::before {
    background-color: var(--ladam-gold) !important;
}

.header-sticky.sticky .header-primary-menu li > .menu-item-link.active > span::before {
    background-color: var(--ladam-gold) !important;
}

/* Tighter icon spacing in header meta */
.header-meta__action {
    gap: 0.15rem;
}

.header-meta__action li .action {
    padding: 6px 8px;
}

/* ===== C) TYPOGRAPHY REFINEMENTS ===== */

/* Warmer section title feel */
.section-title-09__title {
    letter-spacing: -0.02em;
}

/* Stats numbers use serif for warmth */
.stats-section .stat-item span {
    font-family: "Playfair Display", Georgia, serif;
}

/* ===== D) ACCOUNT CTA / LOGIN PILL ===== */

/* Pill-style login button */
.newsletter-banner .btn-dark.btn-hover-primary {
    border-radius: 50px;
    padding: 14px 36px;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    box-shadow: 0 4px 15px rgba(45, 45, 45, 0.15);
    height: auto;
    line-height: 1.5;
}

.newsletter-banner .btn-dark.btn-hover-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(197, 160, 89, 0.3);
}

.newsletter-banner .btn-dark.btn-hover-primary:focus-visible {
    outline: 2px solid var(--ladam-gold);
    outline-offset: 3px;
}

/* Warmer CTA section */
.newsletter-banner .section-title-09__subtitle {
    font-size: 0.85rem;
}

.newsletter-banner .section-title-09__text {
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

/* ===== E) FOOTER REFINEMENTS ===== */

/* Footer link underline animation */
.footer-widget__link li a {
    position: relative;
    display: inline-block;
}

.footer-widget__link li a::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 0;
    height: 1px;
    background-color: var(--ladam-gold);
    transition: width 0.25s ease;
}

.footer-widget__link li a:hover::after {
    width: 100%;
}

/* Footer link spacing */
.footer-widget__link li {
    margin-bottom: 0.5rem;
}

/* Trust badges row in footer */
.footer-trust-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-top: 1.25rem;
    font-size: 0.8rem;
    color: rgba(255, 251, 247, 0.5);
}

.footer-trust-badges span {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

/* ===== F) MICRO-DETAILS ===== */

/* Softer about image */
.about-image img {
    border-radius: 8px;
}

/* Softer offcanvas */
.offcanvas {
    border-radius: 0;
    box-shadow: -4px 0 24px rgba(45, 45, 45, 0.12);
}

/* Softer form controls */
.form-control {
    border-radius: 4px;
}

/* Card softer radius */
.card {
    border-radius: 8px;
}

/* My account tab softer */
.my-account-tab-list li a {
    border-radius: 4px;
}

/* Order summary softer */
.order-summary {
    border-radius: 8px;
}

/* Cart total softer */
.cart-total-table {
    border-radius: 8px;
}

/* Myaccount content softer */
.myaccount-content {
    border-radius: 8px;
}

/* Auth form softer */
.auth-form-wrapper {
    border-radius: 8px;
}

/* Alert softer */
.alert-light {
    border-radius: 6px;
}

/* Hero banner text shadow for readability */
.shop-banner .section-title-09__title {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5), 0 4px 24px rgba(0, 0, 0, 0.3);
}

.shop-banner .section-title-09__text {
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.shop-banner .section-title-09__subtitle {
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

/* Hero & Menu banner button styling - white on dark */
/* Unified button style for hero, menu-banner, gift-banner */
.shop-banner .section-title-09__btn,
.menu-banner .section-title-09__btn,
.gift-banner .section-title-09__btn {
    border: 2px solid var(--ladam-white);
    border-radius: 0;
    color: var(--ladam-white);
    background-color: transparent;
    padding: 14px 36px;
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    line-height: 1.5;
    display: inline-block;
    transition: all 0.25s ease;
}

.shop-banner .section-title-09__btn:hover,
.menu-banner .section-title-09__btn:hover,
.gift-banner .section-title-09__btn:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
    box-shadow: 0 4px 20px rgba(197, 160, 89, 0.35);
    transform: translateY(-2px);
}

/* ==========================================================================
   SHOP PAGE — UI/UX Polish
   ========================================================================== */

/* --- 1) Product Cards: Premium depth & radius --- */
.product-item {
    background-color: var(--ladam-white);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(45, 45, 45, 0.06);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    position: relative;
}

.product-item:hover {
    box-shadow: 0 8px 30px rgba(45, 45, 45, 0.12);
    transform: translateY(-4px);
}

/* --- Product Image Container --- */
.product-item__image {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 10px 10px 0 0;
    position: relative;
    border: none !important;
    width: 100% !important;
    margin: 0 !important;
}

.product-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

/* --- 2) Hover: smooth image zoom + soft overlay --- */
.product-item:hover .product-item__image img {
    transform: scale(1.05);
}

.product-item__image::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, transparent 60%, rgba(45, 45, 45, 0.08) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 1;
}

.product-item:hover .product-item__image::after {
    opacity: 1;
}

/* --- Quick View button polish --- */
.product-item__meta {
    z-index: 2;
}

.product-item__meta-action button {
    background-color: var(--ladam-white) !important;
    border: 1px solid var(--ladam-border) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    border-radius: 50% !important;
    transition: all 0.25s ease !important;
}

.product-item__meta-action button:hover {
    background-color: var(--ladam-gold) !important;
    border-color: var(--ladam-gold) !important;
    color: var(--ladam-white) !important;
    transform: scale(1.08);
}

/* --- 3) Product Content: tighter hierarchy --- */
.product-item__content {
    padding: 16px 16px 20px !important;
}

.product-item__title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.05rem;
    margin-bottom: 6px !important;
}

.product-item__title a {
    color: var(--ladam-charcoal);
    text-decoration: none;
    transition: color 0.2s ease;
}

.product-item__title a:hover {
    color: var(--ladam-gold);
}

.product-item__price {
    display: block;
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ladam-gold) !important;
    margin-bottom: 12px;
}

/* --- Pre-Order / CTA buttons on product cards --- */
.product-item .preorder-btn,
.product-item .btn-outline-dark {
    border-radius: 6px;
    padding: 8px 20px;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: all 0.25s ease;
    height: auto;
    line-height: 1.5;
}

.product-item .preorder-btn {
    background-color: var(--ladam-charcoal);
    border: 2px solid var(--ladam-charcoal);
    color: var(--ladam-white);
}

.product-item .preorder-btn:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
    box-shadow: 0 4px 16px rgba(197, 160, 89, 0.3);
    transform: translateY(-1px);
}

.product-item .btn-outline-dark {
    border: 2px solid var(--ladam-charcoal);
}

.product-item .btn-outline-dark:hover {
    background-color: var(--ladam-charcoal);
    color: var(--ladam-white);
    transform: translateY(-1px);
}

/* --- 4) Product Badge: elegant inset label --- */
.product-item__badge {
    top: 12px !important;
    left: 12px !important;
    z-index: 3;
    background-color: var(--ladam-gold) !important;
    color: var(--ladam-white) !important;
    font-family: "Inter", sans-serif !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 5px 12px !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 8px rgba(197, 160, 89, 0.3);
}

/* Remove the default pennant/ribbon pseudo-elements */
.product-item__badge::before,
.product-item__badge::after {
    display: none !important;
}

/* --- 5) Shop Topbar: Sort + Filter polish --- */
.shop-topbar {
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
    border-radius: 8px;
    padding: 14px 20px;
    margin-bottom: 30px;
}

.shop-topbar-item p {
    font-size: 0.9rem;
    color: var(--ladam-muted);
    margin-bottom: 0;
}

.shop-topbar select {
    background-color: var(--ladam-cream);
    border: 1px solid var(--ladam-border);
    border-radius: 6px;
    padding: 8px 32px 8px 14px;
    font-size: 0.85rem;
    font-family: "Inter", sans-serif;
    color: var(--ladam-charcoal);
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    min-height: 40px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%234A4A4A' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
}

.shop-topbar select:hover {
    border-color: var(--ladam-gold-light);
}

.shop-topbar select:focus {
    border-color: var(--ladam-gold);
    box-shadow: 0 0 0 3px rgba(197, 160, 89, 0.12);
    outline: none;
}

/* --- 6) Hero Banner / Breadcrumb: overlay for readability --- */
.breadcrumb {
    position: relative;
    overflow: hidden;
}

.breadcrumb::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(45, 45, 45, 0.5) 0%, rgba(45, 45, 45, 0.3) 50%, rgba(45, 45, 45, 0.45) 100%);
    z-index: 1;
    pointer-events: none;
}

.breadcrumb > .container {
    position: relative;
    z-index: 2;
}

/* --- 7) Breadcrumb typography polish --- */
.breadcrumb_title {
    font-size: clamp(1.75rem, 4vw, 2.75rem);
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    margin-bottom: 8px;
}

.breadcrumb_list {
    font-size: 0.95rem;
    letter-spacing: 0.03em;
}

.breadcrumb_list li,
.breadcrumb_list li a {
    color: rgba(255, 251, 247, 0.85);
}

.breadcrumb_list li a {
    position: relative;
    text-decoration: none;
}

.breadcrumb_list li a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1px;
    background-color: var(--ladam-gold);
    transition: width 0.25s ease;
}

.breadcrumb_list li a:hover {
    color: var(--ladam-gold);
}

.breadcrumb_list li a:hover::after {
    width: 100%;
}

/* --- 8) Quick View Modal polish --- */
#quickViewModal .modal-content {
    border-radius: 12px;
    border: none;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

#quickViewModal .modal-header {
    padding: 16px 20px 0;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    border: none;
}

#quickViewModal .modal-header .btn-close {
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    opacity: 1;
    transition: all 0.2s ease;
    background-size: 12px;
}

#quickViewModal .modal-header .btn-close:hover {
    background-color: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
    filter: invert(1);
    transform: scale(1.05);
}

#quickViewModal .quick-view-image {
    background-color: var(--ladam-cream);
    border-radius: 8px;
    overflow: hidden;
}

#quickViewModal .quick-view-image img {
    border-radius: 8px;
    width: 100%;
    object-fit: cover;
}

#quickViewModal #qvProductName {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.5rem;
    color: var(--ladam-charcoal);
}

#quickViewModal #qvProductPrice {
    color: var(--ladam-gold) !important;
    font-family: "Inter", sans-serif;
}

/* Quantity selector */
#quickViewModal .quick-view-quantity .input-group {
    flex-wrap: nowrap;
    max-width: 160px;
}

#quickViewModal .qty-minus,
#quickViewModal .qty-plus {
    border-color: var(--ladam-border);
    color: var(--ladam-charcoal);
    font-weight: 600;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

#quickViewModal .qty-minus:hover,
#quickViewModal .qty-plus:hover {
    background-color: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
    color: var(--ladam-white);
}

#quickViewModal #qvQuantity {
    border-color: var(--ladam-border);
    font-weight: 600;
    height: 44px;
    min-width: 50px;
    flex: 1 1 auto;
}

/* Pre-Order button in modal */
#quickViewModal #qvPreOrder,
#quickViewModal .btn-dark.btn-lg {
    background-color: var(--ladam-charcoal);
    border: 2px solid var(--ladam-charcoal);
    border-radius: 6px;
    padding: 14px 24px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transition: all 0.25s ease;
    height: auto;
    line-height: 1.5;
}

#quickViewModal #qvPreOrder:hover,
#quickViewModal .btn-dark.btn-lg:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    box-shadow: 0 4px 16px rgba(197, 160, 89, 0.3);
    transform: translateY(-1px);
}

/* WhatsApp secondary CTA */
.qv-whatsapp-btn {
    display: block;
    width: 100%;
    padding: 12px 24px;
    border: 2px solid #25D366;
    border-radius: 6px;
    background-color: transparent;
    color: #25D366;
    font-family: "Inter", sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    transition: all 0.25s ease;
    height: auto;
    line-height: 1.5;
}

.qv-whatsapp-btn:hover {
    background-color: #25D366;
    color: var(--ladam-white);
    box-shadow: 0 4px 16px rgba(37, 211, 102, 0.3);
    transform: translateY(-1px);
}

.qv-whatsapp-btn i {
    font-size: 1rem;
}

/* Trust info row in modal */
.qv-trust-info {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 16px;
    margin-top: 16px;
    border-top: 1px solid var(--ladam-border);
}

.qv-trust-info span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: var(--ladam-muted);
    letter-spacing: 0.01em;
}

/* --- 9) Section Spacing: tighten shop area --- */
.shop-product-section .section-padding-04 {
    padding-top: 50px;
    padding-bottom: 60px;
}

.shop-product-section .mb-n50 {
    margin-bottom: -30px !important;
}

.shop-product-section .mb-50 {
    margin-bottom: 30px !important;
}

/* --- Pagination --- */
.pg-pagination {
    margin-top: 40px;
    padding-top: 30px;
    border-top: 1px solid var(--ladam-border);
}

.pg-pagination .pagination {
    gap: 6px;
}

.pg-pagination .pagination li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border-radius: 8px;
    border: 1px solid var(--ladam-border);
    background-color: var(--ladam-white);
    color: var(--ladam-charcoal);
    font-family: "Inter", sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.25s ease;
}

.pg-pagination .pagination li a:hover {
    border-color: var(--ladam-gold-light);
    color: var(--ladam-gold);
    box-shadow: 0 2px 8px rgba(197, 160, 89, 0.15);
    transform: translateY(-1px);
}

.pg-pagination .pagination li a.active {
    background-color: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
    color: var(--ladam-white);
    box-shadow: 0 2px 8px rgba(45, 45, 45, 0.2);
}

.pg-pagination .pagination li a.active:hover {
    background-color: var(--ladam-gold);
    border-color: var(--ladam-gold);
    color: var(--ladam-white);
    box-shadow: 0 4px 12px rgba(197, 160, 89, 0.3);
}

/* --- Pre-Order Toast polish --- */
#preorderToast {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
}

#preorderToast .toast-header {
    background-color: var(--ladam-charcoal) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* --- 10) Mobile: shop page responsive --- */
@media only screen and (max-width: 991px) {
    .shop-product-section .section-padding-04 {
        padding-top: 40px;
        padding-bottom: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .product-item__content {
        padding: 14px 14px 18px !important;
    }

    .product-item .preorder-btn,
    .product-item .btn-outline-dark {
        padding: 8px 16px;
        font-size: 0.75rem;
        width: 100%;
    }

    .shop-topbar {
        padding: 12px 16px;
    }

    .shop-topbar select {
        width: 100%;
        min-height: 44px;
    }

    .breadcrumb_title {
        font-size: 1.5rem;
    }

    .breadcrumb_list {
        font-size: 0.85rem;
    }

    #quickViewModal .modal-body {
        padding: 16px;
    }

    #quickViewModal .quick-view-quantity .input-group {
        max-width: 140px;
    }

    .qv-trust-info {
        gap: 0.5rem;
    }

    .qv-trust-info span {
        font-size: 0.7rem;
    }

    .shop-product-section .section-padding-04 {
        padding-top: 30px;
        padding-bottom: 40px;
    }
}

/* ==========================================================================
   HOMEPAGE — Branding & Section Improvements
   ========================================================================== */

/* --- Hero WhatsApp CTA Button --- */
.shop-banner_btn-whatsapp {
    background-color: transparent !important;
    border: 2px solid rgba(255, 255, 255, 0.5) !important;
    color: var(--ladam-white) !important;
    font-size: 0.85rem !important;
}

.shop-banner_btn-whatsapp:hover {
    background-color: #25D366 !important;
    border-color: #25D366 !important;
    color: var(--ladam-white) !important;
    box-shadow: 0 4px 16px rgba(37, 211, 102, 0.35) !important;
}

/* --- Hero Trust Strip --- */
.hero-trust-strip {
    background-color: var(--ladam-charcoal);
    padding: 14px 0;
}

.hero-trust-strip__inner {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.hero-trust-strip__inner span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: "Inter", sans-serif;
    font-size: 0.8rem;
    font-weight: 500;
    color: rgba(255, 251, 247, 0.75);
    letter-spacing: 0.02em;
}

.hero-trust-strip__inner span i {
    color: var(--ladam-gold);
    font-size: 0.9rem;
}

/* --- Services Section --- */
.service-card {
    background-color: var(--ladam-cream);
    border: 1px solid var(--ladam-border);
    border-radius: 10px;
    padding: 28px 24px;
    height: 100%;
    transition: all 0.3s ease;
}

.service-card:hover {
    box-shadow: 0 8px 28px rgba(45, 45, 45, 0.08);
    border-color: var(--ladam-gold-light);
    transform: translateY(-4px);
}

.service-card__icon {
    width: 52px;
    height: 52px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--ladam-gold), var(--ladam-gold-light));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}

.service-card__icon i {
    font-size: 1.3rem;
    color: var(--ladam-white);
}

.service-card__title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.1rem;
    color: var(--ladam-charcoal);
    margin-bottom: 10px;
}

.service-card__text {
    font-size: 0.85rem;
    color: var(--ladam-muted);
    line-height: 1.7;
    margin-bottom: 14px;
}

.service-card__link {
    font-family: "Inter", sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ladam-gold);
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: color 0.2s ease;
}

.service-card__link:hover {
    color: var(--ladam-gold-hover);
}

/* --- Why Choose Us Cards --- */
.why-card {
    padding: 24px 16px;
}

.why-card__icon {
    font-size: 2rem;
    margin-bottom: 12px;
    line-height: 1;
}

.why-card__title {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1rem;
    color: var(--ladam-charcoal);
    margin-bottom: 8px;
}

.why-card__text {
    font-size: 0.82rem;
    color: var(--ladam-muted);
    line-height: 1.6;
    margin-bottom: 0;
}

/* --- Testimonials Section --- */
.testimonial-card {
    background-color: var(--ladam-white);
    border: 1px solid var(--ladam-border);
    border-radius: 10px;
    padding: 28px 24px;
    height: 100%;
    transition: box-shadow 0.3s ease;
}

.testimonial-card:hover {
    box-shadow: 0 6px 24px rgba(45, 45, 45, 0.08);
}

.testimonial-card__stars {
    color: var(--ladam-gold);
    font-size: 1rem;
    letter-spacing: 2px;
    margin-bottom: 14px;
}

.testimonial-card__text {
    font-size: 0.9rem;
    color: var(--ladam-charcoal-light);
    line-height: 1.75;
    font-style: italic;
    margin-bottom: 18px;
}

.testimonial-card__author {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.testimonial-card__author strong {
    font-family: "Playfair Display", Georgia, serif;
    font-size: 0.95rem;
    color: var(--ladam-charcoal);
}

.testimonial-card__author span {
    font-size: 0.78rem;
    color: var(--ladam-muted);
}

/* --- Footer WhatsApp Button --- */
.footer-whatsapp-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 8px 18px;
    border: 1px solid #25D366;
    border-radius: 50px;
    color: #25D366;
    font-family: "Inter", sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.25s ease;
}

.footer-whatsapp-btn:hover {
    background-color: #25D366;
    color: var(--ladam-white);
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
}

.footer-whatsapp-btn i {
    font-size: 1rem;
}

/* --- CTA Section outline button --- */
.newsletter-banner .btn-outline-light {
    border: 2px solid rgba(255, 255, 255, 0.6);
    color: var(--ladam-white);
    border-radius: 50px;
    padding: 14px 36px;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    height: auto;
    line-height: 1.5;
}

.newsletter-banner .btn-outline-light:hover {
    background-color: var(--ladam-white);
    border-color: var(--ladam-white);
    color: var(--ladam-charcoal);
}

/* --- Mobile Responsive for new sections --- */
@media only screen and (max-width: 767px) {
    .header-logo img {
        width: 170px;
    }

    .newsletter-banner .btn-dark.btn-hover-primary {
        padding: 12px 28px;
        font-size: 0.85rem;
    }

    .hero-trust-strip__inner {
        gap: 0.75rem;
        justify-content: center;
    }

    .hero-trust-strip__inner span {
        font-size: 0.7rem;
    }

    .service-card {
        padding: 22px 18px;
    }

    .service-card__title {
        font-size: 1rem;
    }

    .testimonial-card {
        padding: 22px 18px;
    }

    .shop-banner_btn-whatsapp {
        font-size: 0.75rem !important;
        padding: 10px 20px !important;
    }

    .newsletter-banner .btn-outline-light {
        padding: 12px 24px;
        font-size: 0.85rem;
    }
}

/* ==========================================================================
   HOMEPAGE — Mobile Responsiveness
   ========================================================================== */

/* --- Hero Banner: full-width content on mobile, hide side images --- */
@media only screen and (max-width: 575px) {
    .shop-banner {
        height: auto;
        min-height: 80vh;
        padding: 100px 0 60px;
        background-attachment: scroll;
    }

    .shop-banner_content {
        margin-bottom: 0;
    }

    .shop-banner_content .section-title-09__title {
        font-size: clamp(1.75rem, 8vw, 2.5rem);
        line-height: 1.2;
    }

    .shop-banner_value {
        font-size: 0.82rem;
        line-height: 1.6;
    }

    .shop-banner .section-title-09__text {
        font-size: 0.9rem;
    }

    .shop-banner .section-title-09__btn {
        padding: 12px 28px;
        font-size: 0.82rem;
    }
}

/* --- Menu Banner: stack on mobile --- */
@media only screen and (max-width: 767px) {
    .menu-banner {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .menu-banner .menu-banner_image {
        width: 85%;
        margin: 0 auto 2rem;
    }

    .menu-banner_content .section-title-09 {
        padding-left: 0;
        text-align: center !important;
        align-items: center !important;
    }

    .menu-banner_content .section-title-09__title {
        font-size: 1.5rem;
        line-height: 1.3;
    }

    .menu-banner_content .section-title-09__text {
        font-size: 0.88rem;
    }

    .menu-banner_divider {
        margin-left: auto;
        margin-right: auto;
    }

    .menu-banner_trust {
        justify-content: center;
        gap: 0.75rem;
        font-size: 0.75rem;
    }

    .menu-banner_cta {
        display: block;
        text-align: center;
        padding: 12px 24px;
        font-size: 0.82rem;
    }
}

/* --- Gift Banner: proper centering and stacking on mobile --- */
@media only screen and (max-width: 767px) {
    .gift-banner {
        height: auto;
        min-height: auto;
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .gift-banner .row {
        justify-content: center !important;
    }

    .gift-banner .section-title-09__title {
        font-size: 1.75rem;
    }

    .gift-banner .section-title-09__text {
        font-size: 0.88rem;
        line-height: 1.7;
    }

    .gift-banner_info {
        flex-direction: column;
        align-items: center;
        gap: 1.25rem;
        margin: 24px 0 !important;
    }

    .gift-banner_offer {
        margin-right: 0;
        text-align: center;
    }

    .gift-banner_offer__thumb,
    .gift-banner_custom__thumb {
        margin-bottom: 0.5rem !important;
    }

    .gift-banner_offer__thumb svg,
    .gift-banner_custom__thumb svg {
        width: 32px;
        height: 32px;
    }

    .gift-banner_offer__text,
    .gift-banner_custom__text {
        font-size: 0.85rem;
    }

    .gift-banner .section-title-09__btn {
        padding: 12px 28px;
        font-size: 0.82rem;
    }
}

/* --- About Section: mobile adjustments --- */
@media only screen and (max-width: 767px) {
    .about-section {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .about-section .about-content {
        padding-left: 0 !important;
    }

    .about-section .section-title-09__title {
        font-size: 1.5rem;
    }

    .about-section .section-title-09__text {
        font-size: 0.88rem;
    }
}

/* --- Stats Section: mobile grid refinement --- */
@media only screen and (max-width: 575px) {
    .stats-section {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .stats-section .stat-item span {
        font-size: 1.5rem !important;
    }

    .stats-section .stat-item p {
        font-size: 0.78rem !important;
    }
}

/* --- CTA / Newsletter Section: mobile --- */
@media only screen and (max-width: 767px) {
    .newsletter-banner {
        height: auto;
        min-height: auto;
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .newsletter-banner .section-title-09__title {
        font-size: 1.5rem;
    }

    .newsletter-banner .section-title-09__text {
        font-size: 0.88rem;
    }

    .newsletter-banner .footer-widget__social {
        gap: 0.5rem;
    }

    .newsletter-banner .footer-widget__social a {
        width: 36px;
        height: 36px;
    }
}

/* --- Global: disable parallax on mobile for performance --- */
@media only screen and (max-width: 991px) {
    .shop-banner,
    .gift-banner,
    .newsletter-banner {
        background-attachment: scroll !important;
    }
}

/* ==========================================================================
   PAGE TRANSITIONS — Smooth navigation overlay
   ========================================================================== */

/* --- Loading bar at top of page --- */
.page-transition-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ladam-gold), var(--ladam-gold-light));
    z-index: 99999;
    pointer-events: none;
    transition: none;
}

.page-transition-bar.is-loading {
    width: 90%;
    transition: width 1.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-transition-bar.is-complete {
    width: 100%;
    transition: width 0.2s ease-out;
}

.page-transition-bar.is-hidden {
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* --- Page fade out (before navigation) --- */
body.page-fade {
    opacity: 0;
    transition: none;
}

/* --- Page fade in (on new page load) --- */
body.page-fade-in {
    opacity: 1;
}


/* =============================================================================
   iOS Glassmorphism Design System (Customer Pages)
   ============================================================================= */

/* ---- Glass Cards ---- */
.card {
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 16px;
    box-shadow: 0 2px 20px rgba(66, 17, 13, 0.04);
    transition: box-shadow 0.3s ease;
}
.card:hover {
    box-shadow: 0 4px 30px rgba(66, 17, 13, 0.07);
}
.card-header {
    background: transparent;
    border-bottom: 1px solid rgba(66, 17, 13, 0.06);
}

/* ---- Glass Boxes (checkout-box, confirmation-box) ---- */
.checkout-box,
.confirmation-box {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 16px;
    padding: 28px;
    margin-bottom: 20px;
    box-shadow: 0 2px 20px rgba(66, 17, 13, 0.03);
}

/* ---- Account Tab Sidebar ---- */
.my-account-tab-list.nav a {
    border-radius: 12px;
    margin: 2px 6px;
    padding: 10px 18px;
    font-weight: 500;
    font-size: 14px;
    transition: all 0.2s ease;
    color: var(--ladam-charcoal);
}
.my-account-tab-list.nav a:hover {
    background: rgba(212, 175, 55, 0.08);
}
.my-account-tab-list.nav a.active {
    background: rgba(66, 17, 13, 0.07);
    font-weight: 600;
}
.my-account-tab-list.nav a i {
    width: 20px;
    text-align: center;
    margin-right: 8px;
    opacity: 0.6;
}
.my-account-tab-list.nav a.active i {
    opacity: 1;
}

/* ---- Form Controls (Glass Style) ---- */
.form-field,
.form-control,
.form-select {
    border: 1px solid rgba(66, 17, 13, 0.12);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.7);
    font-size: 14px;
    transition: all 0.2s ease;
}
.form-field:focus,
.form-control:focus,
.form-select:focus {
    border-color: var(--ladam-gold);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12);
    background: #fff;
    outline: none;
}

/* ---- Buttons (Rounded, Pill-Like) ---- */
.btn {
    border-radius: 10px;
    font-weight: 500;
    letter-spacing: 0.02em;
    transition: all 0.25s ease;
}
.btn-dark {
    background: var(--ladam-charcoal);
    border-color: var(--ladam-charcoal);
}
.btn-dark:hover {
    background: var(--ladam-charcoal-light);
    border-color: var(--ladam-charcoal-light);
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(66, 17, 13, 0.2);
}
.btn-outline-dark {
    border-color: rgba(66, 17, 13, 0.25);
    color: var(--ladam-charcoal);
}
.btn-outline-dark:hover {
    background: rgba(66, 17, 13, 0.06);
    border-color: var(--ladam-charcoal);
    color: var(--ladam-charcoal);
}

/* ---- Badges (Soft Tint) ---- */
.badge {
    font-weight: 600;
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 8px;
    letter-spacing: 0.3px;
}
.badge.bg-warning {
    background: rgba(255, 193, 7, 0.18) !important;
    color: #664d03 !important;
}
.badge.bg-success {
    background: rgba(40, 167, 69, 0.14) !important;
    color: #0f5132 !important;
}
.badge.bg-info {
    background: rgba(23, 162, 184, 0.14) !important;
    color: #055160 !important;
}
.badge.bg-danger {
    background: rgba(220, 53, 69, 0.14) !important;
    color: #842029 !important;
}
.badge.bg-secondary {
    background: rgba(108, 117, 125, 0.14) !important;
    color: #41464b !important;
}
.badge.bg-dark {
    background: rgba(66, 17, 13, 0.85) !important;
    color: #f5e6a3 !important;
}

/* ---- Tables ---- */
.table {
    --bs-table-bg: transparent;
}
.table-light {
    --bs-table-bg: rgba(255, 255, 255, 0.3) !important;
}
.table thead th {
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #7a6a5a;
    border-bottom: 2px solid rgba(66, 17, 13, 0.08);
}
.table-hover tbody tr:hover {
    background-color: rgba(212, 175, 55, 0.04) !important;
}

/* ---- Alerts (Glass Tinted) ---- */
.alert {
    border-radius: 12px;
    border: none;
}
.alert-light {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(66, 17, 13, 0.06);
    color: var(--ladam-charcoal);
}
.alert-info {
    background: rgba(23, 162, 184, 0.08);
    color: #055160;
}
.alert-success {
    background: rgba(40, 167, 69, 0.08);
    color: #0f5132;
}
.alert-warning {
    background: rgba(255, 193, 7, 0.1);
    color: #664d03;
}
.alert-danger {
    background: rgba(220, 53, 69, 0.08);
    color: #842029;
}

/* ---- Delivery Method Cards ---- */
.delivery-method-btn {
    border-radius: 14px !important;
    border: 1.5px solid rgba(66, 17, 13, 0.12);
    background: rgba(255, 255, 255, 0.5);
    transition: all 0.25s ease;
}
.btn-check:checked + .delivery-method-btn {
    background: rgba(66, 17, 13, 0.06);
    border-color: var(--ladam-charcoal);
}

/* ---- Cart Totals Box ---- */
.cart-totals {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 16px;
    box-shadow: 0 2px 20px rgba(66, 17, 13, 0.04);
}

/* ---- Success Icon (Order Confirmation) ---- */
.success-icon {
    background: linear-gradient(135deg, var(--ladam-gold), var(--ladam-gold-hover)) !important;
    box-shadow: 0 4px 20px rgba(212, 175, 55, 0.3);
}

/* ---- Scrollbar (WebKit) ---- */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: rgba(66, 17, 13, 0.12);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(66, 17, 13, 0.22);
}

/* ---- Quantity Buttons (Cart) ---- */
.quantity-btn {
    border-radius: 8px;
    border: 1px solid rgba(66, 17, 13, 0.12);
    background: rgba(255, 255, 255, 0.6);
    transition: all 0.15s ease;
}
.quantity-btn:hover {
    background: rgba(66, 17, 13, 0.06);
    border-color: rgba(66, 17, 13, 0.2);
}

/* ---- Empty State Styling ---- */
.text-center.py-5 i[style*="font-size: 5rem"] {
    color: rgba(66, 17, 13, 0.1) !important;
}


/* =============================================================================
   Mobile-First Responsive Design
   ============================================================================= */

/* ---- Base touch targets (all screens) ---- */
.quantity-btn {
    min-width: 44px;
    min-height: 44px;
    font-size: 16px;
}
.quantity-input {
    min-height: 44px;
    font-size: 16px;
}

/* ---- Tablets and below (< 992px) ---- */
@media (max-width: 991.98px) {
    /* Checkout/confirmation boxes */
    .checkout-box,
    .confirmation-box {
        padding: 20px;
        border-radius: 14px;
    }

    /* Account sidebar → horizontal scroll on tablet */
    .my-account-tab-list.nav {
        flex-direction: row !important;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding: 8px;
        gap: 4px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .my-account-tab-list.nav::-webkit-scrollbar {
        display: none;
    }
    .my-account-tab-list.nav li {
        flex-shrink: 0;
    }
    .my-account-tab-list.nav a {
        padding: 8px 16px;
        font-size: 13px;
        white-space: nowrap;
        margin: 0;
    }

    /* Headings scale down */
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }
    h4 { font-size: 1.25rem; }
}

/* ---- Mobile (< 768px) ---- */
@media (max-width: 767.98px) {
    /* Typography minimum readability */
    body { font-size: 15px; }
    .btn { font-size: 14px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
    .btn-sm { min-height: 38px; font-size: 13px; }
    .form-control, .form-select, .form-field { font-size: 16px; padding: 12px 14px; }
    .badge { font-size: 11px; padding: 4px 8px; }
    .validation-error { font-size: 13px; }

    /* Cards */
    .card { border-radius: 14px; }
    .checkout-box, .confirmation-box { padding: 18px; border-radius: 12px; }

    /* Product grid: 2 columns on mobile */
    .row-cols-sm-2 > * { flex: 0 0 50%; max-width: 50%; }

    /* Breadcrumbs compact */
    .breadcrumb_title { font-size: 1.5rem !important; }

    /* Cart quantity controls */
    .quantity-btn {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
    .quantity-input {
        width: 56px;
        height: 44px;
        font-size: 16px;
    }

    /* Offcanvas cart qty controls */
    .offcanvas-qty-btn {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }
    .offcanvas-qty-input {
        width: 40px;
        height: 36px;
        font-size: 14px;
    }

    /* Order summary items */
    .order-item { padding: 8px 0; }
    .order-item-name { font-size: 14px; }
    .order-item-price { font-size: 14px; }

    /* Sticky mobile checkout bar - safe area for notched phones */
    #mobileCheckoutBar {
        padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
    }
}

/* ---- Small phones (< 480px) ---- */
@media (max-width: 479.98px) {
    /* Quick View modal - fit viewport */
    #quickViewModal .modal-dialog {
        max-width: 92vw !important;
        margin: 10px auto;
    }
    #quickViewModal .quick-view-image img {
        max-height: 240px;
    }

    /* Product cards: single column on tiny screens */
    .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; }

    /* Checkout layout compact */
    .checkout-box, .confirmation-box { padding: 16px; }

    /* Headings */
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.35rem; }

    /* Bank details table compact */
    .confirmation-box table { font-size: 13px; }
    .confirmation-box table td { padding: 4px 0; }

    /* Account summary cards */
    .card-body.text-center h3 { font-size: 1.5rem; }
}

/* ---- Extra-small phones (< 375px) ---- */
@media (max-width: 374.98px) {
    #quickViewModal .modal-dialog {
        max-width: 96vw !important;
        margin: 6px auto;
    }
    .checkout-box, .confirmation-box { padding: 14px; }
    .btn { font-size: 13px; padding: 8px 14px; }
    h1 { font-size: 1.35rem; }
}
