/* ==========================================================================
   NIVO — Electronics theme for TWSAA
   Loaded after app.min.css. CSS-only: no Blade markup changes.

   Identity: cool grey canvas, crisp white bordered cards, tight 10–12px
   radii, "IBM Plex Sans Arabic" headings (Latin + Arabic), dark slate menu
   bar, tabular price digits, spec-sheet product details.

   Notes:
   - Accent colour stays merchant-controlled via --color-primary /
     --text-btn (set per channel in the master layout).
   - Logical properties (inline-start/end) keep LTR and RTL correct.
   - Master's inline <style> and swiper CSS load after this file, so a few
     rules use a `body` prefix or !important to win the cascade.
   - Checkout uses no-nav-master, which does not load this file.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap");

:root {
    --nivo-bg: #f8f9fb;
    --nivo-surface: #ffffff;
    --nivo-subtle: #f8fafc;
    --nivo-line: #e2e8f0;
    --nivo-line-strong: #cbd5e1;
    --nivo-ink: #0f172a;
    --nivo-ink-soft: #334155;
    --nivo-muted: #64748b;
    --nivo-slate: #0f172a;
    --nivo-slate-2: #1e293b;
    --nivo-slate-3: #334155;
    --nivo-sale: #e11d48;
    --nivo-ok: #16a34a;

    --nivo-radius-lg: 16px;
    --nivo-radius: 12px;
    --nivo-radius-sm: 8px;

    --nivo-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --nivo-shadow: 0 16px 32px -18px rgba(15, 23, 42, 0.28);
    --nivo-ease: cubic-bezier(0.2, 0.7, 0.2, 1);

    --nivo-font-heading: "IBM Plex Sans Arabic", var(--font-main), system-ui, sans-serif;
}

/* ==========================================================================
   1. Base
   ========================================================================== */

html body {
    background-color: var(--nivo-bg) !important;
    color: var(--nivo-ink);
}

::selection {
    background: var(--nivo-ink);
    color: #fff;
}

.main-container-wrapper {
    background: transparent;
}

a,
button,
.btn,
.s-button-btn {
    transition: color 0.2s var(--nivo-ease), background-color 0.2s var(--nivo-ease),
        border-color 0.2s var(--nivo-ease), box-shadow 0.2s var(--nivo-ease),
        opacity 0.2s var(--nivo-ease), transform 0.2s var(--nivo-ease);
}

:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* prices read like specs: fixed-width digits */
.price,
.special-price,
.regular-price,
.product-price,
.s-cart-summary-total,
.item-price,
.item-total,
.d-price {
    font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   2. Buttons
   ========================================================================== */

.btn,
.s-button-btn {
    border-radius: var(--nivo-radius-sm);
    font-weight: 600;
}

.btn-primary:hover,
.s-button-primary:not(.s-button-disabled):hover {
    background-color: var(--nivo-ink);
    border-color: var(--nivo-ink);
    color: #fff;
    opacity: 1;
}

.s-button-disabled {
    cursor: not-allowed;
}

/* ==========================================================================
   3. Header  (markup: layouts/header/index.blade.php)
      One row: logo · centred menu · language pill / search / cart / account
   ========================================================================== */

.nivo-header #mainnav .inner {
    background-color: var(--nivo-bg);
}

.nivo-header.header .main-nav-container {
    box-shadow: none;
    border-bottom: 1px solid var(--nivo-line);
}

.nivo-bar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 2rem;
    min-height: 88px;
}

.nivo-bar__start {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.nivo-header .navbar-brand {
    display: flex;
    align-items: center;
    padding: 0;
}

.nivo-header .navbar-brand img {
    max-height: 52px;
    max-width: 180px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.nivo-header .navbar-brand h2 {
    font-family: var(--nivo-font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--nivo-ink);
    white-space: nowrap;
}

/* ---------- Centre menu ---------- */

.nivo-bar__menu {
    display: none;
    min-width: 0;
}

.nivo-bar__menu > .container {
    max-width: none;
    padding: 0;
    justify-content: center;
    border: 0;
}

.nivo-bar__menu .main-menu {
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    row-gap: 0rem;
}

/* drop empty items (blank category names, trailing <li></li>) so they
   don't leave holes in the row */
.nivo-bar__menu .main-menu > li:empty,
.nivo-bar__menu .main-menu > li:has(> a > div > span:empty) {
    display: none !important;
}

.nivo-bar__menu .main-menu > li {
    margin: 0;
}

@media (min-width: 1024px) {
    .nivo-bar__menu {
        display: block;
    }

    .nivo-header .main-menu > li.root-level > a {
        padding: 0.3rem 0.75rem;
        line-height: 1.4;
    }

    .nivo-header .main-menu > li.root-level > a span {
        font-family: var(--nivo-font-heading) !important;
        font-size: 0.975rem;
        font-weight: 600;
        line-height: 1.4;
        color: var(--nivo-ink);
    }

    .nivo-header .main-menu > li.root-level > a:hover span {
        color: var(--nivo-ink-soft);
    }

    /* "Offers" link stands out, as in the reference */
    .nivo-header .main-menu > li.root-level > a[href$="/offers"] span {
        color: var(--nivo-sale);
    }

    body .nivo-header nav > ul > li > a.active > div > span {
        color: var(--nivo-ink) !important;
    }

    .nivo-header .main-menu .sub-menu {
        padding: 0.4rem;
        border: 1px solid var(--nivo-line);
        border-radius: var(--nivo-radius);
        background: var(--nivo-surface);
        box-shadow: var(--nivo-shadow);
        backdrop-filter: none;
    }

    .nivo-header .main-menu .sub-menu li > a {
        padding: 0.55rem 0.85rem;
        border-radius: var(--nivo-radius-sm);
    }

    .nivo-header .main-menu .sub-menu li > a span {
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--nivo-ink-soft);
    }

    .nivo-header .main-menu .sub-menu li > a:hover {
        background: var(--nivo-bg);
    }
}

/* ---------- Actions ---------- */

.nivo-bar__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
}

.nivo-header .nivo-icon,
.nivo-header .header-btn {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--nivo-ink);
    cursor: pointer;
}

.nivo-header .nivo-icon i,
.nivo-header .header-btn i {
    color: var(--nivo-ink);
    font-size: 1.35rem;
    line-height: 1;
}

.nivo-header .nivo-icon:hover,
.nivo-header .header-btn:hover {
    background: var(--nivo-line);
    opacity: 1;
}

/* language / currency: globe badge + grey pill */
.nivo-lang {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.nivo-lang__globe {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--nivo-ink);
    color: #fff;
    font-size: 0.95rem;
}

.nivo-lang__globe i {
    color: #fff;
}

.nivo-lang__pill {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    height: 2.75rem;
    padding: 0 1.1rem;
    border-radius: var(--nivo-pill, 999px);
    background: #eef0f3;
    color: var(--nivo-ink);
    font-size: 0.95rem;
    font-weight: 500;
}

.nivo-lang:hover .nivo-lang__pill {
    background: var(--nivo-line);
}

.nivo-lang__pill .flag {
    background: none;
    width: auto;
    height: auto;
    box-shadow: none;
}

.nivo-lang__pill .symbol,
.nivo-lang__pill .symbol * {
    color: inherit;
}

.nivo-lang__sep {
    width: 1px;
    height: 14px;
    background: var(--nivo-ink);
    opacity: 0.35;
}

/* cart / wallet badges: small black discs */
.nivo-header .s-cart-summary-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.nivo-header .s-cart-summary-count,
.nivo-header .s-wallet-summary-count {
    top: -2px !important;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    background: var(--nivo-ink);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1.25rem;
    box-shadow: 0 0 0 2px var(--nivo-bg);
}

.nivo-header .s-wallet-summary-count {
    white-space: nowrap;
}

.nivo-header .s-wallet-summary-count * {
    color: inherit;
    font-size: inherit;
    padding: 0 !important;
}

/* customer dropdown */
.nivo-header .s-user-menu-wrapper {
    position: relative;
}

.nivo-header .s-user-menu-dropdown {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    box-shadow: var(--nivo-shadow);
    overflow: hidden;
}

.nivo-header .s-user-menu-dropdown-item a:hover {
    background-color: var(--nivo-bg);
}

/* ---------- Search modal (desktop + mobile) ---------- */

