/* ============================================================
   Ecommerce-specific styles layered on top of the static theme.
   Keeps the existing look while adding shop/cart/checkout/admin UI
   and mobile improvements.
   ============================================================ */

:root {
    --shop-theme: #FFA400;
    --shop-red: #D12525;
    --shop-dark: #1C2539;
}

/* ============================================================
   Ecommerce header — minimal single-row style
   ============================================================ */
/* High z-index so the (fixed) sticky header is never trapped below page
   sections that carry their own z-index. Still below the offcanvas/preloader
   overlays (which live outside this header). */
.shop-header { position: relative; z-index: 1080; font-family: 'Poppins', 'Segoe UI', system-ui, -apple-system, sans-serif; }
.shop-header a, .shop-header button, .shop-header input { font-family: inherit; }

/* Honeypot anti-spam field — hidden from real users (display:none also stops
   browser/password-manager autofill, which caused false "spam" rejections). */
.hp-field { display: none !important; }

/* Home delivery timing notice */
.delivery-timing-bar {
    background: #fff4e5; border-top: 1px solid #ffe0ad; border-bottom: 1px solid #ffe0ad;
    color: #8a5300; text-align: center; padding: 12px 0; font-size: 15px; font-weight: 500;
}
.delivery-timing-bar .fa { color: var(--shop-theme); margin-right: 6px; }
.delivery-timing-bar strong { color: var(--shop-dark); }

