/*
 * TopDeals storefront layer on top of Martfury.
 * Colours are first estimates from the design mockups; tune the tokens below after the side-by-side check.
 */
:root {
    /* From the design prototype (homepage/index.html). */
    --td-navy: #0b1638;
    --td-navy-2: #13214d;
    --td-yellow: #ffc812;
    --td-yellow-dark: #ffb800;
    --td-red: #ee2e3a;
    --td-green: #1d8f43;
    --td-text: #111827;
    --td-muted: #6b7280;
    --td-border: #e5e7eb;
    --td-surface: #f7f8fa;
    --td-radius: 10px;
    --td-shadow: 0 1px 2px rgb(11 31 79 / 0.06), 0 4px 14px rgb(11 31 79 / 0.06);
}

/* ---------- Top bar: trust strip + links ---------- */
.td-header { background: #fff; box-shadow: none; border: 0; }
.td-topbar { background: #fff; border-bottom: 1px solid var(--td-border); }
/* Mockups use Inter throughout; Martfury reads its font from --primary-font (theme option), so override it here. */
body { --primary-font: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-family: var(--primary-font); }
.td-header, .td-header button, .td-header input, .td-header select { font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
.td-topbar__inner { display: flex; align-items: center; justify-content: flex-end; min-height: 32px; gap: 24px; }
.td-flag { display: inline-block; width: 22px; height: 14px; border-radius: 2px; position: relative; overflow: hidden; background: linear-gradient(#319208 0 14%, #ffd200 14% 28%, #de2010 28% 42%, #000 42% 58%, #de2010 58% 72%, #ffd200 72% 86%, #319208 86%); }
.td-flag::before { content: ''; position: absolute; left: 0; top: 0; border-left: 9px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.td-trust { display: flex; gap: 36px; margin: 0; padding: 0; list-style: none; }
.td-trust__item { display: flex; align-items: center; gap: 10px; color: var(--td-text); }
.td-trust__item i { font-size: 22px; color: var(--td-navy); }
.td-trust__item strong { display: block; font-size: 12px; font-weight: 700; line-height: 1.2; }
.td-trust__item small { display: block; font-size: 10.5px; color: var(--td-muted); line-height: 1.2; }
.td-toplinks { display: flex; align-items: center; gap: 30px; margin: 0; padding: 0; list-style: none; }
.td-toplinks > li > a, .td-toplinks .ps-dropdown > a { font-size: 13px; font-weight: 500; color: var(--td-text); display: inline-flex; align-items: center; gap: 6px; }
.td-toplinks a:hover { color: var(--td-navy-2); }
.td-toplinks .icon-chevron-down { font-size: 9px; }
.td-toplinks .ps-dropdown-menu { min-width: 120px; border-radius: 8px; border: 1px solid var(--td-border); box-shadow: var(--td-shadow); }

/* ---------- Main navy bar ---------- */
.td-mainbar { background: var(--td-navy) !important; padding: 14px 0 !important; border: 0 !important; }
.td-mainbar__inner { display: flex !important; flex-wrap: nowrap !important; align-items: center; gap: 28px; }
/* Martfury makes these full width inside .header__top; the TopDeals bar lays them out in one row. */
.td-mainbar__inner > .td-logo, .td-mainbar__inner > .td-allcats, .td-mainbar__inner > .td-actions { flex: 0 0 auto !important; width: auto !important; max-width: none !important; }
.td-mainbar__inner > .td-search { flex: 1 1 auto !important; width: auto !important; min-width: 0; }
.td-logo { display: flex; align-items: center; }
.td-logo img { max-height: 44px; width: auto; }

.td-allcats { flex: 0 0 auto !important; width: auto !important; max-width: none !important; position: relative; }
.td-allcats .menu__toggle { display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 0 18px 0 0; height: 52px; background: transparent !important; position: relative; }
.td-allcats .menu__toggle::after { content: ''; position: absolute; left: 0; right: 18px; bottom: 8px; height: 3px; background: var(--td-yellow); border-radius: 2px; }
.td-allcats .menu__toggle { border: 0; font: inherit; }
.td-allcats .menu__toggle[aria-expanded="true"] i::before { content: '\e92a'; }
/* "All Categories" mega menu: department rail + the active department's sub-categories and popular products. */
.td-catnav { position: relative; }
.td-mega { position: absolute; left: 0; right: 0; top: 100%; z-index: 45; background: #fff; border-top: 1px solid var(--td-border); box-shadow: 0 24px 48px rgba(11, 22, 56, .18); }
.td-mega[hidden], .td-mega__pane[hidden] { display: none !important; }
.td-mega__inner { display: grid !important; grid-template-columns: 250px minmax(0, 1fr); height: min(600px, calc(100vh - 190px)); padding: 0 !important; }
.td-mega__rail { margin: 0; padding: 10px 0; list-style: none; overflow-y: auto; background: #f7f8fb; border-right: 1px solid var(--td-border); }
.td-mega__rail a { display: flex; align-items: center; gap: 12px; padding: 10px 16px 10px 20px; font-size: 14px; font-weight: 500; color: var(--td-navy) !important; border-left: 3px solid transparent; }
.td-mega__rail a > i:first-child { font-size: 18px; width: 20px; text-align: center; }
.td-mega__rail a span { flex: 1; }
.td-mega__chev { font-size: 11px; color: #9aa0ae; }
.td-mega__rail a[aria-selected="true"] { background: #fff; font-weight: 700; border-left-color: var(--td-yellow); }
.td-mega__rail a[aria-selected="true"] .td-mega__chev { color: var(--td-navy); }
.td-mega__pane { overflow-y: auto; padding: 22px 28px 26px; }
.td-mega__head { display: flex; align-items: center; gap: 14px; padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--td-border); }
.td-mega__head img { width: 52px; height: 52px; object-fit: contain; border-radius: 10px; background: #f5f6fa; }
.td-mega__head h3 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.4px; color: var(--td-navy); }
.td-mega__head span { font-size: 13px; color: #6b7385; }
.td-mega__all { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 8px; background: var(--td-yellow); font-size: 13.5px; font-weight: 700; color: var(--td-navy) !important; white-space: nowrap; }
.td-mega__all:hover { background: var(--td-yellow-dark); }
.td-mega__cols { columns: 4 190px; column-gap: 28px; }
.td-mega__group { break-inside: avoid; margin-bottom: 18px; }
.td-mega__sub { display: block; font-size: 14px; font-weight: 700; color: var(--td-navy) !important; margin-bottom: 6px; }
.td-mega__group ul { margin: 0; padding: 0; list-style: none; }
.td-mega__group li a { display: block; padding: 3px 0; font-size: 13px; color: #4a5164 !important; }
.td-mega__sub:hover, .td-mega__group li a:hover { color: #c79200 !important; text-decoration: underline; }
.td-mega__more { font-weight: 600; color: var(--td-navy-2) !important; }
.td-mega__popular { margin-top: 8px; padding-top: 18px; border-top: 1px solid var(--td-border); }
.td-mega__popular h4 { margin: 0 0 12px; font-size: 15px; font-weight: 700; color: var(--td-navy); }
.td-mega__products { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.td-mega__product { display: flex; flex-direction: column; gap: 6px; padding: 10px; border-radius: 10px; border: 1px solid var(--td-border); color: var(--td-navy) !important; transition: box-shadow .15s; }
.td-mega__product:hover { box-shadow: 0 6px 16px rgba(11, 22, 56, .1); }
.td-mega__pimg { display: block; aspect-ratio: 1; }
.td-mega__pimg img { width: 100%; height: 100%; object-fit: contain; }
.td-mega__pname { font-size: 12.5px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }
.td-mega__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin: 0; }
.td-mega__price > span:first-child { font-size: 15px; font-weight: 800; color: var(--td-navy); }
.td-mega__price.sale > span:first-child { color: var(--td-red); }
.td-mega__price small, .td-mega__price del { font-size: 12px; color: #8a90a0; }
.td-mega a:focus-visible { outline: 2px solid var(--td-navy-2); outline-offset: -2px; }
@media (max-width: 1320px) { .td-mega__products { grid-template-columns: repeat(4, minmax(0, 1fr)); } .td-mega__products > :nth-child(n+5) { display: none; } }
@media (max-width: 1100px) { .td-mega__inner { grid-template-columns: 210px minmax(0, 1fr); } .td-mega__cols { columns: 2; } }
@media (max-width: 820px) { .td-mega { display: none !important; } }

.td-search { flex: 1; min-width: 0; padding: 0 !important; max-width: none !important; }
.td-search .ps-form--quick-search { display: flex; align-items: stretch; height: 44px; background: #fff; border-radius: 8px; overflow: visible; position: relative; }
.td-search__icon { align-self: center; padding: 0 4px 0 16px; font-size: 16px; color: var(--td-muted); }
.td-search .input-search-product { flex: 1; height: 44px; border: 0 !important; border-radius: 8px 0 0 8px; font-size: 14px; padding: 0 12px; background: transparent; box-shadow: none !important; }
.td-search .input-search-product::placeholder { color: #9aa1ad; }
.td-search__cat { position: relative; display: flex; align-items: center; min-width: 170px; max-width: 220px; border-left: 1px solid var(--td-border) !important; padding: 0 30px 0 16px !important; background: #fff; }
.td-search__cat .product-cat-label { font-size: 13px; color: var(--td-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 !important; border: 0 !important; background: none !important; }
.td-search__cat select { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.td-search__cat .icon-chevron-down { position: absolute; right: 12px; font-size: 9px; color: var(--td-muted); pointer-events: none; }
.td-search button[type="submit"] { flex: none; width: 52px; border: 0; border-radius: 0 8px 8px 0; background: var(--td-yellow) !important; color: var(--td-navy) !important; font-size: 20px; padding: 0 !important; display: flex; align-items: center; justify-content: center; transition: background-color .2s; }
.td-search button[type="submit"]:hover { background: var(--td-yellow-dark) !important; }
.td-search .spinner-icon { position: absolute; right: 250px; top: 12px; }
.td-search .ps-panel--search-result { top: calc(100% + 4px); border-radius: var(--td-radius); }

.td-actions .header__actions { display: flex; align-items: center; gap: 30px; }
.td-action { display: flex !important; align-items: center; gap: 10px; color: #fff !important; position: relative; padding: 0 !important; width: auto !important; height: auto !important; }
.td-action > i, .td-cart__icon > i { font-size: 26px; color: #fff; }
.td-action strong { display: block; font-size: 13px; font-weight: 600; color: #fff; line-height: 1.2; }
.td-action small { display: block; font-size: 12px; color: rgb(255 255 255 / .75); line-height: 1.2; }
/* Martfury styles every span inside .header__extra as a floating badge; undo that for the TopDeals layout. */
.td-header .td-action > span:not(.td-count), .td-header .td-action .td-cart__icon { position: relative !important; inset: auto !important; width: auto !important; height: auto !important; background: none !important; color: #fff; display: block; }
.td-header .td-action .td-cart__icon { display: inline-flex !important; font-weight: inherit; }
.td-header .td-action > i, .td-header .td-cart__icon > i { font-size: 28px !important; line-height: 1 !important; font-weight: 400 !important; }
.td-toplinks > li::after, .td-toplinks > li::before { display: none !important; }
.td-toplinks > li { border: 0 !important; padding: 0 !important; margin: 0 !important; }
.td-allcats .menu__toggle i, .td-allcats .menu__toggle span { color: var(--td-navy) !important; font-size: 13.5px !important; font-weight: 700 !important; }
.td-allcats .menu__toggle i { font-size: 19px !important; }
.td-count { position: absolute !important; top: -8px !important; right: -10px !important; bottom: auto !important; min-width: 18px; width: auto !important; height: 18px !important; padding: 0 5px; border-radius: 9px; background: var(--td-yellow) !important; display: flex !important; align-items: center; justify-content: center; }
.td-count i { font-style: normal; font-size: 11px; font-weight: 700; color: var(--td-navy) !important; }
.td-count--hidden { display: none !important; }
.td-action:hover strong, .td-action:hover > i { color: var(--td-yellow); }

/* ---------- Category bar ---------- */
.td-catnav { background: #fff !important; border-bottom: 1px solid var(--td-border); padding: 0 !important; }
.td-catnav__inner { display: flex !important; flex-wrap: nowrap !important; align-items: center; gap: 22px; }
.td-catnav__menu { flex: 1; display: flex; align-items: stretch; justify-content: space-between; gap: 6px; margin: 0; padding: 0; list-style: none; }
.td-catnav__menu > li { position: relative; }
.td-catnav__menu > li > a { display: flex; align-items: center; gap: 7px; height: 52px; padding: 0 4px !important; font-size: 13px; font-weight: 500; color: var(--td-navy) !important; border-bottom: 2px solid transparent; line-height: 1.2; white-space: nowrap; }
.td-catnav__menu > li > a:hover { color: #c79200 !important; }
.td-deals-link > a { color: var(--td-red) !important; }
.td-deals-link > a i { width: 20px; height: 20px; border-radius: 50%; background: var(--td-red); color: #fff; font-style: normal; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.td-catnav__menu > li > a img { width: 18px; height: 18px; object-fit: contain; }
.td-catnav__menu > li > a i { font-size: 17px; }

/* ---------- Product card ---------- */
.ps-product { background: #fff; border: 1px solid var(--td-border) !important; border-radius: var(--td-radius); padding: 10px !important; display: flex; flex-direction: column; height: 100%; transition: box-shadow .2s, border-color .2s; }
.ps-product:hover { box-shadow: var(--td-shadow); border-color: #d8dbe0 !important; }
.td-card__media { position: relative; margin-bottom: 8px; border-radius: 8px; overflow: hidden; }
.td-card__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
.td-card__badges { position: absolute; top: 8px; left: 8px; right: auto; display: flex; gap: 6px; }
.td-card__badges .ps-product__badge { position: static !important; border-radius: 6px; padding: 3px 8px; font-size: 12px; font-weight: 700; line-height: 1.4; }
.td-card__discount { background: var(--td-red) !important; color: #fff !important; }
.td-card__wish { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: rgb(255 255 255 / .92); border-radius: 50%; color: var(--td-text); font-size: 16px; transition: color .2s, transform .1s; }
.td-card__wish:hover, .td-card__wish.active { color: var(--td-red); }
.td-card__wish:active { transform: scale(.94); }
.td-card__body { display: flex; flex-direction: column; flex: 1; padding: 0 !important; }
.td-card__vendor { font-size: 11px; color: var(--td-muted); margin-bottom: 2px; }
.td-card__title { font-size: 13.5px; font-weight: 500; color: var(--td-text) !important; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; margin-bottom: 2px; }
.td-card__rating { display: flex; align-items: center; gap: 4px; font-size: 12px; color: var(--td-muted); margin-bottom: 4px; }
.td-card__rating i { color: #f5a623; font-size: 12px; }
.td-card__score { color: var(--td-text); }
.td-card__price { margin: 2px 0 8px !important; font-size: 19px !important; font-weight: 700 !important; color: var(--td-text) !important; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.td-card__price.sale, .td-card__price.sale > span:first-child { color: var(--td-red) !important; }
.td-card__price del { font-size: 12.5px; font-weight: 400; color: var(--td-muted) !important; }
.td-card__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 11.5px; margin: -4px 0 8px; }
.td-card__stock { color: var(--td-green); display: inline-flex; align-items: center; gap: 4px; font-weight: 500; }
.td-card__delivery { color: var(--td-muted); display: inline-flex; align-items: center; gap: 4px; }
.td-card__cta { position: static !important; opacity: 1 !important; visibility: visible !important; transform: none !important; margin-top: auto; display: block !important; width: 100%; padding: 0 !important; background: none !important; }
.td-btn { display: flex !important; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 36px; border-radius: 8px; background: var(--td-yellow); color: var(--td-navy) !important; font-size: 13.5px; font-weight: 700; transition: background-color .2s, transform .1s; }
.td-btn:hover { background: var(--td-yellow-dark); }
.td-btn:active { transform: translateY(1px); }
.td-btn--muted { background: var(--td-surface); color: var(--td-text) !important; border: 1px solid var(--td-border); }
.td-btn.button-loading { opacity: .7; pointer-events: none; }
.td-btn:focus-visible, .td-card__wish:focus-visible, .td-action:focus-visible, .td-catnav__menu a:focus-visible { outline: 2px solid var(--td-navy-2); outline-offset: 2px; }

/* Carousels: cards sit in owl items, keep equal height. */
.owl-item .ps-product { height: calc(100% - 2px); }

/* ---------- Responsive ---------- */
@media (max-width: 1365px) {
    .td-trust { gap: 22px; }
    .td-trust__item small { display: none; }
    .td-actions .header__actions { gap: 20px; }
    .td-search__cat { min-width: 140px; }
}
@media (max-width: 1199px) {
    .td-trust__item:nth-child(n + 3) { display: none; }
    .td-action small, .td-action strong { display: none; }
    .td-catnav__menu { overflow-x: auto; justify-content: flex-start; gap: 22px; scrollbar-width: none; }
    .td-catnav__menu::-webkit-scrollbar { display: none; }
    .td-catnav__menu > li > a { white-space: nowrap; }
}
@media (max-width: 991px) {
    /* Martfury's own mobile header takes over below this width; it gets the navy colour. */
    .header--mobile .navigation--mobile, .header--mobile { background: var(--td-navy) !important; }
    .ps-product { padding: 10px !important; }
    .td-card__price { font-size: 17px !important; }
}
@media (prefers-reduced-motion: reduce) {
    .ps-product, .td-btn, .td-card__wish { transition: none; }
}

/* ---------- Phone header (partials/header-mobile.blade.php) ---------- */
.td-mhead { background: #fff !important; padding: 10px 16px 8px; font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; border-bottom: 1px solid var(--td-border); }
.td-mhead__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.td-wordmark { font-size: 27px; font-weight: 800; letter-spacing: -1.2px; line-height: 1; color: var(--td-navy); }
.td-wordmark span { font-size: 17px; letter-spacing: -.4px; color: #f5b400; }
.td-mhead__cur { position: relative; }
.td-mhead__cur summary { display: flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--td-navy); }
.td-mhead__cur summary::-webkit-details-marker { display: none; }
.td-mhead__cur summary i { font-size: 10px; }
.td-mhead__cur ul { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 110px; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid var(--td-border); border-radius: 10px; box-shadow: var(--td-shadow); }
.td-mhead__cur ul a { display: block; padding: 8px 10px; border-radius: 6px; font-size: 14px; color: var(--td-navy) !important; }
.td-mhead__cur ul a[aria-current] { background: #fff3c4; font-weight: 700; }
.td-mhead__search { margin-top: 10px; padding: 0 !important; background: none !important; }
.td-mhead__search .form-group--nest { display: flex; align-items: center; height: 46px; border: 1px solid #dfe3ec; border-radius: 23px; background: #f8f9fc; padding: 0 6px 0 16px; }
.td-mhead__glass { font-size: 18px; color: var(--td-navy); }
.td-mhead__search input.form-control { flex: 1; height: 100% !important; min-width: 0; border: 0 !important; background: transparent !important; padding: 0 10px !important; font-size: 14px; color: var(--td-navy); box-shadow: none !important; }
.td-mhead__search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.td-mhead__search .td-mhead__go { position: static !important; width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--td-yellow) !important; color: var(--td-navy) !important; display: grid; place-items: center; font-size: 15px; }
.td-mhead__search .spinner-icon { right: 50px !important; }
.td-mchips { display: flex; gap: 8px; margin: 12px -16px 0; padding: 0 16px 2px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.td-mchips::-webkit-scrollbar { display: none; }
.td-mchips a { flex: 0 0 auto; min-width: 84px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 10px 12px; border: 1px solid var(--td-border); border-radius: 12px; background: #fff; color: var(--td-navy) !important; font-size: 12.5px; font-weight: 500; white-space: nowrap; scroll-snap-align: start; }
.td-mchips a i { font-size: 22px; }
.td-mchips a.is-active { background: #ffe9a3; border-color: var(--td-yellow); font-weight: 700; }

/* ---------- Bottom navigation bar ---------- */
.navigation--list { padding: 6px 4px calc(6px + env(safe-area-inset-bottom)) !important; background: #fff !important; border-top: 1px solid var(--td-border); box-shadow: 0 -4px 16px rgba(11, 22, 56, .06); }
.td-bnav { display: flex !important; justify-content: space-around; font-family: Inter, system-ui, sans-serif; }
.td-bnav .navigation__item { position: relative; flex: 1; display: flex !important; flex-direction: column; align-items: center; gap: 3px; padding: 6px 0 2px; color: #5d6477 !important; font-size: 11.5px; font-weight: 500; }
.td-bnav .navigation__item > i { font-size: 22px; color: inherit; }
.td-bnav .navigation__item > span, .td-bnav .navigation__item > b { font-size: 11.5px !important; font-weight: 500; color: inherit; }
.td-bnav .navigation__item.is-active { color: var(--td-navy) !important; font-weight: 700; }
.td-bnav .navigation__item.is-active::before { content: ''; position: absolute; top: -6px; width: 28px; height: 3px; border-radius: 2px; background: var(--td-navy); }
.td-bnav .td-bnav__cart > span { position: absolute; top: 1px; left: calc(50% + 4px); width: auto !important; min-width: 17px; height: 17px; margin: 0 !important; padding: 0 4px !important; border-radius: 9px; background: var(--td-red) !important; line-height: 17px !important; font-size: 10px !important; display: block !important; text-align: center; }
.td-bnav .td-bnav__cart > span i { position: static !important; display: inline !important; width: auto !important; height: auto !important; background: none !important; font-style: normal; font-size: 10px !important; font-weight: 700; line-height: 17px; color: #fff !important; }

/* Sideways rows: drag cursor, a thin scrollbar where there's a mouse, and a fade at the edge that has more. */
.td-mchips, .td-cat-strip { cursor: grab; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.td-mchips.is-end, .td-cat-strip.is-end { -webkit-mask-image: none; mask-image: none; }
.td-mchips.is-dragging, .td-cat-strip.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.td-mchips.is-dragging a, .td-cat-strip.is-dragging a { pointer-events: none; }
@media (hover: hover) and (pointer: fine) {
    .td-mchips, .td-cat-strip { scrollbar-width: thin; scrollbar-color: #c9ced9 transparent; padding-bottom: 6px !important; }
    .td-mchips::-webkit-scrollbar, .td-cat-strip::-webkit-scrollbar { display: block !important; height: 6px; }
    .td-mchips::-webkit-scrollbar-thumb, .td-cat-strip::-webkit-scrollbar-thumb { background: #c9ced9; border-radius: 3px; }
}

/* ---------- Intelligence Engine recommendation blocks (.tie-slot.td-recs, filled after page load) ---------- */
.td-recs .tie-recs { margin: 28px 0 0 !important; font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }
.td-recs .ps-section__header { margin: 0 0 12px !important; padding: 0 !important; border: 0 !important; background: none !important; }
.td-recs .ps-section__header h3 { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -.5px; color: var(--td-navy); font-family: inherit; }
/* Martfury's carousel isn't started for blocks added after load, so the row scrolls sideways instead. */
.td-recs .owl-slider:not(.owl-loaded) { display: flex !important; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; padding: 2px 2px 8px; }
.td-recs .owl-slider:not(.owl-loaded) > .ps-product { flex: 0 0 calc((100% - 5 * 10px) / 6.3); min-width: 170px; margin: 0 !important; scroll-snap-align: start; }
.td-recs .td-card__vendor { display: none; }
@media (max-width: 767px) {
    .td-recs .owl-slider:not(.owl-loaded) > .ps-product { flex-basis: 46%; min-width: 150px; }
}

/* ---------- Live search dropdown (views/ecommerce/includes/ajax-search-results.blade.php) ---------- */
.ps-panel--search-result { border-radius: 12px !important; border: 1px solid var(--td-border) !important; box-shadow: 0 18px 40px rgba(11, 22, 56, .18) !important; overflow: hidden; padding: 0 !important; background: #fff !important; }
.ps-panel--search-result.active { max-height: min(560px, 70vh); overflow-y: auto; }
.td-sr { max-height: none !important; overflow: visible !important; padding: 8px 0 0 !important; font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; color: var(--td-navy); text-align: left; }
.td-sr a { text-decoration: none; }
.td-sr mark { padding: 0; background: none; color: inherit; font-weight: 700; }
.td-sr__group { padding: 4px 0 6px; }
.td-sr__group + .td-sr__group { border-top: 1px solid var(--td-border); }
.td-sr__label { margin: 4px 16px 6px; font-size: 11.5px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--td-muted); }
.td-sr__cats { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 4px; }
.td-sr__cats a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--td-border); border-radius: 18px; font-size: 13px; color: var(--td-navy) !important; background: #fff; }
.td-sr__cats a:hover { border-color: var(--td-yellow); background: #fffaeb; }
.td-sr__cats small { font-size: 11.5px; color: var(--td-muted); }
.td-sr__item { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 7px 16px; color: var(--td-navy) !important; }
.td-sr__item:hover, .td-sr__item:focus-visible { background: #f5f6fa; outline: 0; }
.td-sr__img { width: 44px; height: 44px; border-radius: 8px; border: 1px solid var(--td-border); background: #fff; display: grid; place-items: center; overflow: hidden; }
.td-sr__img img { max-width: 100%; max-height: 100%; object-fit: contain; }
.td-sr__name { font-size: 13.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.td-sr__price { display: flex; flex-direction: column; align-items: flex-end; margin: 0; white-space: nowrap; }
.td-sr__price > span:first-child { font-size: 14px; font-weight: 800; color: var(--td-navy); }
.td-sr__price.sale > span:first-child { color: var(--td-red); }
.td-sr__price small, .td-sr__price del { font-size: 11.5px; color: #8a90a0; }
.td-sr__all { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--td-border); background: #fffaeb; font-size: 14px; font-weight: 700; color: var(--td-navy) !important; }
.td-sr__all:hover { background: #fff3c4; }
.td-sr__empty { display: flex; flex-direction: column; gap: 6px; padding: 14px 0 12px; }
.td-sr__empty b, .td-sr__empty > span { padding: 0 16px; }
.td-sr__empty b { font-size: 15px; }
.td-sr__empty > span { font-size: 13px; color: var(--td-muted); }