.s-search-modal .s-search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.s-search-modal .s-search-input {
    width: 100%;
    height: 50px !important;
    border: 1px solid var(--nivo-line-strong);
    border-radius: 999px;
    background: var(--nivo-bg);
    padding-inline: 2.75rem 3.5rem;
    font-size: 0.95rem;
}

.s-search-modal .s-search-input:focus {
    border-color: var(--nivo-ink);
    background: var(--nivo-surface);
    outline: none;
}

.s-search-modal .camera-btn {
    position: absolute;
    top: 50%;
    inset-inline-end: 6px;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--nivo-surface);
    border: 1px solid var(--nivo-line);
    color: var(--nivo-ink);
    cursor: pointer;
}

.s-search-modal .camera-btn:hover {
    border-color: var(--nivo-ink);
}

.s-search-modal .s-search-results .results {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    box-shadow: var(--nivo-shadow);
    overflow: hidden;
}

/* ---------- Mobile menu drawer ---------- */

#mobile-menu.mm-spn.mm-spn--light {
    background: var(--nivo-surface);
    color: var(--nivo-ink);
}

#mobile-menu .main-menu > li > a,
#mobile-menu .main-menu > li > a span,
#mobile-menu .main-menu h5 {
    font-family: var(--nivo-font-heading);
    font-weight: 600;
    color: var(--nivo-ink);
}

#mobile-menu .main-menu > li {
    border-bottom: 1px solid var(--nivo-line);
}

#mobile-menu .close-mobile-menu {
    border-radius: 50%;
    background: var(--nivo-bg);
    color: var(--nivo-ink);
}

/* ---------- Header breakpoints ---------- */

@media (max-width: 1023px) {
    .nivo-bar {
        grid-template-columns: 1fr auto;
        gap: 0.75rem;
        min-height: 66px;
    }

    .nivo-header .navbar-brand img {
        max-height: 40px;
        max-width: 130px;
    }

    .nivo-bar__actions {
        gap: 0.15rem;
    }

    /* language lives in the mobile drawer */
    .nivo-header .nivo-lang {
        display: none;
    }

    .nivo-header .nivo-icon,
    .nivo-header .header-btn {
        width: 2.35rem;
        height: 2.35rem;
    }

    .nivo-header .nivo-icon i,
    .nivo-header .header-btn i {
        font-size: 1.2rem;
    }
}

@media (min-width: 1024px) {
    .nivo-header .mburger {
        display: none;
    }
}

/* ---------- Sticky header ----------
   z-index sits below modals (200) and the mobile drawer (9999).
   nivo.js sets .is-scrolled and --nivo-header-h (live header height). */

.nivo-header {
    position: sticky;
    top: 0;
    z-index: 60;
}

.nivo-header .main-nav-container {
    transition: box-shadow 0.25s var(--nivo-ease);
}

.nivo-header .nivo-bar {
    transition: min-height 0.25s var(--nivo-ease);
}

.nivo-header .navbar-brand img {
    transition: max-height 0.25s var(--nivo-ease);
}

.nivo-header.is-scrolled .main-nav-container {
    box-shadow: 0 8px 24px -16px rgba(15, 23, 42, 0.35);
}

@media (min-width: 1024px) {
    .nivo-header.is-scrolled .nivo-bar {
        min-height: 68px;
    }

    .nivo-header.is-scrolled .navbar-brand img {
        max-height: 42px;
    }
}

/* anchor jumps (e.g. #product-tabs) land below the header */
html {
    scroll-padding-top: calc(var(--nivo-header-h, 88px) + 1rem);
}

/* other sticky elements sit below the header */
@media (min-width: 1024px) {
    #filters-menu {
        top: calc(var(--nivo-header-h, 88px) + 1rem);
    }
}

/* ==========================================================================
   4. Section scaffolding & titles
   ========================================================================== */

.s-block {
    margin-top: 2.25rem;
}

@media (min-width: 768px) {
    .s-block {
        margin-top: 3.5rem;
    }
}

.s-block__title,
.s-slider-block__title {
    align-items: center;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    .s-block__title,
    .s-slider-block__title {
        margin-bottom: 1.5rem;
    }
}

.s-block__title h2,
.s-slider-block__title h2,
.product-group-heading {
    font-family: var(--nivo-font-heading);
    font-size: clamp(1.35rem, 1.1rem + 0.9vw, 1.8rem);
    font-weight: 700;
    line-height: 1.25;
    color: var(--nivo-ink);
}

.s-block__title p {
    margin-top: 0.3rem;
    font-size: 0.9rem;
    color: var(--nivo-muted);
}

/* "view all" */
.s-slider-block__display-all {
    flex-direction: row;
    align-items: center;
    padding: 0.4rem 0.9rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    color: var(--nivo-ink);
    font-size: 0.8rem;
    font-weight: 600;
}

.s-slider-block__display-all::after {
    display: none !important;
}

.s-slider-block__display-all:hover {
    border-color: var(--nivo-ink);
}

/* slider arrows */
body .s-slider-nav-arrow,
body .s-slider-v-centered .s-slider-block__title-nav button {
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    box-shadow: none;
}

body .s-slider-nav-arrow:not(:disabled):hover,
body .s-slider-v-centered .s-slider-block__title-nav button:not(:disabled):hover {
    border-color: var(--nivo-ink);
    background: var(--nivo-ink);
}

body twsaa-slider .s-slider-block__title-nav button .s-slider-button-icon svg {
    fill: var(--nivo-ink) !important;
    opacity: 1;
}

body twsaa-slider .s-slider-block__title-nav button:not(:disabled):hover .s-slider-button-icon svg {
    fill: #fff !important;
}

/* bullets */
body .swiper .swiper-pagination-bullet {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 2px;
    background: var(--nivo-line-strong);
    opacity: 1;
}

body .swiper .swiper-pagination-bullet-active {
    width: 1.5rem;
    background: var(--nivo-ink);
}

/* ==========================================================================
   5. Product card
   ========================================================================== */

.product-entry {
    border: 1px solid var(--nivo-line) !important;
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
    transition: border-color 0.2s var(--nivo-ease), box-shadow 0.25s var(--nivo-ease);
}

.product-entry:hover {
    border-color: var(--nivo-line-strong) !important;
    box-shadow: var(--nivo-shadow);
}

/* image area: white, padded — product shots stay crisp */
.product-entry > a > .relative > .overflow-hidden {
    padding: 1rem;
    background: var(--nivo-surface);
}

.product-entry > a > .relative img {
    width: 100%;
    transition: transform 0.4s var(--nivo-ease);
}

.product-entry:hover > a > .relative img {
    transform: scale(1.04);
}

/* badges */
.product-entry .sticker {
    position: absolute;
    top: 0.75rem;
    inset-inline-start: 0.75rem;
    z-index: 3;
    padding: 0.25rem 0.55rem;
    border-radius: 6px;
    background: var(--nivo-ink);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1;
}