/* Announcement bar */
.announcement-bar {
    background: linear-gradient(90deg, var(--shop-dark), #2b3957 50%, var(--shop-dark));
    color: #fff; text-align: center;
    font-size: 13px; font-weight: 500; letter-spacing: .3px; padding: 6px 0;
}
.announcement-bar span { display: inline-block; }

/* Main header row: ☰ | logo | search | icons */
.shop-header-main { background: #fff; box-shadow: 0 2px 14px rgba(0,0,0,.05); border-bottom: 1px solid #f0ece3; position: relative; }
.header-main-row { padding: 8px 0; gap: 18px; }
.shop-header-main .logo { flex: 0 0 auto; }
.shop-header-main .logo img { max-height: 62px; width: auto; transition: max-height .25s ease; }
/* Sticky header on scroll — solid bg + high stacking so page content
   never bleeds through, with a compact logo. */
.shop-header-main.sticky {
    position: fixed !important; top: 0 !important; left: 0; right: 0; width: 100%;
    z-index: 1080 !important; background: #fff !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.12); animation: slideDown .4s;
}
.shop-header-main.sticky .header-main-row { padding: 5px 0; }
.shop-header-main.sticky .logo img { max-height: 46px; }
@keyframes slideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }

/* Inline search grows to fill the centre of row 1 */
.header-search-inline { flex: 1 1 auto; max-width: 620px; margin-left: 8px; margin-right: auto; }

/* Account / Cart actions (icon + two-line label) */
.header-icons { flex: 0 0 auto; gap: 4px; }
.header-action {
    display: inline-flex; align-items: center; gap: 10px; padding: 8px 12px;
    border-radius: 10px; color: var(--shop-dark); transition: background .2s; text-decoration: none;
}
.header-action:hover { background: #faf5ea; color: var(--shop-dark); }
.header-action:active { transform: scale(.97); }
.header-action-icon { position: relative; display: inline-flex; font-size: 22px; line-height: 1; }
.header-action-text { display: flex; flex-direction: column; line-height: 1.2; text-align: left; }
.header-action-text small { font-size: 11px; color: #8a8f9a; }
.header-action-text strong { font-size: 14px; font-weight: 600; color: var(--shop-dark); }
.header-action-text strong .fa { font-size: 11px; opacity: .7; }
.header-cart .cart-count-badge {
    position: absolute; top: -7px; right: -9px;
    background: var(--shop-red); color: #fff; font-size: 10px; font-weight: 700;
    line-height: 1; padding: 3px 5px; border-radius: 50%; min-width: 17px; text-align: center;
    border: 2px solid #fff; box-shadow: 0 2px 6px rgba(209,37,37,.4);
}

/* ====================================================================
   Categories bar (row 2, desktop)
   ==================================================================== */
.header-cats { border-top: 1px solid #f0ece3; background: #fff; }
.header-cats-row { gap: 0; }

/* Inline category links (centered) */
.cats-nav { flex: 1 1 auto; min-width: 0; }
.cats-nav > ul {
    display: flex; align-items: center; justify-content: center; gap: 2px; margin: 0; padding: 0;
    list-style: none; flex-wrap: wrap;
}
.cats-nav > ul > li { position: relative; }
.cats-nav > ul > li > a {
    display: block; padding: 13px 15px; color: #2c3345; font-weight: 500; font-size: 14.5px; white-space: nowrap; transition: color .2s;
}
.cats-nav > ul > li > a .fa { font-size: 11px; opacity: .7; margin-left: 2px; }
.cats-nav > ul > li > a:hover { color: var(--shop-theme); }
/* Inline dropdown submenu */
.cats-nav .submenu {
    position: absolute; top: 100%; left: 0; background: #fff; min-width: 220px; list-style: none;
    margin: 0; padding: 8px 0; border-radius: 0 0 12px 12px; box-shadow: 0 14px 30px rgba(0,0,0,.13);
    opacity: 0; visibility: hidden; transform: translateY(10px); transition: all .25s ease; z-index: 200;
}
.cats-nav .has-dropdown:hover > .submenu { opacity: 1; visibility: visible; transform: translateY(0); }
.cats-nav .submenu li a { display: block; padding: 10px 20px; color: #555; font-size: 14px; font-weight: 500; }
.cats-nav .submenu li a:hover { background: #faf5ea; color: var(--shop-theme); padding-left: 24px; }

/* Keep the sticky header compact — drop the categories row on scroll */
.shop-header-main.sticky .header-cats { display: none; }

/* Inline search bar */
.header-search { position: relative; }
/* (sizing for .header-search-inline lives in the slim top-bar block above) */
.header-search-mobile { width: 100%; }
.header-search input {
    width: 100%; border: 1.5px solid #e6e1d6; border-radius: 30px; padding: 11px 52px 11px 22px;
    font-size: 14px; outline: none; color: #333; background: #faf9f6;
    transition: border-color .2s, background .2s, box-shadow .2s;
}
.header-search input::placeholder { color: #999; opacity: 1; }
.header-search input:focus { border-color: var(--shop-theme); background: #fff; box-shadow: 0 0 0 4px rgba(255,164,0,.12); }
.header-search button {
    position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    background: var(--shop-theme); color: #fff; border: 0; width: 38px; height: 38px;
    border-radius: 50%; cursor: pointer; font-size: 15px; transition: background .2s, transform .15s;
}
.header-search button:hover { background: #e89400; }
.header-search button:active { transform: translateY(-50%) scale(.92); }

/* Account dropdown menu (Bootstrap) */
.header-account .dropdown-menu { border: 0; box-shadow: 0 10px 30px rgba(0,0,0,.12); border-radius: 12px; padding: 8px; min-width: 210px; }
.header-account .dropdown-header { font-weight: 700; color: var(--shop-dark); }
.header-account .dropdown-item { border-radius: 8px; padding: 9px 12px; }
.header-account .dropdown-item i { width: 18px; color: var(--shop-theme); }
.header-account .dropdown-item.text-danger i { color: var(--shop-red); }

/* ====================================================================
   Mobile menu button + slide-in drawer (sidebar)
   ==================================================================== */
.m-menu-btn {
    display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 42px; height: 40px; padding: 9px; flex: 0 0 auto;
    background: #fff; border: 1.5px solid #e6e1d6; border-radius: 10px; cursor: pointer;
    transition: border-color .2s, background .2s;
}
.m-menu-btn:hover { border-color: var(--shop-theme); }
.m-menu-btn span { display: block; height: 2px; width: 100%; background: var(--shop-dark); border-radius: 2px; transition: transform .3s, opacity .25s; }
.m-menu-btn.is-active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.m-menu-btn.is-active span:nth-child(2) { opacity: 0; }
.m-menu-btn.is-active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.m-drawer-overlay {
    position: fixed; inset: 0; background: rgba(15,20,33,.5); z-index: 1090;
    opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease;
}
.m-drawer-overlay.open { opacity: 1; visibility: visible; }

.m-drawer {
    position: fixed; top: 0; left: 0; bottom: 0; width: 320px; max-width: 86vw; z-index: 1100;
    background: #fff; display: flex; flex-direction: column;
    transform: translateX(-100%); transition: transform .32s cubic-bezier(.4,0,.2,1);
    box-shadow: 6px 0 30px rgba(0,0,0,.18); overflow: hidden;
}
.m-drawer.open { transform: translateX(0); }

.m-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid #eee; flex: 0 0 auto; }
.m-drawer-logo img { max-height: 50px; width: auto; }
.m-drawer-close {
    width: 40px; height: 40px; border: 0; border-radius: 50%; background: #f4f0e8; color: var(--shop-dark);
    cursor: pointer; transition: background .2s, color .2s; font-size: 16px;
}
.m-drawer-close:hover { background: var(--shop-theme); color: #fff; }

/* User / auth */
.m-drawer-user {
    display: flex; align-items: center; gap: 12px; margin: 16px 16px 6px; padding: 13px 15px;
    border-radius: 12px; background: linear-gradient(135deg, var(--shop-dark), #2a3550); color: #fff;
}
.m-drawer-user:hover { color: #fff; }
.m-drawer-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--shop-theme); color: var(--shop-dark); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 17px; flex: 0 0 auto; }
.m-drawer-user-meta { display: flex; flex-direction: column; line-height: 1.25; }
.m-drawer-user-meta small { color: #b9c1d4; font-size: 12px; }
.m-drawer-user-meta strong { font-size: 15px; }
.m-drawer-user .fa-angle-right { color: #b9c1d4; }
.m-drawer-auth { display: flex; gap: 10px; margin: 16px 16px 6px; }
.m-drawer-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 10px; border-radius: 10px; font-weight: 600; font-size: 14px; transition: .2s; }
.m-drawer-btn.solid { background: var(--shop-theme); color: #fff; }
.m-drawer-btn.solid:hover { background: #e89400; color: #fff; }
.m-drawer-btn.ghost { background: #fff; color: var(--shop-dark); border: 1.5px solid #e3e0d8; }
.m-drawer-btn.ghost:hover { border-color: var(--shop-theme); color: var(--shop-theme); }

/* Nav (scrollable) */
.m-drawer-nav { flex: 1 1 auto; overflow-y: auto; padding: 10px 12px 16px; }
.m-drawer-link { display: flex; align-items: center; gap: 12px; padding: 12px 12px; border-radius: 9px; color: #2c3345; font-weight: 500; font-size: 15px; transition: background .18s, color .18s; }
.m-drawer-link i { width: 18px; text-align: center; color: var(--shop-theme); }
.m-drawer-link:hover { background: #faf5ea; color: var(--shop-theme); }
.m-drawer-link.text-danger i { color: var(--shop-red); }
.m-drawer-link.text-danger:hover { background: #fdecea; color: var(--shop-red); }

/* Category accordion */
.m-drawer-acc-toggle {
    width: 100%; display: flex; align-items: center; justify-content: space-between;
    background: none; border: 0; cursor: pointer; padding: 12px 12px; border-radius: 9px;
    color: #2c3345; font-weight: 500; font-size: 15px; transition: background .18s, color .18s;
}
.m-drawer-acc-toggle span { display: inline-flex; align-items: center; gap: 12px; }
.m-drawer-acc-toggle span i { width: 18px; text-align: center; color: var(--shop-theme); }
.m-drawer-acc-toggle:hover { background: #faf5ea; color: var(--shop-theme); }
.m-drawer-acc-caret { transition: transform .25s ease; font-size: 13px; color: #9aa0ad; }
.m-drawer-acc.open .m-drawer-acc-caret { transform: rotate(180deg); }
.m-drawer-acc-panel { display: none; padding: 2px 0 6px 30px; }
.m-drawer-acc.open .m-drawer-acc-panel { display: block; }
.m-drawer-acc-panel a { display: block; padding: 9px 12px; border-radius: 8px; color: #5a6072; font-size: 14px; font-weight: 500; transition: background .18s, color .18s; }
.m-drawer-acc-panel a:hover { background: #faf5ea; color: var(--shop-theme); }

/* Footer */
.m-drawer-foot { flex: 0 0 auto; padding: 14px 16px 18px; border-top: 1px solid #eee; }
.m-drawer-cart {
    display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%;
    background: var(--shop-theme); color: #fff; font-weight: 600; padding: 13px 16px; border-radius: 10px;
}
.m-drawer-cart:hover { background: #e89400; color: #fff; }
.m-drawer-social { display: flex; gap: 10px; justify-content: center; margin-top: 14px; }
.m-drawer-social a { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #f4f0e8; color: var(--shop-dark); transition: .2s; }
.m-drawer-social a:hover { background: var(--shop-theme); color: #fff; }

@media (max-width: 991px) {
    .shop-header-main .logo img { max-height: 60px; }
    .announcement-bar { font-size: 12px; padding: 4px 0; }
    /* Inline search is hidden below 992px, so push the icon cluster right. */
    .header-main-row { gap: 10px; }
    .header-icons { margin-left: auto; }
}

@media (max-width: 575px) {
    .shop-header-main .logo img { max-height: 50px; }
    .header-main-row { padding: 8px 0; gap: 8px; }
    .header-action { padding: 7px 8px; gap: 0; }
    .header-action-icon { font-size: 20px; }
}

/* Drawer is desktop-irrelevant — never show its parts ≥992px */
@media (min-width: 992px) {
    .m-drawer, .m-drawer-overlay, .m-menu-btn { display: none !important; }
}

/* ====================================================================
   Hero section — mobile responsive overrides
   (vendor theme forces height:300px and oversized headings on mobile)
   ==================================================================== */
@media (max-width: 991px) {
    .hero-section .hero-1 {
        height: auto !important; min-height: 380px; padding: 60px 0;
        display: flex; align-items: center;
        background-position: center; background-size: cover;
    }
    .hero-section .hero-1 > .container { width: 100%; }
    .hero-section .hero-1 .row { justify-content: center; }
    .hero-1 .hero-content { text-align: center; }
    .hero-1 .hero-content h1,
    .hero-1 .hero-content h1.h1-new {
        font-size: 46px; line-height: 1.15; text-shadow: 0 2px 10px rgba(0,0,0,.35);
    }
    .hero-1 .hero-content p { font-size: 16px; text-shadow: 0 1px 6px rgba(0,0,0,.3); }
    .hero-1 .hero-content .theme-btn { margin-top: 22px !important; }
}

@media (max-width: 767px) {
    .hero-section .hero-1 { min-height: 340px; padding: 50px 0; }
    .hero-1 .hero-content h1,
    .hero-1 .hero-content h1.h1-new { font-size: 36px; }
    .hero-1 .hero-content p { font-size: 14px; margin-bottom: 6px; }
    .hero-1 .hero-content .theme-btn { padding: 11px 24px; font-size: 14px; }
    .hero-section .swiper-dot { bottom: 16px; padding-top: 0 !important; }
}

@media (max-width: 480px) {
    .hero-section .hero-1 { min-height: 280px; padding: 44px 0; }
    .hero-1 .hero-content h1,
    .hero-1 .hero-content h1.h1-new { font-size: 28px; }
}

/* ---------- Buttons ---------- */
.theme-btn.btn-sm { padding: 9px 18px; font-size: 14px; border-radius: 8px; }
.theme-btn.bg-red-2 { background-color: var(--shop-red); }
.theme-btn[disabled], .theme-btn.disabled { opacity: .55; cursor: not-allowed; }

/* ---------- Product cards ---------- */
.shop-card {
    background: #fff;
    padding: 0;                       /* full-bleed image */
    height: 100%;
    border: 1px solid #ececec;
    box-shadow: 0 4px 18px rgba(0,0,0,.04);
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
    margin-bottom: 26px;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
}
/* Neutralise the base theme's orange "fill on hover" so shop cards stay
   clean white with a subtle lift — keeps text and buttons readable. */
.shop-card::before { display: none !important; }
.shop-card, .shop-card:hover { background: #fff; }
.shop-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 36px rgba(0,0,0,.13);
    border-color: var(--shop-theme);
}

/* Image — edge-to-edge, responsive (scales with card width), zooms on hover */
.shop-card .catagory-product-image { position: relative; overflow: hidden; background: #f7f5f0; aspect-ratio: 4 / 3; }
.shop-card .catagory-product-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.shop-card:hover .catagory-product-image img { transform: scale(1.07); }

/* Content area (padded) */
.shop-card .catagory-product-content {
    display: flex; flex-direction: column; align-items: center; flex: 1; width: 100%;
    padding: 12px 14px 14px;
}
/* Title clamped to 2 lines (no reserved blank line under short titles) */
.shop-card h4 {
    font-size: 16px; margin: 0 0 6px; line-height: 1.3; font-weight: 600;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.shop-card h4 a, .shop-card:hover h4 a { color: var(--shop-dark) !important; transition: color .2s; }
.shop-card h4 a:hover { color: var(--shop-theme) !important; }

/* The base theme turns every card <span> white on hover, which hides the
   price/unit/variant text on our white cards — restore readable colours. */
.shop-card:hover .card-price-val { color: var(--shop-red) !important; }
.shop-card:hover .card-price .unit,
.shop-card:hover .card-unit-val { color: #9a9a9a !important; }
.shop-card:hover .card-price .mrp,
.shop-card:hover .card-mrp-val { color: #b0b0b0 !important; }
.shop-card:hover .card-variant span { color: #5a6072 !important; }
.shop-card:hover .card-variant input:checked + span { color: #fff !important; }

/* Price / enquiry note */
.shop-card .card-price {
    font-size: 18px; font-weight: 700; color: var(--shop-red);
    margin: 0 0 8px; display: flex; align-items: center; justify-content: center; gap: 6px;
}
.shop-card .card-price .unit { font-size: 13px; font-weight: 500; color: #9a9a9a; }
.shop-card .enquiry-note {
    font-size: 14px; font-weight: 500; color: #9a9a9a; text-transform: uppercase; letter-spacing: .5px;
}

/* CTA pinned to the bottom — full width, clean icon + text */
.shop-card .card-cta { margin-top: auto; width: 100%; }
.shop-card .theme-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; max-width: none; padding: 10px 16px; line-height: 1; white-space: nowrap; font-weight: 600; font-size: 14px;
}
.shop-card .theme-btn .button-icon { display: inline-flex; }

/* Equal-height cards across slider columns — so prices & CTAs line up even
   when some products have variant pills and others don't. */
.food-catagory-slider .swiper-wrapper,
.brand-slider .swiper-wrapper,
.gift-pack-slider .swiper-wrapper { align-items: stretch; }
.food-catagory-slider .swiper-slide,
.brand-slider .swiper-slide,
.gift-pack-slider .swiper-slide { height: auto; display: flex; }
.food-catagory-slider .shop-card,
.brand-slider .shop-card,
.gift-pack-slider .shop-card { width: 100%; margin-bottom: 0; }

/* Variant (weight/size) pills on the card */
.shop-card .card-variants { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0 0 10px; }
.shop-card .card-variant { margin: 0; cursor: pointer; }
.shop-card .card-variant input { position: absolute; opacity: 0; width: 0; height: 0; }
.shop-card .card-variant span {
    display: inline-block; padding: 5px 11px; font-size: 12.5px; font-weight: 600; line-height: 1.4;
    border: 1px solid #e2ddd2; color: #5a6072; background: #fff; transition: border-color .18s, color .18s, background .18s;
}
.shop-card .card-variant:hover span { border-color: var(--shop-theme); color: var(--shop-theme); }
.shop-card .card-variant input:checked + span { background: var(--shop-dark); border-color: var(--shop-dark); color: #fff; }
.shop-card .card-variant input:checked + span:hover { color: #fff; }
.shop-card .card-variant input:focus-visible + span { outline: 2px solid var(--shop-theme); outline-offset: 1px; }

.badge-enquiry {
    position: absolute; top: 10px; left: 10px; z-index: 2;
    background: var(--shop-theme); color: #1c2539;
    font-size: 10.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
    padding: 5px 11px; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,.2);
    display: inline-flex; align-items: center; gap: 5px; line-height: 1;
}
.badge-enquiry::before { content: "\f0e0"; font-family: FontAwesome; font-size: 10px; }

/* ---------- Inner page banner ---------- */
.page-banner {
    position: relative; background-size: cover; background-position: center;
    padding: 80px 0; text-align: center; overflow: hidden;
}
.page-banner-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(rgba(28,37,57,.55), rgba(28,37,57,.78));
}
.page-banner-content { position: relative; z-index: 2; }
.page-banner-content h1 {
    color: #fff; font-size: 46px; margin: 0 0 14px; text-transform: uppercase; letter-spacing: 1px;
    text-shadow: 0 2px 12px rgba(0,0,0,.3);
}
.page-banner-crumbs {
    list-style: none; display: flex; justify-content: center; align-items: center;
    gap: 8px; margin: 0; padding: 0; flex-wrap: wrap;
}
.page-banner-crumbs li { color: #ffd9a0; font-size: 15px; font-weight: 600; }
.page-banner-crumbs li a { color: #fff; }
.page-banner-crumbs li a:hover { color: var(--shop-theme); }
.page-banner-crumbs li.current { color: var(--shop-theme); }
.page-banner-crumbs li i { color: #cbd0db; font-size: 12px; }
@media (max-width: 767px) {
    .page-banner { padding: 50px 0; }
    .page-banner-content h1 { font-size: 30px; }
}

/* ---------- Product detail: variant (weight/size) options ---------- */
/* Theme fixes each box to 180px which forces wrapping — make them compact
   so all options sit on one line. */
.product-details-content .product_variant.size { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.product-details-content .middle label { margin: 0 !important; }
.product-details-content .middle .box {
    width: auto; min-width: 64px; height: 40px; margin-top: 0; padding: 0 18px;
    display: inline-flex; align-items: center; justify-content: center; border-radius: 0;
}
.product-details-content .middle .box span { position: static; line-height: 1; }

/* ---------- Product detail price block ---------- */
.pd-price-box { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.pd-price-box .pd-current { font-size: 30px; font-weight: 700; color: var(--shop-dark); line-height: 1; }
.pd-price-box .pd-current .fa-inr { font-size: 24px; }
.pd-price-box .pd-unit { font-size: 15px; color: #888; font-weight: 500; }
.pd-price-box .pd-mrp { font-size: 18px; color: #9a9a9a; text-decoration: line-through; font-weight: 500; }
.pd-price-box .pd-off {
    background: #e8f6ec; color: #1f9d57; font-size: 13px; font-weight: 700;
    padding: 4px 10px; border-radius: 6px; letter-spacing: .3px;
}
.pd-price-box .pd-tax { flex-basis: 100%; font-size: 12px; color: #999; margin-top: 2px; }

/* Product card pricing + discount */
.shop-card .card-price .mrp { font-size: 14px; color: #a0a0a0; text-decoration: line-through; font-weight: 500; }
.shop-card .badge-discount {
    position: absolute; top: 10px; right: 10px; z-index: 2;
    background: var(--shop-red); color: #fff; font-size: 11px; font-weight: 700;
    padding: 4px 9px; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,.2);
}
.shop-card .badge-oos {
    position: absolute; top: 10px; left: 10px; z-index: 2;
    background: #6c757d; color: #fff; font-size: 11px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .3px; padding: 5px 11px; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,.2);
}
.shop-card.is-oos .catagory-product-image img { filter: grayscale(60%) opacity(.7); }
.shop-card .theme-btn.disabled { background: #d8d8d8; color: #777; cursor: not-allowed; pointer-events: none; }

/* ---------- Section helper ---------- */
.shop-section { padding: 70px 0; }
.shop-section .section-title { margin-bottom: 35px; }

/* ---------- Category sidebar ---------- */
.shop-sidebar { background:#fff; border-radius:14px; padding:22px; box-shadow:0 6px 22px rgba(0,0,0,.05); }

/* Mobile collapsible filter toggle */
.shop-filter-toggle {
    width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px;
    background:var(--shop-dark); color:#fff; border:0; padding:13px 16px; font-weight:600; font-size:15px; cursor:pointer;
}
.shop-filter-toggle .fa-sliders { color:var(--shop-theme); margin-right:6px; }
.shop-filter-caret { transition:transform .25s ease; }
.shop-sidebar.open .shop-filter-caret { transform:rotate(180deg); }
@media (min-width: 992px) {
    .shop-filter-toggle { display:none; }
}
@media (max-width: 991px) {
    /* The toggle becomes the card header; body collapses below it. */
    .shop-sidebar { padding:0; background:transparent; box-shadow:none; }
    .shop-sidebar-body {
        display:none; background:#fff; padding:18px; box-shadow:0 6px 22px rgba(0,0,0,.05); margin-top:2px;
    }
    .shop-sidebar.open .shop-sidebar-body { display:block; }
}
.shop-sidebar h5 { margin-bottom:14px; font-size:18px; padding-bottom:10px; border-bottom:2px solid var(--shop-theme); display:inline-block; }
.shop-sidebar ul { list-style:none; padding:0; margin:0; }
.shop-sidebar ul li { margin-bottom:2px; }
.shop-sidebar ul li a {
    display:block; padding:9px 12px; color:#3a3a3a; border-radius:0; line-height:1.35;
    /* weight stays constant between normal and hover so text never reflows to 2 lines */
    font-weight:500;
    transition: background .2s ease, color .2s ease, padding-left .2s ease;
}
/* Squared search field + button in the sidebar */
.shop-sidebar .form-control { border-radius:0; }
.shop-sidebar .theme-btn { border-radius:0; }
.shop-sidebar ul li a:hover { background:#fff6e6; color:var(--shop-theme); padding-left:16px; }
.shop-sidebar ul li a.active { background:var(--shop-theme); color:#fff; font-weight:600; }
/* Sub-categories */
.shop-sidebar ul ul { margin:2px 0 6px 10px; padding-left:10px; border-left:2px solid #f0ece3; }
.shop-sidebar ul ul li a { font-size:14px; padding:7px 12px; color:#666; }
.shop-sidebar ul ul li a.active { color:#fff; }

/* ---------- Quantity selector ---------- */
.qty-box { display:inline-flex; align-items:center; border:1px solid #e2ddd2; border-radius:8px; overflow:hidden; background:#fff; }
.qty-box button { background:#f4f1ea; border:0; width:42px; height:44px; font-size:18px; line-height:1; color:#1c2539; cursor:pointer; transition:background .2s; }
.qty-box button:hover { background:#ece7db; color:var(--shop-theme); }
.qty-box input.qty-input {
    width:60px; height:44px; text-align:center; border:0;
    border-left:1px solid #e2ddd2; border-right:1px solid #e2ddd2;
    color:#1c2539 !important; font-size:16px; font-weight:600; background:#fff;
    -moz-appearance:textfield; appearance:textfield;
}
.qty-box input.qty-input::-webkit-outer-spin-button,
.qty-box input.qty-input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.qty-max-note { display:block; margin-top:6px; }

/* Equal-size action buttons */
.pd-actions { display:flex; gap:12px; flex-wrap:wrap; }
.pd-actions .theme-btn {
    flex:1 1 0; min-width:160px; display:inline-flex; align-items:center;
    justify-content:center; gap:8px; padding:13px 20px;
}

/* Stock status */
.pd-stock-status { font-size:18px; font-weight:700; margin:10px 0; display:inline-flex; align-items:center; gap:8px; }
.pd-stock-status.out { color:var(--shop-red); }

/* ---------- Cart / checkout tables ---------- */
.cart-table { width:100%; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 6px 22px rgba(0,0,0,.05); }
.cart-table th { background:var(--shop-dark); color:#fff; padding:14px; font-weight:600; }
.cart-table td { padding:14px; border-bottom:1px solid #f0ece3; vertical-align:middle; }
.cart-table img { width:64px; height:64px; object-fit:cover; border-radius:8px; }
.cart-summary { background:#fff; border-radius:12px; padding:26px; box-shadow:0 6px 22px rgba(0,0,0,.05); }
.cart-summary h5 {
    font-size:18px; font-weight:600; color:var(--shop-dark); text-transform:uppercase; letter-spacing:.6px;
    margin:0 0 18px; padding-bottom:12px; border-bottom:1px solid #f0ece3; position:relative;
}
.cart-summary h5::after { content:""; position:absolute; left:0; bottom:-1px; width:46px; height:2px; background:var(--shop-theme); }
.cart-summary .row-line { display:flex; justify-content:space-between; padding:10px 0; color:#5a6072; font-size:16px; }
.cart-summary .row-line > span:last-child { color:var(--shop-dark); font-weight:500; }
.cart-summary .row-line.total { border-top:2px solid #f0ece3; margin-top:10px; padding-top:14px; font-size:22px; font-weight:700; color:var(--shop-dark); }
.cart-summary .row-line.total > span:last-child { color:var(--shop-red); font-weight:700; }

/* ---------- Forms ---------- */
.shop-form { background:#fff; border-radius:14px; padding:30px; box-shadow:0 4px 18px rgba(0,0,0,.05); }
/* Section headings (Billing, Shipping, Payment…) */
.shop-form h4 {
    font-size:18px; font-weight:600; color:var(--shop-dark); text-transform:uppercase; letter-spacing:.6px;
    margin:0 0 22px; padding-bottom:12px; border-bottom:1px solid #f0ece3; position:relative;
}
.shop-form h4::after { content:""; position:absolute; left:0; bottom:-1px; width:46px; height:2px; background:var(--shop-theme); }
/* Lighter, calmer field labels */
.shop-form label { font-weight:500; font-size:15px; color:#6b7280; margin-bottom:7px; display:block; letter-spacing:.2px; }
.shop-form .form-control, .shop-form .form-select {
    border:1px solid #e2ddd2; border-radius:0; padding:13px 15px; margin-bottom:4px; width:100%;
    font-size:16px; color:#2c3345; background:#fcfbf9; transition:border-color .2s, background .2s, box-shadow .2s;
}
.shop-form .form-control::placeholder { color:#b3b3b3; }
.shop-form .form-control:focus, .shop-form .form-select:focus {
    border-color: var(--shop-theme); background:#fff; box-shadow:0 0 0 3px rgba(255,164,0,.12); outline:none;
}
.field-error { font-size:13px; }
.shop-form .form-control.is-invalid { border-color: var(--shop-red); background:#fff8f8; box-shadow:0 0 0 3px rgba(209,37,37,.1); }
.form-group { margin-bottom:18px; }

/* ---------- Auth tabs ---------- */
.auth-card { max-width:480px; margin:0 auto; }
.auth-toggle { display:flex; gap:10px; margin-bottom:22px; }
.auth-toggle button { flex:1; padding:12px; border:1px solid #e2ddd2; background:#fff; border-radius:8px; font-weight:600; cursor:pointer; }
.auth-toggle button.active { background:var(--shop-theme); color:#fff; border-color:var(--shop-theme); }

/* ---------- Account dashboard ---------- */
.account-nav { background:#fff; border-radius:14px; padding:18px; box-shadow:0 6px 22px rgba(0,0,0,.05); }
.account-nav a { display:block; padding:11px 14px; border-radius:8px; color:#333; transition:background .15s,color .15s; }
.account-nav a i { width:20px; text-align:center; margin-right:6px; }
.account-nav a:hover, .account-nav a.active { background:var(--shop-theme); color:#fff; }
/* user header */
.account-user { display:flex; align-items:center; gap:12px; padding:4px 4px 16px; border-bottom:1px solid #eee; margin-bottom:10px; }
.account-avatar { width:48px; height:48px; border-radius:50%; background:var(--shop-theme); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:20px; flex:0 0 auto; }
.account-user-meta { min-width:0; }
.account-user-meta strong { display:block; font-size:15px; color:var(--shop-dark); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.account-user-meta span { display:block; font-size:12px; color:#888; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.account-nav a.logout { color:var(--shop-red); margin-top:8px; border-top:1px solid #eee; border-radius:0; padding-top:14px; }
.account-nav a.logout:hover { background:#fff; color:#a71d2a; }
/* dashboard stat cards */
.acct-stat { background:#fff; border-radius:12px; padding:18px; box-shadow:0 6px 22px rgba(0,0,0,.05); height:100%; }
.acct-stat i { font-size:22px; color:var(--shop-theme); }
.acct-stat .num { font-size:26px; font-weight:700; color:var(--shop-dark); line-height:1.1; margin-top:6px; }
.acct-stat .lbl { color:#888; font-size:13px; margin:0; }
.acct-stat.link-card { transition:transform .15s, box-shadow .15s; }
.acct-stat.link-card:hover { transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.1); }
.status-pill { display:inline-block; padding:4px 12px; border-radius:20px; font-size:12px; font-weight:600; text-transform:capitalize; }
.status-pending{background:#fff3cd;color:#856404}.status-confirmed{background:#cce5ff;color:#004085}
.status-processing{background:#e2e3ff;color:#3b3b98}.status-shipped{background:#d1ecf1;color:#0c5460}
.status-delivered{background:#d4edda;color:#155724}.status-cancelled{background:#f8d7da;color:#721c24}
.status-paid{background:#d4edda;color:#155724}.status-failed{background:#f8d7da;color:#721c24}

/* ---------- Step indicator ---------- */
.checkout-steps { display:flex; justify-content:center; gap:14px; margin-bottom:34px; flex-wrap:wrap; }
.checkout-steps .step { display:flex; align-items:center; gap:8px; color:#999; font-weight:600; }
.checkout-steps .step .num { width:30px;height:30px;border-radius:50%;background:#e2ddd2;color:#fff;display:flex;align-items:center;justify-content:center; }
.checkout-steps .step.active .num { background:var(--shop-theme); }
.checkout-steps .step.active { color:var(--shop-dark); }

/* ---------- Footer (flat) ---------- */
.footer-flat {
    background-color: var(--shop-dark); color: #aeb4c2;
    font-family: 'Poppins', 'Segoe UI', system-ui, -apple-system, sans-serif; font-weight: 300;
}
.footer-flat a, .footer-flat p, .footer-flat h4 { font-family: inherit; }
.footer-flat .footer-widgets-wrapper { padding: 56px 0 40px; }
.footer-flat .widget-head h4 {
    color: #fff; font-size: 16px; font-weight: 600; letter-spacing: .4px; text-transform: uppercase;
    margin-bottom: 18px; position: relative; padding-bottom: 10px;
}
.footer-flat .widget-head h4::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 32px; height: 2px; background: var(--shop-theme);
}
.footer-flat .single-footer-widget ul { list-style: none; padding: 0; margin: 0; }
.footer-flat .single-footer-widget ul li { margin-bottom: 10px; }
.footer-flat .single-footer-widget ul li a { color: #aeb4c2; font-size: 14.5px; letter-spacing: .2px; transition: color .2s, padding-left .2s; }
.footer-flat .single-footer-widget ul li a:hover { color: var(--shop-theme); padding-left: 5px; }

/* Brand column */
.footer-flat .footer-brand .footer-logo { display: inline-block; margin-bottom: 18px; }
.footer-flat .footer-brand .footer-logo img { max-height: 64px; width: auto; }
.footer-flat .footer-brand p { color: #9aa1b1; font-size: 14.5px; line-height: 1.8; max-width: 380px; margin: 0 0 20px; }

/* Contact column */
.footer-flat .footer-content p,
.footer-flat .footer-content a { color: #aeb4c2; font-size: 14.5px; line-height: 1.7; }
.footer-flat .footer-content p { margin-bottom: 12px; display: flex; gap: 9px; }
.footer-flat .footer-content a { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.footer-flat .footer-content a:hover { color: var(--shop-theme); }
.footer-flat .footer-content i { color: var(--shop-theme); width: 16px; text-align: center; margin-top: 3px; }
.footer-flat .footer-content a i { margin-top: 0; }

/* Flat squared social icons */
.footer-flat .footer-social { display: flex; gap: 8px; }
.footer-flat .footer-social a {
    display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px;
    background: rgba(255,255,255,.07); color: #fff; transition: background .2s, color .2s;
}
.footer-flat .footer-social a:hover { background: var(--shop-theme); color: #fff; }

/* Bottom bar */
.footer-flat .footer-bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 16px 0; }
.footer-flat .footer-bottom p, .footer-flat .footer-bottom a { color: #9aa1b1; font-size: 14px; margin: 0; }
.footer-flat .footer-bottom a { color: var(--shop-theme); }
.footer-flat .footer-bottom a:hover { color: #fff; }
.footer-flat .footer-bottom ul { list-style: none; display: flex; gap: 20px; margin: 0; padding: 0; }
.footer-flat .footer-bottom ul a { color: #9aa1b1; }
.footer-flat .footer-bottom ul a:hover { color: var(--shop-theme); }

@media (max-width: 767px) {
    .footer-flat .footer-widgets-wrapper { padding: 40px 0 24px; }
    .footer-flat .footer-brand p { max-width: none; }
}

/* ---------- Toast ---------- */
.shop-toast {
    position: fixed; bottom: 28px; right: 28px; z-index: 9999;
    background: var(--shop-dark); color:#fff; padding:14px 22px; border-radius:10px;
    box-shadow:0 10px 30px rgba(0,0,0,.2); opacity:0; transform:translateY(20px);
    transition:opacity .3s ease, transform .3s ease; max-width:320px;
}
.shop-toast.show { opacity:1; transform:translateY(0); }
.shop-toast.error { background: var(--shop-red); }

/* ---------- Mobile improvements ---------- */
@media (max-width: 991px) {
    /* Image fills its responsive aspect-ratio box (no fixed height — that
       left a blank gap below the photo on full-width mobile cards). */
    .shop-card .catagory-product-image img { height: 100%; }
    .cart-table thead { display:none; }
    .cart-table, .cart-table tbody, .cart-table tr, .cart-table td { display:block; width:100%; }
    .cart-table tr { margin-bottom:16px; border:1px solid #f0ece3; border-radius:10px; padding:8px; }
    .cart-table td { border:0; display:flex; justify-content:space-between; align-items:center; padding:8px 12px; }
    .cart-table td::before { content: attr(data-label); font-weight:700; color:var(--shop-dark); }
    .cart-table td.no-label::before { content:''; }
}
@media (max-width: 575px) {
    .shop-form { padding:22px; }
    .header-top-wrapper ul { font-size:12px; }
}

/* ====================================================================
   Squared corners — remove border-radius from buttons & cards
   ==================================================================== */
.theme-btn,
.theme-btn.btn-sm,
.theme-btn::before,
.btn-accent {
    border-radius: 0 !important;
}
.shop-card,
.shop-card .catagory-product-image,
.shop-sidebar,
.cart-table,
.cart-summary,
.shop-form,
.account-nav,
.acct-stat,
.badge-enquiry,
.badge-discount,
.badge-oos,
.feature-style-one-item {
    border-radius: 0 !important;
}