html[dir="ltr"] .product-entry .sticker {
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

html[dir] .product-entry .promo-title {
    top: 0.75rem;
    left: auto;
    right: auto;
    inset-inline-start: auto;
    inset-inline-end: 0.75rem;
    max-width: 60%;
    padding: 0.25rem 0.55rem;
    border-radius: 6px;
    background: var(--nivo-sale);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    opacity: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* content */
.product-entry .donating-wrap {
    padding: 0.9rem 1rem 1rem;
    gap: 0.2rem;
    border-top: 1px solid var(--nivo-line);
}

.product-entry .title-wrapper {
    text-align: start;
}

.product-entry .product-entry__title a {
    margin-top: 0;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.45;
    color: var(--nivo-ink);
}

.product-entry .product-entry__title a:hover {
    color: var(--color-primary);
}

.product-entry .s-product-card-content-subtitle {
    margin-top: 0.1rem;
    margin-bottom: 0.25rem;
    font-size: 0.78rem;
    line-height: 1.4;
    color: var(--nivo-muted);
    opacity: 1;
}

.product-entry .s-product-card-content-subtitle:empty {
    display: none;
}

/* price */
.product-entry .price-wrapper,
.product-entry .price-wrapper .on-sale {
    justify-content: flex-start;
}

.product-entry .price-wrapper {
    margin-bottom: 0.8rem;
}

.product-entry .price-wrapper .on-sale .price {
    width: auto;
    text-align: start;
}

.product-entry .price-wrapper .on-sale .price,
.product-entry .price-wrapper .on-sale .special-price {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.product-entry .price-wrapper .on-sale .special-price {
    color: var(--nivo-sale);
}

.product-entry .price-wrapper .on-sale .regular-price {
    font-size: 0.8rem;
    color: var(--nivo-muted);
}

/* add to cart */
.product-entry .product-footer {
    justify-content: stretch;
}

.product-entry .addToCart.s-button-btn {
    height: 2.625rem;
    padding: 0 1rem;
    border: 1px solid var(--nivo-ink);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-ink);
    color: #fff;
    font-size: 0.825rem;
    font-weight: 600;
}

.product-entry .addToCart.s-button-btn p,
.product-entry .addToCart.s-button-btn i {
    color: inherit;
}

.product-entry .addToCart.s-button-primary-outline:hover {
    border-color: var(--color-primary);
    background: var(--color-primary);
    color: var(--text-btn);
}

.product-entry .addToCart.s-button-disabled {
    border-color: var(--nivo-line);
    background: var(--nivo-subtle);
    color: var(--nivo-muted);
}

/* grids */
.products-container.grid {
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .products-container.grid {
        gap: 1rem;
    }
}

.product-grid-4 {
    gap: 1rem;
}

/* ==========================================================================
   6. Home sections
   ========================================================================== */

/* banners */
.s-block--fixed-banner .banner {
    display: block;
    border-radius: var(--nivo-radius-lg);
    overflow: hidden;
}

.s-block--fixed-banner .banner img,
.banner--fixed img {
    border-radius: var(--nivo-radius-lg);
}

.s-block--youtube-url iframe,
.s-block--video-url video,
.s-block--youtube iframe {
    width: 100%;
    border-radius: var(--nivo-radius-lg);
}

/* categories: large soft-grey circles with arrows (reference style) */
.s-block--banners .banner-square.swiper-slide {
    padding-inline: 0.5rem;
}

@media (min-width: 768px) {
    .s-block--banners .banner-square.swiper-slide {
        padding-inline: 1rem;
    }
}

.s-block--banners .banner-square .box-img,
.s-block--banners .banner-square .box-img.rounded-none {
    aspect-ratio: 1 / 1;
    border: 0;
    border-radius: 50%;
    background: #f0f1f4;
    transition: background-color 0.25s var(--nivo-ease);
}

.s-block--banners .banner-square .box-img img {
    width: 100%;
    height: 100%;
    padding: 24%;
    object-fit: contain;
    transition: transform 0.35s var(--nivo-ease);
}

.s-block--banners .banner-square:hover .box-img {
    background: #e7e9ee;
}

.s-block--banners .zoomed-img:hover .box-img img {
    transform: scale(1.08);
}

.s-block--banners .banner-square h3 {
    margin-top: 1rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--nivo-ink);
}

@media (min-width: 768px) {
    .s-block--banners .banner-square h3 {
        font-size: 1.05rem;
    }
}

/* arrows added in home/categories-slider.blade.php */
.s-block--banners .mySwiper {
    position: relative;
}

.nivo-arrow {
    position: absolute;
    top: 38%;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border: 0;
    border-radius: 50%;
    background: var(--nivo-surface);
    color: var(--nivo-ink);
    box-shadow: 0 8px 20px -6px rgba(15, 23, 42, 0.22);
    cursor: pointer;
    transform: translateY(-50%);
}

.nivo-arrow--prev {
    inset-inline-start: 0.25rem;
}

.nivo-arrow--next {
    inset-inline-end: 0.25rem;
}

html[dir="rtl"] .nivo-arrow svg {
    transform: scaleX(-1);
}

.nivo-arrow:hover {
    background: var(--nivo-ink);
    color: #fff;
}

.nivo-arrow.swiper-button-disabled {
    opacity: 0.45;
    box-shadow: none;
    cursor: default;
    pointer-events: none;
}

@media (max-width: 767px) {
    .nivo-arrow {
        display: none;
    }
}

/* brands: monochrome logo strip */
.s-block--banners .banner-square.max--3 .box-img {
    aspect-ratio: 16 / 9;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    background: var(--nivo-surface);
}

.s-block--banners .banner-square.max--3 .box-img img {
    padding: 1rem 1.25rem;
    filter: grayscale(1);
    opacity: 0.7;
    transition: filter 0.25s var(--nivo-ease), opacity 0.25s var(--nivo-ease);
}

.s-block--banners .banner-square.max--3:hover .box-img img {
    filter: none;
    opacity: 1;
    transform: none;
}

/* store features: compact spec cards */
.s-block--features__item {
    height: 100%;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 1rem;
    padding: 1.25rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
    text-align: start;
}

.s-block--features__item:hover {
    border-color: var(--nivo-line-strong);
    box-shadow: var(--nivo-shadow);
}

.s-block--features__item .feature-icon {
    flex: none;
    width: 3.25rem;
    height: 3.25rem;
    margin-bottom: 0;
    border-radius: var(--nivo-radius);
    background: var(--nivo-slate);
}

.s-block--features__item .feature-icon i {
    color: #fff;
    font-size: 1.4rem;
}

.s-block--features__item h2 {
    flex: 1 1 0;
    min-width: 0;
    font-family: var(--nivo-font-heading);
    font-size: 1rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.s-block--features__item p {
    flex-basis: 100%;
    margin-top: 0.6rem;
    color: var(--nivo-muted);
    font-size: 0.85rem;
    text-align: start;
}

/* reviews */
.myReviewSwiper .swiper-slide > .flex {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
}

.myReviewSwiper .testimonial__avatar {
    border: 1px solid var(--nivo-line);
    box-shadow: 0 0 0 4px var(--nivo-bg);
}

.myReviewSwiper .testimonial__icon {
    color: var(--nivo-ink);
    opacity: 0.08;
}

/* FAQ */
.s-block .accordion-item {
    margin-bottom: 0.5rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
    overflow: hidden;
}

.s-block .accordion-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: transparent;
    color: var(--nivo-ink);
    font-size: 0.95rem;
    font-weight: 600;
    text-align: start;
}

.s-block .accordion-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 1.75rem;
    height: 1.75rem;
    border: 1px solid var(--nivo-line);
    border-radius: 6px;
    color: var(--nivo-muted);
    font-size: 0.55rem;
}

.s-block .accordion-content p {
    color: var(--nivo-ink-soft);
    line-height: 1.75;
}

/* image tiles (list of items) */
.banner-entry,
.banner-entry-list {
    border-radius: var(--nivo-radius-lg);
    overflow: hidden;
}

@media (min-width: 768px) {
    .banner-entry {
        height: 240px;
    }
}

.banner-entry h3 {
    font-family: var(--nivo-font-heading);
    font-size: 1.25rem;
    font-weight: 700;
}

.banner-entry .lazy__bg {
    transition: transform 0.5s var(--nivo-ease);
}

.banner-entry:hover .lazy__bg {
    transform: scale(1.04);
}

/* blogs */
.s-block--banners > section.bg-white {
    background: transparent;
    border-top: 0;
}

.s-block--banners > section.bg-white h3 {
    font-family: var(--nivo-font-heading);
    font-weight: 700;
    color: var(--nivo-ink);
}

.s-block--banners > section.bg-white .swiper-slide .rounded-lg {
    border-color: var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
}

/* ==========================================================================
   7. Category / listing page
   ========================================================================== */

.breadcrumbs {
    font-size: 0.8rem;
    color: var(--nivo-muted);
}

.breadcrumbs a {
    color: var(--nivo-muted);
}

.breadcrumbs a:hover {
    color: var(--nivo-ink);
}

.breadcrumb-subtitle .subTitle-detail {
    padding-block: 1.25rem 0.5rem;
}

.breadcrumb-subtitle .flex-subTitle img {
    width: 64px;
    height: 64px;
    min-width: 64px;
    padding: 6px;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
}

.bread-title {
    font-family: var(--nivo-font-heading);
    font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--nivo-ink);
}

.bread-text {
    margin-inline: 0;
    margin-top: 0.2rem;
    font-size: 0.9rem;
    color: var(--nivo-muted);
}

/* child categories (category.blade.php pushes !important rules) */
body .categorySwiper .child-item .child-cat-img,
body .categorySwiper .child-item .placeholder {
    border: 1px solid var(--nivo-line) !important;
    border-radius: var(--nivo-radius) !important;
    background: var(--nivo-surface) !important;
    box-shadow: none !important;
}

body .categorySwiper .child-item:hover .child-cat-img {
    border-color: var(--color-primary) !important;
}

body .categorySwiper .child-item h3 {
    font-weight: 600 !important;
    color: var(--nivo-ink) !important;
}

.breadcrumb-subtitle .category-prev,
.breadcrumb-subtitle .category-next {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    box-shadow: none;
}

/* sorter */
.prod-filter select.form-input,
#product-filter {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background-color: var(--nivo-surface);
    color: var(--nivo-ink);
    font-weight: 500;
    padding-block: 0.45rem;
    padding-inline-start: 0.9rem;
}

#total_products {
    color: var(--nivo-muted);
    font-size: 0.85rem;
}

/* filters */
body .s-filters-widget-container {
    margin-bottom: 0.75rem;
    padding: 1rem 1.1rem 0.5rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background-color: var(--nivo-surface) !important;
    color: var(--nivo-ink) !important;
}

.s-filters-widget-title {
    justify-content: space-between;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.s-filters-widget-search-input {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-subtle);
}

.s-filters-label {
    color: var(--nivo-ink-soft);
    font-size: 0.85rem;
}

.s-filters-radio {
    accent-color: var(--nivo-ink);
}

#clear-filters-btn {
    height: 2.625rem;
}

/* search results / legacy listing header */
.nav-header.bg-gray-100 {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    background-color: var(--nivo-surface);
}

.main-container-wrapper .nav-header.bg-gray-100 h1 {
    font-family: var(--nivo-font-heading);
    font-size: clamp(1.4rem, 1.15rem + 0.9vw, 1.9rem);
    font-weight: 700;
    color: var(--nivo-ink);
}

/* empty state */
.product-list.empty {
    grid-column: 1 / -1;
    padding: 4rem 1.5rem;
    border: 1px dashed var(--nivo-line-strong);
    border-radius: var(--nivo-radius-lg);
    background: var(--nivo-surface);
    text-align: center;
}

.product-list.empty h2 {
    margin-bottom: 0.5rem;
    font-family: var(--nivo-font-heading);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.product-list.empty p {
    color: var(--nivo-muted);
}

.s-products-list-loading-wrapper {
    padding-block: 2rem;
}

/* pagination (legacy) */
.pagination .page-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    color: var(--nivo-ink);
    font-weight: 600;
}

.pagination .page-item.active {
    border-color: var(--nivo-ink);
    background: var(--nivo-ink);
    color: #fff;
}

/* ==========================================================================
   8. Product detail page
   ========================================================================== */

.product-detail {
    padding-bottom: 2rem;
}

@media (min-width: 768px) {
    .product-detail > .md\:container > .flex {
        align-items: flex-start;
    }

    .product-detail .sidebar {
        width: 50% !important;
        margin-inline-end: 0;
        padding-bottom: 2rem;
        overflow: visible;
    }

    .product-detail .main-content {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        padding-inline-start: 2.5rem;
    }
}

@media (min-width: 1024px) {
    .product-detail .sidebar {
        top: calc(var(--nivo-header-h, 88px) + 1.25rem);
    }

    .product-detail .main-content {
        padding-inline-start: 3rem;
    }
}

/* gallery: white bordered stage */
.product-detail .product-gallery-slider {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.product-detail .product-hero-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    padding: 2rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    background: var(--nivo-surface);
    overflow: hidden;
}

.product-detail .product-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-detail .product-hero-image .discountPercentage {
    position: absolute;
    top: 1rem;
    inset-inline-start: 1rem;
    padding: 0.3rem 0.65rem;
    border-radius: 6px;
    background: var(--nivo-sale);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
}

.product-detail .product-hero-image .discountPercentage:empty {
    display: none;
}

html[dir] .product-detail .promotion-title {
    top: 1rem;
    left: auto;
    right: auto;
    inset-inline-start: 1rem;
    padding: 0.3rem 0.7rem;
    border-radius: 6px;
    background-color: var(--nivo-sale) !important;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    opacity: 1;
}

.product-detail .wish-share {
    opacity: 1;
}

@media (min-width: 768px) {
    html[dir] .product-detail .wish-share {
        top: 1rem;
        inset-inline-end: 1rem;
    }
}

.product-detail .wish-share .s-button-icon {
    width: 2.625rem;
    height: 2.625rem;
    border: 1px solid var(--nivo-line) !important;
    border-radius: var(--nivo-radius-sm) !important;
    background: var(--nivo-surface);
    color: var(--nivo-ink);
}

.product-detail .wish-share .s-button-icon:hover {
    border-color: var(--nivo-ink) !important;
}

.product-detail .wish-share .btn--wishlist.is-added,
.product-detail .wish-share .btn--wishlist.is-added i {
    color: var(--nivo-sale);
}

/* thumbnails (rendered but hidden in markup — show them) */
.product-detail .thumb-slider-container {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.product-detail .thumb-slider.hidden {
    display: block;
}

.product-detail .thumb-slider {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.product-detail .thumb-slider::-webkit-scrollbar {
    display: none;
}

.product-detail .thumb-slider .swiper-wrapper {
    display: flex;
    gap: 0.5rem;
    transform: none !important;
}

.product-detail .thumb-frame {
    flex: 0 0 70px;
    width: 70px !important;
    height: 70px;
    padding: 6px;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    overflow: hidden;
    cursor: pointer;
}

.product-detail .thumb-frame img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-detail .thumb-frame:hover {
    border-color: var(--nivo-line-strong);
}

.product-detail .thumb-frame.active {
    border-color: var(--color-primary);
    box-shadow: inset 0 0 0 1px var(--color-primary);
}

body .product-detail .thumb-slider-container .swiper-button-prev,
body .product-detail .thumb-slider-container .swiper-button-next {
    position: static;
    flex: none;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    color: var(--nivo-ink);
}

body .product-detail .thumb-slider-container .swiper-button-prev {
    order: 1;
}

body .product-detail .thumb-slider-container .swiper-button-next {
    order: 3;
}

body .product-detail .thumb-slider-container .swiper-button-prev:hover,
body .product-detail .thumb-slider-container .swiper-button-next:hover {
    border-color: var(--nivo-ink);
    background: var(--nivo-ink);
    color: #fff;
}

body .product-detail .thumb-slider-container .swiper-button-prev::after,
body .product-detail .thumb-slider-container .swiper-button-next::after {
    font-size: 0.75rem;
    font-weight: 700;
}

html[dir="rtl"] .product-detail .thumb-slider-container .swiper-button-prev::after {
    content: "next";
}

html[dir="rtl"] .product-detail .thumb-slider-container .swiper-button-next::after {
    content: "prev";
}

/* info column */
.product-detail .main-content > .flex.border {
    gap: 0.85rem;
    margin-bottom: 1.25rem;
    padding: 0.6rem;
    border: 1px solid var(--nivo-line) !important;
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
}

.product-detail .product-brand {
    width: 3rem;
    height: 3rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    overflow: hidden;
}

.product-detail .main-content > .flex.border h4 {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--nivo-ok);
}

.product-detail .main-content > .flex.border h4::before {
    content: "";
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: var(--nivo-ok);
}

.product-detail .main-content > .flex.border p,
.product-detail .main-content > .flex.border p a {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--nivo-ink);
    text-decoration: none;
}

.product-detail .main-content h1 {
    font-family: var(--nivo-font-heading);
    font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: var(--nivo-ink);
}

.product-detail .main-content .product-entry__sub-title {
    margin-top: 0.4rem;
    font-size: 0.95rem;
    color: var(--nivo-muted);
}

.product-detail .main-content .product-entry__sub-title.text-red-400 {
    display: inline-flex;
    width: fit-content;
    margin-top: 0.75rem;
    padding: 0.25rem 0.65rem;
    border-radius: 6px;
    background: #fff1f2;
    color: var(--nivo-sale);
    font-size: 0.8rem;
    font-weight: 700;
}

.product-detail .main-content > a.tab-trigger {
    margin-top: 0.75rem;
    padding: 0;
    background: transparent;
}

.product-detail .main-content .s-rating-stars-reviews {
    margin-inline-start: 0.35rem;
    color: var(--nivo-muted);
    font-size: 0.85rem;
}

/* tags */
.product-detail .main-content > .mb-3 {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 1rem;
}

.product-detail .main-content > .mb-3 > a {
    margin: 0;
    padding: 0.2rem 0.6rem;
    border: 1px solid var(--nivo-line);
    border-radius: 6px;
    background: var(--nivo-surface);
    color: var(--nivo-ink-soft);
    font-size: 0.75rem;
    text-decoration: none;
}

.product-detail .main-content > .mb-3 > a:hover {
    border-color: var(--nivo-ink);
    color: var(--nivo-ink);
}

/* description */
.product-detail .short__description {
    margin-top: 1.1rem;
}

.product-detail .short__description,
.product-detail .short__description p {
    font-size: 0.925rem;
    line-height: 1.8;
    color: var(--nivo-ink-soft);
}

.product-detail .short__description .more-details {
    color: var(--nivo-ink);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* price */
.product-detail .main-content > .price {
    margin-top: 1.5rem;
}

.product-detail .productDetails {
    flex-wrap: wrap;
    gap: 0.75rem;
}

.product-detail .productDetails .price,
.product-detail .productDetails .special-price {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--nivo-ink);
}

.product-detail .productDetails .special-price {
    color: var(--nivo-sale);
}

.product-detail .productDetails .regular-price {
    font-size: 1.05rem;
    color: var(--nivo-muted);
}

/* sku / barcode / sold: spec-sheet table */
.product-detail .details {
    margin: 0;
    padding: 0;
    border: 1px solid var(--nivo-line);
    border-top: 0;
    border-radius: 0;
    background: var(--nivo-surface);
}

.product-detail .details:nth-child(1 of .details) {
    margin-top: 1.25rem;
    border-top: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius) var(--nivo-radius) 0 0;
}

.product-detail .details:nth-last-child(1 of .details) {
    border-radius: 0 0 var(--nivo-radius) var(--nivo-radius);
}

.product-detail .details__wrapper {
    min-height: 0;
    padding: 0.65rem 1rem;
}

.product-detail .details:nth-child(even of .details) .details__wrapper {
    background: var(--nivo-subtle);
}

.product-detail .details__title,
.product-detail .details__title span,
.product-detail .details__title i {
    color: var(--nivo-muted);
    font-size: 0.825rem;
}

.product-detail .details__action span {
    color: var(--nivo-ink);
    font-size: 0.825rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.product-detail tamara-widget,
.product-detail #TabbyPromo {
    display: block;
    margin-top: 1.25rem;
}

/* purchase card */
.product-detail .sticky-product-bar {
    margin-top: 1.5rem;
    padding: 1rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    background: var(--nivo-surface);
}

.product-detail .product-bar-mob {
    gap: 0.6rem;
}

.product-detail .s-quantity-input-container {
    height: 3rem;
    border: 1px solid var(--nivo-line-strong);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    overflow: hidden;
}

.product-detail .s-quantity-input-button {
    width: 2.75rem;
}

.product-detail .s-quantity-input-button:hover {
    background: var(--nivo-subtle);
}

.product-detail .s-quantity-input-input {
    color: var(--nivo-ink);
    font-size: 1rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.product-detail .cartButtons .s-button-btn,
.product-detail .cartButtons .btn {
    flex: 1 1 0;
    min-height: 3rem;
    border-radius: var(--nivo-radius-sm);
    font-size: 0.925rem;
    font-weight: 700;
}

.product-detail .cartButtons .s-quick-buy-button {
    border: 1px solid var(--nivo-ink);
    background: var(--nivo-ink);
    color: #fff;
}

.product-detail .cartButtons .s-quick-buy-button * {
    color: inherit;
}

.product-detail .cartButtons .s-quick-buy-button:hover {
    border-color: var(--nivo-slate-3);
    background: var(--nivo-slate-3);
}

/* notes / file upload */
.product-detail .product-note-or-upload-file-wrapper {
    margin-top: 1.25rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    background: var(--nivo-surface);
}

.product-detail .product-note-or-upload-file-wrapper .btn-tab {
    padding: 0.45rem 0.9rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-subtle);
    color: var(--nivo-ink);
    font-size: 0.8rem;
}

/* options */
.s-product-options-option-container {
    margin-bottom: 1.1rem;
}

.s-product-options-option-label,
.s-product-options-option-label b {
    color: var(--nivo-ink);
    font-size: 0.875rem;
    font-weight: 700;
}

.s-product-options-option-content select.control {
    width: 100%;
    min-height: 2.875rem;
    padding-inline: 0.9rem;
    border: 1px solid var(--nivo-line-strong);
    border-radius: var(--nivo-radius-sm);
    background-color: var(--nivo-surface);
    color: var(--nivo-ink);
}

.s-product-options-thumbnails-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.s-product-options-thumbnails-wrapper .swatch > span,
.s-product-options-thumbnails-wrapper .swatch > img {
    border: 1px solid var(--nivo-line-strong);
    border-radius: var(--nivo-radius-sm);
}

.s-product-options-thumbnails-wrapper .swatch input:checked + span,
.s-product-options-thumbnails-wrapper .swatch input:checked + img {
    border-color: var(--nivo-ink);
    box-shadow: inset 0 0 0 1px var(--nivo-ink);
}

/* tabs */
.product-detail .s-product-tabs {
    margin-top: 2rem;
}

.s-product-tabs .tabs {
    gap: 0;
    border-bottom: 1px solid var(--nivo-line);
}

.s-product-tabs .tabs .tab-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: -1px;
    padding: 0.85rem 1.1rem;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: var(--nivo-radius-sm) var(--nivo-radius-sm) 0 0;
    background: transparent;
    color: var(--nivo-muted);
    font-size: 0.9rem;
    font-weight: 600;
}

.s-product-tabs .tabs .tab-trigger:hover {
    color: var(--nivo-ink);
}

.s-product-tabs .tabs .tab-trigger.is-active,
.s-product-tabs .tabs .tab-trigger.active {
    border-color: var(--nivo-line);
    background: var(--nivo-surface);
    color: var(--nivo-ink);
    box-shadow: inset 0 3px 0 var(--color-primary);
}

.s-product-tabs .tabs-wrapper {
    border: 1px solid var(--nivo-line);
    border-top: 0;
    border-radius: 0 0 var(--nivo-radius-lg) var(--nivo-radius-lg);
    background: var(--nivo-surface);
}

.s-product-tabs .tab-pane.p-5,
.s-product-tabs #product-tabs-options {
    padding: 1.5rem;
}

/* reviews */
.product-detail #nav-comments h2 {
    font-family: var(--nivo-font-heading);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.s-comments-sort-input {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    padding-inline: 0.9rem;
}

.product-detail #loadReview .comment .rounded-xl {
    padding: 0.85rem 1rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-subtle);
    box-shadow: none;
}

.product-detail #load-more.s-infinite-scroll-btn {
    border: 1px solid var(--nivo-ink);
    border-radius: var(--nivo-radius-sm);
    background: transparent;
    color: var(--nivo-ink);
}

.product-detail #load-more.s-infinite-scroll-btn:hover {
    background: var(--nivo-ink);
    color: #fff;
}

/* related / up-sells */
.product-detail .attached-products-wrapper,
.product-detail > twsaa-slider {
    margin-top: 3.25rem;
}

.attached-products-wrapper .title {
    margin-bottom: 1.25rem;
    padding-inline-start: 0.85rem;
    border-inline-start: 4px solid var(--color-primary);
    font-family: var(--nivo-font-heading);
    font-size: clamp(1.3rem, 1.05rem + 0.9vw, 1.75rem);
    font-weight: 700;
    color: var(--nivo-ink);
}

.attached-products-wrapper .title .border-bottom {
    display: none;
}

/* ==========================================================================
   9. Cart page  (scoped by :has(.cart-item) — no markup change)
   ========================================================================== */

.container:has(.cart-item) .shadow-default,
.container:has(.cart-item) .cart-item {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    background: var(--nivo-surface);
    box-shadow: none;
}

@media (min-width: 480px) {
    .container:has(.cart-item) .shadow-default,
    .container:has(.cart-item) .cart-item {
        padding: 1.25rem;
    }
}

.container:has(.cart-item) .s-conditional-offer-progress-line-inactive {
    background: var(--nivo-line);
}

.container:has(.cart-item) .s-conditional-offer-progress-line-active {
    background: var(--color-primary);
}

.container:has(.cart-item) .cart-item {
    margin-bottom: 0.75rem;
}

.container:has(.cart-item) .cart-item > div > .flex {
    gap: 1rem;
}

.container:has(.cart-item) .cart-item img.lazy {
    width: 6rem;
    height: 6rem;
    padding: 0.4rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
    object-fit: contain;
}

.container:has(.cart-item) .cart-item h4 a {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--nivo-ink);
}

.container:has(.cart-item) .cart-item h4 a:hover {
    color: var(--color-primary);
}

.container:has(.cart-item) .cart-item .item-options {
    font-size: 0.8rem;
    color: var(--nivo-muted);
}

.container:has(.cart-item) .cart-item .item-price {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.container:has(.cart-item) .cart-item .item-price.text-red-400 {
    color: var(--nivo-sale);
}

.container:has(.cart-item) .s-quantity-input-container {
    height: 2.625rem;
    border: 1px solid var(--nivo-line-strong);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    overflow: hidden;
}

.container:has(.cart-item) .cart-item .border-t {
    padding-top: 0.9rem;
    border-top-color: var(--nivo-line);
}

.container:has(.cart-item) .cart-item .border-t .text-primary,
.container:has(.cart-item) .cart-item .border-t .text-primary span {
    color: var(--nivo-muted);
}

.container:has(.cart-item) .cart-item .item-total {
    margin-inline-start: 0.25rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.container:has(.cart-item) .cart-item .btn--wishlist,
.container:has(.cart-item) .cart-item .btn--delete {
    display: inline-flex;
    align-items: center;
    height: 2.125rem;
    padding: 0 0.75rem !important;
    border-radius: var(--nivo-radius-sm);
    font-size: 0.78rem;
}

.container:has(.cart-item) .cart-item .btn--wishlist .s-button-text,
.container:has(.cart-item) .cart-item .btn--delete .s-button-text {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.container:has(.cart-item) .cart-item .btn--wishlist {
    border: 1px solid var(--nivo-line) !important;
    background: var(--nivo-surface);
    color: var(--nivo-ink);
}

.container:has(.cart-item) .cart-item .btn--wishlist:hover {
    border-color: var(--nivo-ink) !important;
}

.container:has(.cart-item) .cart-item .btn--delete {
    border: 1px solid #fecdd3;
    background: #fff1f2;
    color: var(--nivo-sale);
}

.container:has(.cart-item) .cart-item .btn--delete *,
.container:has(.cart-item) .cart-item .btn--wishlist * {
    color: inherit;
}

.container:has(.cart-item) .cart-item .btn--delete:hover {
    border-color: var(--nivo-sale);
    background: var(--nivo-sale);
    color: #fff;
}

@media (min-width: 1024px) {
    .container:has(.cart-item) .lg\:w-96 {
        width: 25rem;
        top: calc(var(--nivo-header-h, 88px) + 1rem);
    }
}

.container:has(.cart-item) .coupon .form-input {
    width: 100%;
    height: 2.875rem;
    border: 1px solid var(--nivo-line-strong);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    padding-inline-start: 0.9rem;
}

.container:has(.cart-item) .coupon .form-input:focus {
    border-color: var(--nivo-ink);
    outline: none;
}

.container:has(.cart-item) .lg\:w-96 h4 {
    font-family: var(--nivo-font-heading);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.container:has(.cart-item) .lg\:w-96 .flex.justify-between.text-sm {
    margin-bottom: 0.75rem;
    color: var(--nivo-ink-soft);
}

.container:has(.cart-item) .lg\:w-96 .d-price {
    color: var(--nivo-ink);
    font-weight: 600;
}

.container:has(.cart-item) #total-discount .d-price {
    color: var(--nivo-sale);
}

.container:has(.cart-item) .lg\:w-96 .flex.justify-between.text-lg {
    align-items: center;
    margin-top: 1rem;
    margin-bottom: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--nivo-line);
}

.container:has(.cart-item) .lg\:w-96 .flex.justify-between.text-lg b {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--nivo-ink);
    font-variant-numeric: tabular-nums;
}

.container:has(.cart-item) .cart-submit-wrap .btn-primary,
.container:has(.cart-item) .cart-submit-wrap .s-button-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 3rem;
    border-radius: var(--nivo-radius-sm);
    font-size: 0.925rem;
    font-weight: 700;
}

/* empty cart */
.main-container-wrapper > .container > .title:has(+ .cart-content) {
    max-width: 480px;
    margin: 3rem auto 0;
    padding: 2.5rem 2rem 0.5rem;
    border: 1px solid var(--nivo-line);
    border-bottom: 0;
    border-radius: var(--nivo-radius-lg) var(--nivo-radius-lg) 0 0;
    background: var(--nivo-surface);
    text-align: center;
    font-family: var(--nivo-font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.main-container-wrapper > .container > .title:has(+ .cart-content)::before {
    content: "";
    display: block;
    width: 56px;
    height: 56px;
    margin: 0 auto 1.1rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-subtle)
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f172a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.3'/%3E%3Ccircle cx='18' cy='20' r='1.3'/%3E%3Cpath d='M2.5 3h2.6l2.4 12.2h11.3l2.2-8.7H6.1'/%3E%3C/svg%3E")
        center / 26px no-repeat;
}

.main-container-wrapper > .container > .title + .cart-content {
    max-width: 480px;
    margin: 0 auto 3rem;
    padding: 0.5rem 2rem 2.5rem;
    border: 1px solid var(--nivo-line);
    border-top: 0;
    border-radius: 0 0 var(--nivo-radius-lg) var(--nivo-radius-lg);
    background: var(--nivo-surface);
    text-align: center;
}

.main-container-wrapper > .container > .title + .cart-content p {
    color: var(--nivo-muted);
}

.main-container-wrapper > .container > .title + .cart-content .btn-primary {
    min-height: 2.875rem;
    margin-top: 1.1rem;
    padding-inline: 1.75rem;
    border-radius: var(--nivo-radius-sm);
}

/* ==========================================================================
   10. Modals, account & forms
   ========================================================================== */

.s-modal-body {
    border-radius: var(--nivo-radius-lg);
}

.s-login-modal-header-icon {
    border-radius: var(--nivo-radius);
    background: var(--nivo-slate);
    color: #fff;
}

.s-modal-title {
    font-family: var(--nivo-font-heading);
    font-weight: 700;
    color: var(--nivo-ink);
}

.s-login-modal-wrapper .control,
.s-tel-input-control {
    border: 1px solid var(--nivo-line-strong);
    border-radius: var(--nivo-radius-sm);
}

.s-login-modal-wrapper .control:focus,
.s-tel-input-control:focus {
    border-color: var(--nivo-ink);
    box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.08);
    outline: none;
}

nav[aria-label="Sidebar"].sidebar {
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-lg);
    box-shadow: none;
}

.s-user-menu-inline .s-user-menu-dropdown-item a {
    border-radius: var(--nivo-radius-sm);
}

.s-user-menu-inline .s-user-menu-dropdown-item.active a,
.s-user-menu-inline .s-user-menu-dropdown-item a:hover {
    background: var(--nivo-subtle);
    box-shadow: inset 3px 0 0 var(--color-primary);
}

html[dir="rtl"] .s-user-menu-inline .s-user-menu-dropdown-item.active a,
html[dir="rtl"] .s-user-menu-inline .s-user-menu-dropdown-item a:hover {
    box-shadow: inset -3px 0 0 var(--color-primary);
}

/* ==========================================================================
   11. Footer  (light body — keeps any logo readable — with a dark base strip)
   ========================================================================== */

.store-footer {
    margin-top: 4rem;
    color: var(--nivo-ink);
}

.store-footer .store-footer__inner {
    border-top: 1px solid var(--nivo-line);
    background-color: var(--nivo-surface);
}

.store-footer .footer-container {
    padding-block: 2.75rem;
    border-bottom: 0;
}

.store-footer h3,
.store-footer h3.title {
    font-family: var(--nivo-font-heading);
    font-size: 1rem;
    font-weight: 700;
    color: var(--nivo-ink);
}

.store-footer p {
    color: var(--nivo-ink-soft);
}

.store-footer .store-links-items a,
.store-footer .footer-list a {
    color: var(--nivo-muted);
    font-size: 0.875rem;
    line-height: 2.1;
}

.store-footer .store-links-items a:hover,
.store-footer .footer-list a:hover {
    color: var(--nivo-ink) !important;
}

.store-footer .contact-links a {
    min-width: 3.25rem;
    min-height: 3.25rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius);
    background: var(--nivo-surface);
    color: var(--nivo-ink);
}

.store-footer .contact-links a:hover {
    border-color: var(--nivo-ink);
}

.store-footer .footer-social .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    color: var(--nivo-ink);
}

.store-footer .footer-social .social-icon:hover {
    border-color: var(--nivo-ink);
    background: var(--nivo-ink);
}

.store-footer .footer-social .social-icon:hover i,
.store-footer .footer-social .social-icon:hover svg {
    color: #fff;
    fill: #fff;
}

.store-footer .to-top a {
    color: var(--nivo-muted);
    font-size: 0.8rem;
}

/* dark base strip: full-bleed behind copyright + payment icons */
.store-footer .footer-bottom {
    position: relative;
    z-index: 0;
    padding-block: 1rem;
    font-size: 0.8rem;
}

.store-footer .footer-bottom::before {
    content: "";
    position: absolute;
    inset: 0 -100vmax;
    z-index: -1;
    background: var(--nivo-slate);
}

.store-footer .store-footer__inner {
    overflow: hidden;
}

.store-footer .footer-bottom .copyrights p {
    color: #94a3b8;
}

.store-footer .vat-num p {
    color: var(--nivo-muted);
}

.store-footer .pay-mada {
    border-radius: 6px;
}

/* ==========================================================================
   12. Responsive & motion
   ========================================================================== */

@media (max-width: 767px) {
    .product-entry > a > .relative > .overflow-hidden {
        padding: 0.6rem;
    }

    .product-entry .donating-wrap {
        padding: 0.7rem 0.7rem 0.8rem;
    }

    .product-entry .product-entry__title a {
        font-size: 0.825rem;
    }

    .product-entry .price-wrapper .on-sale .price,
    .product-entry .price-wrapper .on-sale .special-price {
        font-size: 0.95rem;
    }

    .product-entry .addToCart.s-button-btn {
        height: 2.375rem;
        padding: 0 0.5rem;
        font-size: 0.75rem;
    }

    .product-entry .sticker,
    html[dir] .product-entry .promo-title {
        top: 0.5rem;
        padding: 0.2rem 0.45rem;
        font-size: 0.625rem;
    }

    .product-entry .sticker {
        inset-inline-start: 0.5rem;
    }

    html[dir] .product-entry .promo-title {
        inset-inline-end: 0.5rem;
    }

    .s-block--fixed-banner .banner,
    .s-block--fixed-banner .banner img,
    .banner--fixed img {
        border-radius: var(--nivo-radius);
    }

    .s-block--features__item {
        padding: 1rem;
    }

    .product-detail .sidebar {
        padding-inline: 1rem;
    }

    .product-detail .product-hero-image {
        padding: 1.25rem;
    }

    .product-detail .thumb-frame {
        flex-basis: 58px;
        width: 58px !important;
        height: 58px;
    }

    .product-detail .productDetails .price,
    .product-detail .productDetails .special-price {
        font-size: 1.6rem;
    }

    .container:has(.cart-item) .cart-item img.lazy {
        width: 5rem;
        height: 5rem;
    }

    .container:has(.cart-item) .cart-item .btn--wishlist .fix-align {
        display: none;
    }
}

@media (hover: none) {
    .product-entry:hover > a > .relative img,
    .s-block--banners .banner-square:hover .box-img {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
    }
}

/* ==========================================================================
   13. Page preloader  (markup: top of layouts/master.blade.php)
   ========================================================================== */

.nivo-preloader {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--nivo-bg);
    transition: opacity 0.45s var(--nivo-ease), visibility 0.45s var(--nivo-ease);
}

.nivo-preloader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.nivo-preloader__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.nivo-preloader__logo {
    max-width: 160px;
    max-height: 90px;
    width: auto;
    height: auto;
    object-fit: contain;
    animation: nivo-preloader-breathe 1.6s ease-in-out infinite;
}

.nivo-preloader__name {
    font-family: var(--nivo-font-heading);
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--nivo-ink);
    animation: nivo-preloader-breathe 1.6s ease-in-out infinite;
}

.nivo-preloader__bar {
    position: relative;
    display: block;
    width: 120px;
    height: 3px;
    border-radius: 3px;
    background: var(--nivo-line);
    overflow: hidden;
}

.nivo-preloader__bar span {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 40%;
    border-radius: 3px;
    background: var(--nivo-ink);
    animation: nivo-preloader-slide 1.1s ease-in-out infinite;
}

html[dir="rtl"] .nivo-preloader__bar span {
    animation-name: nivo-preloader-slide-rtl;
}

@keyframes nivo-preloader-breathe {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.65; transform: scale(0.96); }
}

@keyframes nivo-preloader-slide {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(250%); }
}

@keyframes nivo-preloader-slide-rtl {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-250%); }
}

@media (prefers-reduced-motion: reduce) {
    .nivo-preloader__logo,
    .nivo-preloader__name,
    .nivo-preloader__bar span {
        animation: none;
    }
}

/* ==========================================================================
   14. Motion & helpers  (behaviour in assets/js/nivo.js)
   ========================================================================== */

/* ---------- Reveal on scroll ---------- */

.nivo-reveal {
    opacity: 0;
    transform: translateY(22px);
    animation: none !important;
    transition: opacity 0.6s var(--nivo-ease), transform 0.6s var(--nivo-ease),
        border-color 0.2s var(--nivo-ease), box-shadow 0.25s var(--nivo-ease);
}

.nivo-reveal.nivo-in {
    opacity: 1;
    transform: none;
}

/* ---------- Smooth image loading (lazysizes adds .lazyloaded) ---------- */

img.lazyloaded {
    animation: nivo-img-in 0.6s var(--nivo-ease) both;
}

@keyframes nivo-img-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---------- Skeleton loaders (AJAX product areas) ---------- */

.nivo-skeleton {
    position: relative;
    min-height: 340px;
}

.nivo-skeleton::before {
    content: "";
    display: block;
    grid-column: 1 / -1;
    height: 340px;
    border-radius: var(--nivo-radius);
    background:
        linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, 0.75) 50%, transparent 70%) -150% 0 / 60% 100% no-repeat,
        linear-gradient(to bottom, transparent 0 60%, var(--nivo-bg) 60% 64%, transparent 64% 76%, var(--nivo-bg) 76% 80%, transparent 80%),
        repeating-linear-gradient(to right, #e7ebf0 0 calc(20% - 13px), transparent calc(20% - 13px) 20%);
    animation: nivo-shimmer 1.4s ease-in-out infinite;
}

@media (max-width: 767px) {
    .nivo-skeleton,
    .nivo-skeleton::before {
        min-height: 300px;
        height: 300px;
    }

    .nivo-skeleton::before {
        background:
            linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, 0.75) 50%, transparent 70%) -150% 0 / 60% 100% no-repeat,
            linear-gradient(to bottom, transparent 0 60%, var(--nivo-bg) 60% 64%, transparent 64% 76%, var(--nivo-bg) 76% 80%, transparent 80%),
            repeating-linear-gradient(to right, #e7ebf0 0 calc(50% - 6px), transparent calc(50% - 6px) 50%);
    }
}

@keyframes nivo-shimmer {
    to { background-position: 250% 0, 0 0, 0 0; }
}

/* ---------- Sticky add-to-cart bar (product page) ---------- */

.nivo-sticky-atc {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 9990;
    border-top: 1px solid var(--nivo-line);
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: saturate(1.4) blur(10px);
    box-shadow: 0 -10px 30px -18px rgba(15, 23, 42, 0.35);
    transform: translateY(105%);
    transition: transform 0.35s var(--nivo-ease);
}

.nivo-sticky-atc.is-visible {
    transform: none;
}

.nivo-sticky-atc__inner {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-height: 72px;
    padding-block: 0.6rem;
}

.nivo-sticky-atc__img {
    flex: none;
    width: 3.25rem;
    height: 3.25rem;
    padding: 4px;
    border: 1px solid var(--nivo-line);
    border-radius: var(--nivo-radius-sm);
    background: var(--nivo-surface);
    object-fit: contain;
}

.nivo-sticky-atc__info {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.nivo-sticky-atc__name {
    overflow: hidden;
    color: var(--nivo-ink);
    font-size: 0.9rem;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.nivo-sticky-atc__price .productDetails {
    gap: 0.4rem;
}

.nivo-sticky-atc__price .price,
.nivo-sticky-atc__price .special-price {
    color: var(--nivo-ink);
    font-size: 1rem;
    font-weight: 700;
}

.nivo-sticky-atc__price .special-price {
    color: var(--nivo-sale);
}

.nivo-sticky-atc__price .regular-price {
    font-size: 0.8rem;
    color: var(--nivo-muted);
}

.nivo-sticky-atc__btn {
    flex: none;
    min-height: 2.9rem;
    padding: 0 1.5rem;
    border: 0;
    border-radius: var(--nivo-radius-sm);
    background: var(--color-primary);
    color: var(--text-btn);
    font-size: 0.9rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.nivo-sticky-atc__btn:hover:not(:disabled) {
    background: var(--nivo-ink);
    color: #fff;
}

.nivo-sticky-atc__btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (max-width: 575px) {
    .nivo-sticky-atc__img {
        display: none;
    }

    .nivo-sticky-atc__btn {
        padding: 0 1.1rem;
    }
}

/* keep floating buttons clear of the bar */
.floating-social,
#ai-popup-btn,
.nivo-top {
    transition: bottom 0.35s var(--nivo-ease), opacity 0.3s var(--nivo-ease), transform 0.3s var(--nivo-ease);
}

body.nivo-atc-visible .floating-social {
    bottom: 96px;
}

body.nivo-atc-visible #ai-popup-btn {
    bottom: 96px;
}

/* ---------- Scroll-to-top with progress ring ---------- */

.nivo-top {
    position: fixed;
    bottom: 20px;
    inset-inline-start: 20px;
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--nivo-surface);
    box-shadow: 0 10px 24px -10px rgba(15, 23, 42, 0.35);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
}

.nivo-top.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: none;
}

.nivo-top:hover {
    transform: translateY(-2px);
}

.nivo-top__ring {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.nivo-top__track,
.nivo-top__progress {
    fill: none;
    stroke-width: 2.5;
}

.nivo-top__track {
    stroke: var(--nivo-line);
}

.nivo-top__progress {
    stroke: var(--nivo-ink);
    stroke-linecap: round;
    transition: stroke-dashoffset 0.1s linear;
}

.nivo-top__arrow {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--nivo-ink);
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* In RTL the AI chat button sits on the same (right) side — stack above it */
html[dir="rtl"] body:has(#ai-popup-btn) .nivo-top {
    bottom: 92px;
}

body.nivo-atc-visible .nivo-top {
    bottom: 96px;
}

html[dir="rtl"] body.nivo-atc-visible:has(#ai-popup-btn) .nivo-top {
    bottom: 168px;
}

@media (max-width: 767px) {
    .nivo-top {
        bottom: 16px;
        inset-inline-start: 14px;
        width: 2.9rem;
        height: 2.9rem;
    }
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
    .nivo-reveal {
        opacity: 1;
        transform: none;
    }

    img.lazyloaded,
    .nivo-skeleton::before {
        animation: none;
    }

    .nivo-sticky-atc,
    .nivo-top {
        transition: none;
    }
}

/* ==========================================================================
   Header actions v2 — one language button, wallet as a balance chip
   ========================================================================== */

/* language: a single pill (globe · En · currency) */
.nivo-lang {
    gap: 0;
}

.nivo-lang__pill {
    gap: 0.5rem;
    height: 2.5rem;
    padding: 0 0.95rem;
    border: 1px solid var(--nivo-line);
    background: var(--nivo-surface);
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.nivo-lang:hover .nivo-lang__pill {
    border-color: var(--nivo-line-strong);
    background: var(--nivo-subtle);
}

.nivo-lang__pill .nivo-lang__globe {
    display: inline-block;
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    color: var(--nivo-muted);
    font-size: 1rem;
    line-height: 1;
}

/* wallet: icon + balance in an outlined chip, so it never reads as a 2nd cart */
@media (min-width: 1024px) {
    .nivo-header .nivo-wallet .s-cart-summary-wrapper {
        gap: 0.35rem;
        height: 2.5rem;
        padding-inline: 0.25rem 0.85rem;
        border: 1px solid var(--nivo-line);
        border-radius: 999px;
        background: var(--nivo-surface);
        transition: border-color 0.2s ease;
    }

    .nivo-header .nivo-wallet .s-cart-summary-wrapper:hover {
        border-color: var(--nivo-line-strong);
    }

    .nivo-header .nivo-wallet .header-btn {
        width: 2rem;
        height: 2rem;
        background: transparent !important;
    }

    .nivo-header .nivo-wallet .s-wallet-summary-count {
        position: static !important;
        min-width: 0;
        height: auto;
        padding: 0;
        background: none;
        box-shadow: none;
        color: var(--nivo-ink);
        font-size: 0.85rem;
        font-weight: 600;
        line-height: 1;
        transform: none !important;
    }
}

/* ==========================================================================
   Store notify v2 — quiet, premium bars (overrides the admin colour)
   1st: deep slate with a slow light sweep
   2nd: soft paper bar with ink text
   3rd+: slate with a fine dotted texture
   ========================================================================== */

body .store-notify {
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, #0b1220 0%, #1e293b 50%, #0b1220 100%) !important;
    color: #e2e8f0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body .store-notify::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 -40%;
    width: 40%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.08), transparent);
    animation: nivo-notify-sweep 6s ease-in-out infinite;
    pointer-events: none;
}

@keyframes nivo-notify-sweep {
    0%, 30% { transform: translateX(0); }
    100% { transform: translateX(350%); }
}

body .store-notify .container {
    position: relative;
    padding-block: 0.55rem !important;
}

body .store-notify h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em;
}

body .store-notify h2,
body .store-notify h2 a {
    color: inherit !important;
}

body .store-notify h2 a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

body .store-notify h2 i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    margin: 0 !important;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: #fbbf24;
    font-size: 0.8rem !important;
}

body .store-notify .ad-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    padding: 0 !important;
    border-radius: 50%;
    color: inherit !important;
    font-size: 0.7rem;
    opacity: 0.6;
    transition: opacity 0.2s ease, background-color 0.2s ease;
}

body .store-notify .ad-close:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.12);
}

body .store-notify + .store-notify {
    background: #f1f5f9 !important;
    color: var(--nivo-ink) !important;
    border-bottom: 1px solid var(--nivo-line);
}

body .store-notify + .store-notify::before {
    display: none;
}

body .store-notify + .store-notify h2 i {
    background: var(--nivo-ink);
    color: #fff;
}

body .store-notify + .store-notify .ad-close:hover {
    background: var(--nivo-line);
}

body .store-notify + .store-notify + .store-notify {
    background-color: #111827 !important;
    background-image: radial-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1px) !important;
    background-size: 10px 10px !important;
    color: #e5e7eb !important;
    border-bottom: 0;
}

body .store-notify + .store-notify + .store-notify h2 i {
    background: rgba(255, 255, 255, 0.1);
    color: #fbbf24;
}

body .store-notify + .store-notify + .store-notify .ad-close:hover {
    background: rgba(255, 255, 255, 0.12);
}

@media (max-width: 767px) {
    body .store-notify h2 {
        font-size: 0.75rem !important;
        gap: 0.45rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    body .store-notify::before {
        animation: none;
        display: none;
    }
}

/* phones: wallet keeps its icon only — no second badge next to the cart */
@media (max-width: 1023px) {
    .nivo-header .nivo-wallet .s-wallet-summary-count {
        display: none !important;
    }
}


/* ==========================================================================
   Certificate windows (footer: VAT, commercial register, freelance, SBC) —
   fit the screen; the close button stays pinned at the top while the certificate scrolls
   ========================================================================== */
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-wrapper {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    padding: 16px;
}
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-spacer { display: none !important; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-body {
    position: relative;
    width: min(640px, 100%) !important;
    max-width: 100% !important;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    margin: 0 auto !important;
    padding: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    border-radius: 18px;
    background: #fff;
}
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-header {
    position: sticky;
    top: 0;
    z-index: 3;
    display: flex;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 !important;
    padding: 14px 16px !important;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid #ececec;
}
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-close {
    position: static !important;
    order: 2;
    margin-inline-start: auto;
    flex: none;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid !important;
    place-items: center;
    padding: 0 !important;
    background: #222 !important;
    color: #fff !important;
    transform: none !important;
    transition: transform .3s ease;
}
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-close * { color: inherit !important; font-size: 13px; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-close:hover { transform: rotate(90deg) !important; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-header-inner { flex: 1 1 auto; width: auto !important; order: 1; margin: 0 !important; min-width: 0; text-align: start; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-header-inner > slot-fb { display: none; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-title { margin: 0 !important; font-size: 16px !important; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-sub-title { margin: 0 !important; font-size: 12.5px; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-body > .flex { padding: 12px; }
:is(#taxCertificateModal, #CrCertificateModal, #FcCertificateModal, #sbcCertificateModal) .s-modal-body img { width: 100%; height: auto; border-radius: 10px; }