/* ==========================================================================
   IT Me Up - OpenCart 4.1 theme  (v2)
   --------------------------------------------------------------------------
   Two looks driven by the same tokens:
     html[data-bs-theme="dark"]  "Gaming" - dark everywhere, neon accents (default)
     html[data-bs-theme="light"] "Clean"  - light throughout
   Shoppers can switch with the sun/moon button (remembered in a cookie).

   Accessibility rules this file follows:
   - Body text and prices meet WCAG AA contrast (4.5:1+) in both looks; most is AAA.
   - Colour never carries meaning on its own: stock states use an icon + words,
     links in text are underlined, errors have an icon.
   - Stock colours come from the Okabe-Ito colour-blind-safe palette
     (bluish green / orange / grey), not red vs green.
   - One high-visibility focus ring (amber + dark halo) for keyboard users.
   - Honours prefers-reduced-motion, prefers-contrast and Windows high contrast.
   ========================================================================== */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/inter-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/inter-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url("fonts/inter-latin-800-normal.woff2") format("woff2"); }

/* ---------- Tokens: light ("Clean") ---------- */
:root, :root[data-bs-theme=light] {
  --itm-bg: #f3f5f9;
  --itm-surface: #ffffff;
  --itm-surface-2: #f6f8fb;
  --itm-surface-3: #eceff5;
  --itm-border: #e1e5ec;
  --itm-border-strong: #c5ccd8;
  --itm-text: #353d4a;
  --itm-strong: #0f1623;
  --itm-muted: #5b6472;
  --itm-link: #0a55e8;
  --itm-link-hover: #0640b3;
  --itm-accent: #0a55e8;          /* primary buttons */
  --itm-accent-hover: #0640b3;
  --itm-on-accent: #ffffff;
  --itm-accent-soft: #e8f0ff;
  --itm-accent-2: #6d28d9;        /* secondary highlight */
  --itm-chrome: #0b1b33;          /* top bar / header / footer */
  --itm-chrome-2: #13294b;
  --itm-chrome-text: #d5ddeb;
  --itm-chrome-strong: #ffffff;
  --itm-chrome-muted: #a9b6cc;
  --itm-chrome-border: #22385c;
  --itm-header: #ffffff;
  --itm-header-text: #0f1623;
  --itm-header-muted: #5b6472;
  --itm-nav: #0a55e8;
  --itm-nav-text: #ffffff;
  --itm-glow: rgba(10, 85, 232, .18);
  /* Okabe-Ito based status colours (text on soft background, all >= 4.5:1) */
  --itm-ok: #03694f;       --itm-ok-bg: #e2f5ee;    --itm-ok-line: #7fd0b4;
  --itm-due: #8a4600;      --itm-due-bg: #fff1dc;   --itm-due-line: #f0b35a;
  --itm-out: #474f5c;      --itm-out-bg: #eceef2;   --itm-out-line: #b8bfca;
  --itm-danger: #a3320b;   --itm-danger-bg: #fdece4;
  --itm-focus: #ffbf1f;
  --itm-focus-halo: #0f1623;
  --itm-radius: 14px;
  --itm-radius-sm: 9px;
  --itm-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
  --itm-shadow-lg: 0 14px 36px rgba(16, 24, 40, .16);
  --itm-rgb: linear-gradient(90deg, #22d3ee 0%, #3b82f6 35%, #8b5cf6 68%, #ec4899 100%);
  --itm-hero: radial-gradient(circle at 85% 20%, rgba(34, 211, 238, .45), transparent 40%), linear-gradient(135deg, #0b1b33 0%, #0d2f6b 55%, #0a55e8 100%);
}

/* ---------- Tokens: dark ("Gaming") ---------- */
:root[data-bs-theme=dark] {
  color-scheme: dark;
  --itm-bg: #090c12;
  --itm-surface: #111620;
  --itm-surface-2: #161c28;
  --itm-surface-3: #1c2331;
  --itm-border: #252e3f;
  --itm-border-strong: #3a4659;
  --itm-text: #d3dae6;       /* 12.6:1 on surface */
  --itm-strong: #f6f8fc;
  --itm-muted: #9ba7ba;      /* 7.3:1 on surface */
  --itm-link: #5fdcf5;       /* 10.9:1 */
  --itm-link-hover: #a5eefc;
  --itm-accent: #22d3ee;     /* cyan buttons with near-black text: 10.6:1 */
  --itm-accent-hover: #67e8f9;
  --itm-on-accent: #041017;
  --itm-accent-soft: rgba(34, 211, 238, .12);
  --itm-accent-2: #b69cff;
  --itm-chrome: #06080d;
  --itm-chrome-2: #0d1118;
  --itm-chrome-text: #c3ccda;
  --itm-chrome-strong: #ffffff;
  --itm-chrome-muted: #97a3b6;
  --itm-chrome-border: #1c2433;
  --itm-header: rgba(13, 17, 24, .92);
  --itm-header-text: #eef2f8;
  --itm-header-muted: #9ba7ba;
  --itm-nav: #0d1118;
  --itm-nav-text: #dbe2ee;
  --itm-glow: rgba(34, 211, 238, .22);
  --itm-ok: #45d6a8;       --itm-ok-bg: rgba(0, 158, 115, .16);   --itm-ok-line: rgba(69, 214, 168, .45);
  --itm-due: #f7b84b;      --itm-due-bg: rgba(230, 159, 0, .15);  --itm-due-line: rgba(247, 184, 75, .45);
  --itm-out: #b3bccb;      --itm-out-bg: rgba(155, 167, 186, .12); --itm-out-line: rgba(179, 188, 203, .35);
  --itm-danger: #ff9e7a;   --itm-danger-bg: rgba(213, 94, 0, .16);
  --itm-focus: #ffbf1f;
  --itm-focus-halo: #000000;
  --itm-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 1px 3px rgba(0, 0, 0, .5);
  --itm-shadow-lg: 0 18px 44px rgba(0, 0, 0, .55);
  --itm-hero:
    radial-gradient(circle at 82% 18%, rgba(139, 92, 246, .55), transparent 38%),
    radial-gradient(circle at 70% 92%, rgba(34, 211, 238, .32), transparent 40%),
    linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(135deg, #06080d 0%, #0e1320 55%, #171238 100%);

  /* Bootstrap 5.3 dark mode, tuned to the theme */
  --bs-body-bg: var(--itm-bg);
  --bs-body-color: var(--itm-text);
  --bs-emphasis-color: var(--itm-strong);
  --bs-secondary-color: var(--itm-muted);
  --bs-secondary-bg: var(--itm-surface-2);
  --bs-tertiary-bg: var(--itm-surface-3);
  --bs-border-color: var(--itm-border);
  --bs-heading-color: var(--itm-strong);
  --bs-link-color: var(--itm-link);
  --bs-link-color-rgb: 95, 220, 245;
  --bs-link-hover-color: var(--itm-link-hover);
  --bs-link-hover-color-rgb: 165, 238, 252;
  --bs-primary: var(--itm-accent);
  --bs-primary-rgb: 34, 211, 238;
  --bs-form-valid-color: var(--itm-ok);
  --bs-form-valid-border-color: var(--itm-ok);
  --bs-form-invalid-color: var(--itm-danger);
  --bs-form-invalid-border-color: var(--itm-danger);
}
:root { --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
:root[data-bs-theme=light] { --bs-primary: var(--itm-accent); --bs-primary-rgb: 10, 85, 232; --bs-link-color: var(--itm-link); --bs-link-color-rgb: 10, 85, 232; --bs-link-hover-color: var(--itm-link-hover); --bs-body-color: var(--itm-text); --bs-border-color: var(--itm-border); }

/* ---------- Base ---------- */
body.itm { font-family: var(--bs-body-font-family); font-size: 15px; line-height: 1.55; color: var(--itm-text); background: var(--itm-bg); -webkit-font-smoothing: antialiased; }
.itm h1, .itm h2, .itm h3, .itm h4, .itm h5, .itm h6, .itm legend { color: var(--itm-strong); font-weight: 700; letter-spacing: -0.01em; }
.itm :where(a:not(.btn)) { color: var(--itm-link); text-decoration: none; }
.itm :where(a:not(.btn)):hover { color: var(--itm-link-hover); }
/* links inside running text are underlined so they don't rely on colour */
.itm :where(#content p, #content li, #content td, .itm-chat-msg, .alert) a:not(.btn):not(.itm-chip) { text-decoration: underline; text-underline-offset: 2px; }
.itm .container { max-width: 1320px; }
.itm main { min-height: 50vh; }
.itm-skip { position: absolute; left: 8px; top: 8px; z-index: 2000; background: var(--itm-focus); color: #000 !important; font-weight: 700; padding: 10px 14px; border-radius: 6px; }
.itm hr { border-color: var(--itm-border); opacity: 1; }
.itm .text-muted, .itm .form-text { color: var(--itm-muted) !important; }
.itm ::selection { background: var(--itm-accent); color: var(--itm-on-accent); }

/* Focus: one unmistakable ring everywhere (keyboard only) */
.itm :focus { outline: none; }
.itm :focus-visible, .itm .btn:focus-visible, .itm .form-control:focus-visible, .itm .form-select:focus-visible, .itm .form-check-input:focus-visible {
  outline: 3px solid var(--itm-focus) !important; outline-offset: 2px; box-shadow: 0 0 0 5px var(--itm-focus-halo) !important; border-radius: 6px;
}

/* ---------- Buttons & forms ---------- */
.itm .btn { border-radius: var(--itm-radius-sm); font-weight: 600; }
.itm .btn-primary { --bs-btn-color: var(--itm-on-accent); --bs-btn-bg: var(--itm-accent); --bs-btn-border-color: var(--itm-accent); --bs-btn-hover-color: var(--itm-on-accent); --bs-btn-hover-bg: var(--itm-accent-hover); --bs-btn-hover-border-color: var(--itm-accent-hover); --bs-btn-active-color: var(--itm-on-accent); --bs-btn-active-bg: var(--itm-accent-hover); --bs-btn-active-border-color: var(--itm-accent-hover); --bs-btn-disabled-color: var(--itm-muted); --bs-btn-disabled-bg: var(--itm-surface-3); --bs-btn-disabled-border-color: var(--itm-border); --bs-btn-disabled-opacity: 1; }
.itm .btn-outline-primary { --bs-btn-color: var(--itm-link); --bs-btn-border-color: var(--itm-accent); --bs-btn-hover-color: var(--itm-on-accent); --bs-btn-hover-bg: var(--itm-accent); --bs-btn-hover-border-color: var(--itm-accent); --bs-btn-active-bg: var(--itm-accent); --bs-btn-active-color: var(--itm-on-accent); }
.itm .btn-light, .itm .btn-secondary, .itm .btn-outline-secondary { --bs-btn-color: var(--itm-strong); --bs-btn-bg: var(--itm-surface-2); --bs-btn-border-color: var(--itm-border-strong); --bs-btn-hover-color: var(--itm-strong); --bs-btn-hover-bg: var(--itm-surface-3); --bs-btn-hover-border-color: var(--itm-border-strong); --bs-btn-active-bg: var(--itm-surface-3); --bs-btn-active-color: var(--itm-strong); }
.itm .btn-danger { --bs-btn-color: #fff; --bs-btn-bg: #b33a0f; --bs-btn-border-color: #b33a0f; --bs-btn-hover-bg: #93300c; --bs-btn-hover-border-color: #93300c; }
.itm .btn-outline-light { --bs-btn-color: #fff; --bs-btn-border-color: rgba(255, 255, 255, .6); --bs-btn-hover-color: #0b1b33; --bs-btn-hover-bg: #fff; }
.itm .form-control, .itm .form-select { border-radius: var(--itm-radius-sm); border-color: var(--itm-border-strong); background-color: var(--itm-surface); color: var(--itm-strong); }
.itm .form-control::placeholder { color: var(--itm-muted); opacity: 1; }
.itm .form-control:focus, .itm .form-select:focus { border-color: var(--itm-accent); box-shadow: 0 0 0 3px var(--itm-glow); background-color: var(--itm-surface); color: var(--itm-strong); }
.itm .form-check-input { border-color: var(--itm-border-strong); background-color: var(--itm-surface); }
.itm .form-check-input:checked { background-color: var(--itm-accent); border-color: var(--itm-accent); }
.itm .input-group-text { background: var(--itm-surface-2); color: var(--itm-text); border-color: var(--itm-border-strong); font-size: 14px; }
.itm .invalid-feedback::before, .itm .text-danger::before { content: "\f06a"; font: var(--fa-font-solid); margin-right: 6px; }
.itm .text-danger, .itm .invalid-feedback { color: var(--itm-danger) !important; }
.itm .is-invalid { border-color: var(--itm-danger) !important; border-width: 2px; }
.itm #alert { position: fixed; top: 12px; right: 12px; z-index: 1100; max-width: 420px; }
.itm .alert { border-radius: var(--itm-radius-sm); border-width: 1px; }
.itm .alert-success { color: var(--itm-ok); background: var(--itm-surface); border-color: var(--itm-ok-line); border-left: 5px solid var(--itm-ok); box-shadow: var(--itm-shadow-lg); }
.itm .alert-danger { color: var(--itm-danger); background: var(--itm-surface); border-color: var(--itm-danger); border-left: 5px solid var(--itm-danger); box-shadow: var(--itm-shadow-lg); }
.itm .alert-warning { color: var(--itm-due); background: var(--itm-due-bg); border-color: var(--itm-due-line); }
.itm .alert-info { color: var(--itm-text); background: var(--itm-accent-soft); border-color: var(--itm-border-strong); }
.itm .alert-dismissible .btn-close { filter: var(--itm-close-filter, none); }
:root[data-bs-theme=dark] { --itm-close-filter: invert(1) grayscale(1) brightness(2); }
.itm .dropdown-menu { --bs-dropdown-bg: var(--itm-surface); --bs-dropdown-color: var(--itm-text); --bs-dropdown-border-color: var(--itm-border); --bs-dropdown-link-color: var(--itm-text); --bs-dropdown-link-hover-color: var(--itm-strong); --bs-dropdown-link-hover-bg: var(--itm-surface-3); --bs-dropdown-link-active-bg: var(--itm-accent); --bs-dropdown-link-active-color: var(--itm-on-accent); --bs-dropdown-divider-bg: var(--itm-border); box-shadow: var(--itm-shadow-lg); border-radius: var(--itm-radius-sm); }
.itm .table { --bs-table-bg: transparent; --bs-table-color: var(--itm-text); --bs-table-border-color: var(--itm-border); --bs-table-striped-bg: var(--itm-surface-2); --bs-table-hover-bg: var(--itm-surface-2); }
.itm .table > thead { color: var(--itm-strong); }
.itm .card { --bs-card-bg: var(--itm-surface); --bs-card-cap-bg: var(--itm-surface-2); --bs-card-border-color: var(--itm-border); border-radius: var(--itm-radius); color: var(--itm-text); }
.itm .list-group { --bs-list-group-bg: var(--itm-surface); --bs-list-group-color: var(--itm-text); --bs-list-group-border-color: var(--itm-border); --bs-list-group-action-hover-bg: var(--itm-surface-2); --bs-list-group-action-hover-color: var(--itm-strong); --bs-list-group-active-bg: var(--itm-accent); --bs-list-group-active-border-color: var(--itm-accent); --bs-list-group-active-color: var(--itm-on-accent); }
.itm .modal { --bs-modal-bg: var(--itm-surface); --bs-modal-color: var(--itm-text); --bs-modal-border-color: var(--itm-border); --bs-modal-header-border-color: var(--itm-border); --bs-modal-footer-border-color: var(--itm-border); }
.itm .modal .btn-close, .itm .offcanvas .btn-close { filter: var(--itm-close-filter, none); }
.itm .nav-tabs { --bs-nav-tabs-border-color: var(--itm-border); }
.itm .accordion { --bs-accordion-bg: var(--itm-surface); --bs-accordion-color: var(--itm-text); --bs-accordion-border-color: var(--itm-border); --bs-accordion-btn-color: var(--itm-strong); --bs-accordion-active-bg: var(--itm-surface-2); --bs-accordion-active-color: var(--itm-strong); }
.itm legend { font-size: 18px; }
.itm kbd { background: var(--itm-surface-3); color: var(--itm-strong); border: 1px solid var(--itm-border-strong); font-family: inherit; font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 5px; box-shadow: none; }

/* ---------- Top bar ---------- */
.itm-topbar { background: var(--itm-chrome); color: var(--itm-chrome-text); font-size: 13px; }
.itm-topbar .container { min-height: 36px; }
.itm-topbar ul { display: flex; gap: 24px; align-items: center; }
.itm-topbar li { display: flex; align-items: center; gap: 7px; }
.itm-topbar i { color: #22d3ee; }
.itm-topbar a { color: var(--itm-chrome-strong) !important; }
.itm-topbar a:hover { text-decoration: underline !important; }

/* ---------- Header ---------- */
.itm-header { background: var(--itm-header); border-bottom: 1px solid var(--itm-border); position: sticky; top: 0; z-index: 1030; -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px); }
.itm-header-row { display: flex; align-items: center; gap: 24px; min-height: 76px; }
.itm-logo img { height: 44px; width: auto; display: block; }
.itm-logo-text { font-weight: 800; font-size: 26px; color: var(--itm-header-text) !important; }
.itm-logo .itm-logo-light { display: none; }
:root[data-bs-theme=dark] .itm-logo .itm-logo-light { display: block; }
:root[data-bs-theme=dark] .itm-logo .itm-logo-default { display: none; }
.itm-search { flex: 1; max-width: 700px; position: relative; }
.itm-search-form { position: relative; margin: 0; }
.itm-search-form .form-control { height: 48px; padding: 0 92px 0 18px; border-radius: 24px; border: 2px solid var(--itm-border); background: var(--itm-surface-2); color: var(--itm-strong); font-size: 15px; }
.itm-search-form .form-control:focus { background: var(--itm-surface); border-color: var(--itm-accent); box-shadow: 0 0 0 4px var(--itm-glow); }
.itm-search-form .form-control::-webkit-search-cancel-button { display: none; }
.itm-search-kbd { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.itm-search-form:focus-within .itm-search-kbd { display: none; }
.itm-search-btn { position: absolute; right: 5px; top: 5px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--itm-accent); color: var(--itm-on-accent); }
.itm-search-btn:hover { background: var(--itm-accent-hover); }
:root[data-bs-theme=dark] .itm-search-btn { background: var(--itm-rgb); background-size: 200% 100%; color: #fff; }
.itm-actions { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.itm-action { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--itm-radius-sm); color: var(--itm-header-text) !important; background: none; border: 0; line-height: 1.15; }
.itm-action:hover { background: var(--itm-surface-3); }
.itm-action > i, .itm-cart-icon > i { font-size: 21px; color: var(--itm-header-text); }
.itm-action-label { display: flex; flex-direction: column; font-weight: 600; font-size: 14px; text-align: left; }
.itm-action-label small { font-weight: 500; font-size: 12px; color: var(--itm-header-muted); }
.itm-mode-btn { width: 42px; height: 42px; justify-content: center; padding: 0; }
.itm-mode-btn i { font-size: 18px !important; }
.itm-mode-btn .fa-sun { display: none; }
:root[data-bs-theme=dark] .itm-mode-btn .fa-sun { display: inline-block; }
:root[data-bs-theme=dark] .itm-mode-btn .fa-moon { display: none; }
.itm-cart-icon { position: relative; }
.itm-cart-count { position: absolute; top: -8px; right: -10px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: #ff6a13; color: #1a0a00; font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
:root[data-bs-theme=dark] .itm-cart-count { background: #ff5fb0; color: #1a0010; box-shadow: 0 0 10px rgba(236, 72, 153, .6); }
.itm-cart-btn { background: var(--itm-accent-soft); border: 1px solid transparent; }
.itm-cart-btn:hover { border-color: var(--itm-accent); }
.itm-burger { border: 0; background: none; font-size: 22px; color: var(--itm-header-text); padding: 6px; }

/* Live search suggestions */
.itm-suggest { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 1060; background: var(--itm-surface); border: 1px solid var(--itm-border-strong); border-radius: var(--itm-radius); box-shadow: var(--itm-shadow-lg); overflow: hidden; max-height: min(72vh, 620px); overflow-y: auto; }
.itm-suggest[hidden] { display: none; }
.itm-suggest-group { padding: 10px 14px 4px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--itm-muted); }
.itm-suggest-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 14px 10px; }
.itm-suggest-item { display: grid; grid-template-columns: 52px 1fr auto; gap: 12px; align-items: center; padding: 8px 14px; color: var(--itm-text) !important; border-top: 1px solid var(--itm-border); }
.itm-suggest-item[aria-selected=true], .itm-suggest-item:hover { background: var(--itm-surface-3); }
.itm-suggest-item img { width: 52px; height: 52px; object-fit: contain; border-radius: 8px; background: #fff; }
.itm-suggest-name { font-weight: 600; font-size: 14px; color: var(--itm-strong); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.3; }
.itm-suggest-name mark { background: none; color: var(--itm-link); padding: 0; font-weight: 800; }
.itm-suggest-meta { font-size: 12px; color: var(--itm-muted); display: flex; gap: 10px; align-items: center; margin-top: 2px; flex-wrap: wrap; }
.itm-suggest-price { font-weight: 800; color: var(--itm-strong); white-space: nowrap; }
.itm-suggest-all { display: block; padding: 12px 14px; font-weight: 700; border-top: 1px solid var(--itm-border); background: var(--itm-surface-2); }
.itm-suggest-empty { padding: 16px; color: var(--itm-muted); }

/* Chips (brand filter, suggestions) */
.itm-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--itm-border-strong); background: var(--itm-surface); color: var(--itm-strong) !important; font-size: 13px; font-weight: 600; white-space: nowrap; }
.itm-chip small { color: var(--itm-muted); font-weight: 500; }
.itm-chip:hover { border-color: var(--itm-accent); }
.itm-chip.is-active { background: var(--itm-accent); border-color: var(--itm-accent); color: var(--itm-on-accent) !important; }
.itm-chip.is-active small { color: var(--itm-on-accent); }
.itm-chip.is-active::before { content: "\f00c"; font: var(--fa-font-solid); font-size: 11px; }

/* Mini basket */
.itm-minicart { width: 380px; padding: 0; border-radius: var(--itm-radius); box-shadow: var(--itm-shadow-lg); border: 1px solid var(--itm-border); overflow: hidden; background: var(--itm-surface); }
.itm-minicart-items { max-height: 340px; overflow-y: auto; }
.itm-minicart-item { display: grid; grid-template-columns: 52px 1fr auto 28px; gap: 10px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--itm-border); }
.itm-minicart-thumb img { width: 52px; height: 52px; object-fit: contain; border-radius: 6px; background: #fff; }
.itm-minicart-info a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 600; font-size: 13px; color: var(--itm-strong); }
.itm-minicart-info small { color: var(--itm-muted); font-size: 12px; }
.itm-minicart-total { font-weight: 700; font-size: 14px; white-space: nowrap; color: var(--itm-strong); }
.itm-minicart-remove { border: 0; background: none; color: var(--itm-muted); }
.itm-minicart-remove:hover { color: var(--itm-danger); }
.itm-minicart-totals { width: 100%; font-size: 14px; }
.itm-minicart-totals td { padding: 6px 14px; }
.itm-minicart-totals td:last-child { text-align: right; font-weight: 600; }
.itm-minicart-totals tr:last-child td { font-weight: 800; font-size: 16px; color: var(--itm-strong); }
.itm-minicart-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px 14px 14px; }
.itm-minicart-empty { text-align: center; padding: 28px 16px; color: var(--itm-muted); }
.itm-minicart-empty i { font-size: 32px; color: var(--itm-border-strong); margin-bottom: 8px; }

/* ---------- Navigation ---------- */
.itm-nav { background: var(--itm-nav); position: relative; z-index: 1020; }
:root[data-bs-theme=dark] .itm-nav::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--itm-rgb); }
.itm-nav-list { display: flex; align-items: stretch; gap: 2px; }
.itm-nav-link, .itm-nav-all-btn { display: flex; align-items: center; gap: 8px; height: 48px; padding: 0 14px; color: var(--itm-nav-text) !important; font-weight: 600; font-size: 14px; background: none; border: 0; white-space: nowrap; }
.itm-nav-link .fa-chevron-down { font-size: 10px; opacity: .8; }
.itm-nav-link:hover, .itm-nav-item.show .itm-nav-link { background: rgba(0, 0, 0, .18); }
:root[data-bs-theme=dark] .itm-nav-link:hover, :root[data-bs-theme=dark] .itm-nav-item.show .itm-nav-link { background: var(--itm-surface-2); color: #fff !important; }
.itm-nav-all-btn { background: rgba(0, 0, 0, .2); padding: 0 20px; margin-right: 6px; }
:root[data-bs-theme=dark] .itm-nav-all-btn { background: linear-gradient(135deg, #1d4ed8, #7c3aed); color: #fff !important; }
.itm-nav-all-btn:hover, .itm-nav-all.is-open .itm-nav-all-btn { filter: brightness(1.12); }
.itm-nav-drop { border-radius: 0 0 var(--itm-radius) var(--itm-radius); margin-top: 0 !important; min-width: 260px; padding: 8px; }
.itm-nav-drop .dropdown-item { border-radius: 6px; padding: 8px 12px; font-size: 14px; }
.itm-nav-all { position: static; }
.itm-mega { display: none; position: absolute; left: 0; right: 0; top: 100%; }
.itm-nav-all.is-open .itm-mega { display: block; }
.itm-mega-inner { max-width: 1296px; margin: 0 auto; display: grid; grid-template-columns: 300px 1fr; background: var(--itm-surface); border: 1px solid var(--itm-border); border-top: 0; border-radius: 0 0 var(--itm-radius) var(--itm-radius); box-shadow: var(--itm-shadow-lg); overflow: hidden; min-height: 420px; }
.itm-mega-side { background: var(--itm-surface-2); padding: 8px 0; max-height: 70vh; overflow-y: auto; }
.itm-mega-side a { display: flex; align-items: center; gap: 10px; padding: 9px 20px; color: var(--itm-strong) !important; font-size: 14px; font-weight: 500; border-left: 3px solid transparent; }
.itm-mega-side a i { color: var(--itm-muted); }
.itm-mega-side li.is-active a { background: var(--itm-surface); color: var(--itm-link) !important; font-weight: 700; border-left-color: var(--itm-accent); }
.itm-mega-side li.is-active a i { color: var(--itm-link); }
.itm-mega-panels { padding: 24px 32px; }
.itm-mega-panel { display: none; }
.itm-mega-panel.is-active { display: block; }
.itm-mega-head { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--itm-border); padding-bottom: 12px; margin-bottom: 16px; }
.itm-mega-head h3 { font-size: 20px; margin: 0; }
.itm-mega-head a { font-weight: 600; font-size: 14px; }
.itm-mega-links { columns: 3; column-gap: 32px; }
.itm-mega-links li { break-inside: avoid; }
.itm-mega-links a { display: block; padding: 6px 0; color: var(--itm-text) !important; font-size: 14px; }
.itm-mega-links a:hover { color: var(--itm-link) !important; text-decoration: underline !important; }

/* Mobile menu */
.itm-offcanvas { background: var(--itm-surface); color: var(--itm-text); }
.itm-offcanvas .offcanvas-title { font-weight: 700; color: var(--itm-strong); }
.itm-offcanvas .accordion-button { font-weight: 600; font-size: 15px; background: var(--itm-surface); color: var(--itm-strong); }
.itm-offcanvas .accordion-button:not(.collapsed) { background: var(--itm-accent-soft); color: var(--itm-link); box-shadow: none; }
:root[data-bs-theme=dark] .itm-offcanvas .accordion-button::after { filter: invert(1) grayscale(1) brightness(2); }
.itm-offcanvas .accordion-body { display: flex; flex-direction: column; gap: 10px; padding-left: 48px; }
.itm-offcanvas .accordion-body a { color: var(--itm-text); }
.itm-mobile-link { display: flex; align-items: center; padding: 16px 20px; font-weight: 600; color: var(--itm-strong) !important; }

/* ---------- Home ---------- */
.itm-hero-wrap { padding: 24px 0 0; }
.itm-hero-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; }
.itm-hero { position: relative; overflow: hidden; border-radius: 20px; padding: 52px 48px; min-height: 350px; color: #fff; display: flex; align-items: center; background: var(--itm-hero); border: 1px solid var(--itm-border); box-shadow: var(--itm-shadow-lg); }
.itm-hero-copy { position: relative; z-index: 2; max-width: 560px; }
.itm-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #67e8f9; background: rgba(34, 211, 238, .1); border: 1px solid rgba(34, 211, 238, .35); padding: 6px 12px; border-radius: 20px; margin-bottom: 16px; }
.itm-eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #45d6a8; box-shadow: 0 0 10px #45d6a8; }
.itm-hero h1 { color: #fff; font-size: clamp(32px, 4.2vw, 50px); font-weight: 800; line-height: 1.05; margin-bottom: 16px; letter-spacing: -0.025em; }
:root[data-bs-theme=dark] .itm-hero h1 { background: linear-gradient(90deg, #fff 0%, #fff 55%, #d6c9ff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.itm-hero p { color: #d0d9e8; font-size: 17px; margin-bottom: 26px; }
.itm-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.itm-hero-cta .btn-light { --bs-btn-bg: #fff; --bs-btn-color: #0b1b33; --bs-btn-border-color: #fff; --bs-btn-hover-bg: #e8eefb; --bs-btn-hover-color: #0b1b33; }
:root[data-bs-theme=dark] .itm-hero-cta .btn-light { --bs-btn-bg: #22d3ee; --bs-btn-border-color: #22d3ee; --bs-btn-color: #041017; --bs-btn-hover-bg: #67e8f9; --bs-btn-hover-border-color: #67e8f9; --bs-btn-hover-color: #041017; box-shadow: 0 8px 28px rgba(34, 211, 238, .35); }
.itm-hero-stats { display: flex; gap: 28px; margin-top: 28px; flex-wrap: wrap; }
.itm-hero-stats div { display: flex; flex-direction: column; }
.itm-hero-stats strong { font-size: 22px; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }
.itm-hero-stats span { font-size: 13px; color: #b9c4d6; }
.itm-hero-art { position: absolute; right: -10px; top: 0; bottom: 0; width: 38%; z-index: 1; }
.itm-hero-art i { position: absolute; color: rgba(255, 255, 255, .08); }
.itm-art-1 { font-size: 170px; right: 40px; top: 70px; color: rgba(139, 92, 246, .24) !important; text-shadow: 0 0 60px rgba(139, 92, 246, .5); }
.itm-art-2 { font-size: 90px; right: 200px; top: 26px; }
.itm-art-3 { font-size: 64px; right: 40px; bottom: 30px; }
.itm-art-4 { font-size: 64px; right: 220px; bottom: 36px; color: rgba(34, 211, 238, .4) !important; text-shadow: 0 0 30px rgba(34, 211, 238, .6); }
.itm-promos { display: grid; grid-template-rows: 1fr 1fr; gap: 16px; }
.itm-promo { position: relative; overflow: hidden; border-radius: 20px; padding: 26px; display: flex; align-items: flex-end; color: var(--itm-strong) !important; min-height: 160px; background: var(--itm-surface); border: 1px solid var(--itm-border); transition: transform .15s ease, box-shadow .15s ease, border-color .15s; }
.itm-promo:hover { transform: translateY(-2px); border-color: var(--itm-accent); box-shadow: 0 0 0 1px var(--itm-accent), var(--itm-shadow-lg); }
.itm-promo span { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 4px; }
.itm-promo strong { font-size: 20px; font-weight: 800; }
.itm-promo small { color: var(--itm-muted); font-size: 14px; }
.itm-promo em { font-style: normal; font-weight: 700; font-size: 14px; color: var(--itm-link); margin-top: 6px; }
.itm-promo-icon { position: absolute; right: 18px; top: 18px; font-size: 76px; opacity: .9; }
.itm-promo-a .itm-promo-icon { color: #ec4899; filter: drop-shadow(0 0 16px rgba(236, 72, 153, .45)); }
.itm-promo-b .itm-promo-icon { color: #22d3ee; filter: drop-shadow(0 0 16px rgba(34, 211, 238, .45)); }
:root[data-bs-theme=light] .itm-promo-a { background: linear-gradient(135deg, #fff4ea, #ffe1c9); }
:root[data-bs-theme=light] .itm-promo-b { background: linear-gradient(135deg, #e8fbff, #c9f0fa); }
:root[data-bs-theme=light] .itm-promo-a .itm-promo-icon { color: #f59e58; filter: none; }
:root[data-bs-theme=light] .itm-promo-b .itm-promo-icon { color: #3fb8d4; filter: none; }

.itm-usp-strip { margin: 16px 0 8px; }
.itm-usp-strip ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; background: var(--itm-surface); border: 1px solid var(--itm-border); border-radius: var(--itm-radius); padding: 16px 20px; }
.itm-usp-strip li { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 14px; color: var(--itm-strong); }
.itm-usp-strip i { color: var(--itm-link); font-size: 20px; width: 24px; text-align: center; }

.itm-section { margin: 40px 0; }
.itm-section-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 16px; gap: 12px; }
.itm-section-head h2 { font-size: 24px; margin: 0; font-weight: 800; position: relative; padding-left: 14px; }
.itm-section-head h2::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 4px; border-radius: 2px; background: linear-gradient(180deg, #22d3ee, #8b5cf6); }
.itm-section-head a { font-weight: 600; font-size: 14px; white-space: nowrap; }

.itm-tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.itm-tile { background: var(--itm-surface); border-radius: var(--itm-radius); padding: 20px 14px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; border: 1px solid var(--itm-border); transition: border-color .15s, transform .15s, box-shadow .15s; }
.itm-tile:hover { border-color: var(--itm-accent); transform: translateY(-2px); box-shadow: 0 10px 26px var(--itm-glow); }
.itm-tile-icon { width: 56px; height: 56px; border-radius: 16px; background: var(--itm-accent-soft); color: var(--itm-link); display: flex; align-items: center; justify-content: center; font-size: 24px; margin-bottom: 6px; }
:root[data-bs-theme=dark] .itm-tile-icon { background: linear-gradient(135deg, #0d1118, #1e1b4b); box-shadow: inset 0 0 0 1px #2a3346; color: #22d3ee; }
.itm-tile-name { font-weight: 700; color: var(--itm-strong); font-size: 14px; line-height: 1.25; }
.itm-tile-count { font-size: 12px; color: var(--itm-muted); }

.itm-rail { position: relative; }
.itm-rail-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 5); gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 2px 2px 8px; }
.itm-rail-track::-webkit-scrollbar { display: none; }
.itm-rail-item { scroll-snap-align: start; }
.itm-rail-btn { position: absolute; top: 40%; z-index: 3; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--itm-border-strong); background: var(--itm-surface); box-shadow: var(--itm-shadow-lg); color: var(--itm-strong); }
.itm-rail-btn:hover { border-color: var(--itm-accent); color: var(--itm-link); }
.itm-rail-prev { left: -16px; }
.itm-rail-next { right: -16px; }
.itm-rail-btn[disabled] { opacity: 0; pointer-events: none; }

.itm-business { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; margin: 40px 0; padding: 36px 40px; border-radius: 20px; color: #fff; border: 1px solid var(--itm-border);
  background: radial-gradient(circle at 90% 10%, rgba(236, 72, 153, .32), transparent 35%), radial-gradient(circle at 10% 100%, rgba(34, 211, 238, .22), transparent 40%), linear-gradient(120deg, #07090e, #141a2e); }
.itm-business h2 { color: #fff; font-size: 26px; margin-bottom: 8px; }
.itm-business p { color: #c7d0de; margin: 0; max-width: 640px; }
.itm-business-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.itm-business .btn-light { --bs-btn-bg: #fff; --bs-btn-color: #0b1b33; --bs-btn-border-color: #fff; --bs-btn-hover-bg: #e8eefb; --bs-btn-hover-color: #0b1b33; }

.itm-brands { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.itm-brand { background: var(--itm-surface); border-radius: var(--itm-radius-sm); border: 1px solid var(--itm-border); padding: 18px 10px; text-align: center; font-weight: 700; color: var(--itm-strong) !important; font-size: 15px; letter-spacing: .01em; }
.itm-brand:hover { border-color: var(--itm-accent); color: var(--itm-link) !important; }

/* AI assistant teaser on the home page */
.itm-ai-teaser { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; padding: 22px 26px; border-radius: 20px; border: 1px solid var(--itm-border); background: var(--itm-surface); position: relative; overflow: hidden; }
.itm-ai-teaser::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: var(--itm-rgb); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.itm-ai-teaser-icon { width: 54px; height: 54px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: 24px; background: var(--itm-accent-soft); color: var(--itm-link); }
.itm-ai-teaser h2 { font-size: 20px; margin: 0 0 4px; }
.itm-ai-teaser p { margin: 0; color: var(--itm-muted); }

/* ---------- Product card ---------- */
.itm-card { background: var(--itm-surface); border-radius: var(--itm-radius); border: 1px solid var(--itm-border); height: 100%; display: flex; flex-direction: column; overflow: hidden; transition: box-shadow .15s, border-color .15s, transform .15s; margin: 0; position: relative; }
.itm-card:hover { border-color: var(--itm-accent); box-shadow: 0 12px 30px var(--itm-glow); }
.itm-card-image { display: block; aspect-ratio: 1 / 1; background: #fff; padding: 16px; border-bottom: 1px solid var(--itm-border); }
.itm-card-image img { width: 100%; height: 100%; object-fit: contain; }
.itm-card-body { padding: 14px 16px 6px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.itm-card-brand { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--itm-muted); }
.itm-card-title { font-size: 14px; font-weight: 600; line-height: 1.38; margin: 0; min-height: 2.76em; }
.itm-card-title a { color: var(--itm-strong); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.itm-card-title a:hover { color: var(--itm-link); text-decoration: underline; }
.itm-card-title a::after { content: ""; position: absolute; inset: 0 0 64px 0; } /* whole card image+title clickable */
.itm-card-model { font-size: 12px; color: var(--itm-muted); font-variant-numeric: tabular-nums; }
.itm-card-price { margin-top: auto; padding-top: 6px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.itm-card-price .price-new { font-size: 21px; font-weight: 800; color: var(--itm-strong); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.itm-card-price .price-old { font-size: 14px; color: var(--itm-muted); text-decoration: line-through; }
.itm-card-price .price-tax { width: 100%; font-size: 12px; color: var(--itm-muted); }
.itm-card-actions { display: flex; gap: 8px; padding: 10px 16px 16px; margin: 0; position: relative; z-index: 2; }
.itm-card-add { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; }
.itm-card-icon { border: 1px solid var(--itm-border-strong); color: var(--itm-muted); width: 42px; }
.itm-card-icon:hover { color: var(--itm-link); border-color: var(--itm-accent); }

/* Stock status: icon + words + colour (never colour alone) */
.itm-stock { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; width: fit-content; border: 1px solid transparent; }
.itm-stock.is-in { color: var(--itm-ok); background: var(--itm-ok-bg); border-color: var(--itm-ok-line); }
.itm-stock.is-due { color: var(--itm-due); background: var(--itm-due-bg); border-color: var(--itm-due-line); }
.itm-stock.is-out { color: var(--itm-out); background: var(--itm-out-bg); border-color: var(--itm-out-line); border-style: dashed; }

/* ---------- Category / search / listing pages ---------- */
.itm .breadcrumb { margin: 18px 0 14px; font-size: 13px; padding: 0; background: none; border: 0; }
.itm .breadcrumb > li.breadcrumb-item { padding: 0; text-shadow: none; }
.itm .breadcrumb > li.breadcrumb-item::after { display: none; }
.itm .breadcrumb > li.breadcrumb-item + li::before { content: "\203A"; padding: 0 10px; color: var(--itm-muted); float: none; }
.itm .breadcrumb-item a { color: var(--itm-muted); }
.itm .breadcrumb-item a:hover { color: var(--itm-link); text-decoration: underline; }
.itm .breadcrumb i { font-size: 13px; }
.itm #product-category h1, .itm #product-search h1, .itm #product-manufacturer h1, .itm #product-special h1 { font-size: 30px; font-weight: 800; margin-bottom: 16px; letter-spacing: -0.02em; }
.itm #product-category #content > h3, .itm #product-category #content > .itm-refine-h { font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.itm #product-category #content > .row ul, .itm #product-category #content > .row.row-cols-sm-2 ul { padding: 0; list-style: none; display: flex; flex-wrap: wrap; }
.itm #product-category #content > .itm-refine-h + .row > .col-sm-3, .itm #product-category #content > h3 + .row > .col-sm-3 { width: 100%; flex: 0 0 100%; max-width: 100%; }
.itm #product-category #content > .itm-refine-h + .row.row-cols-sm-2 > .col, .itm #product-category #content > h3 + .row.row-cols-sm-2 > .col { flex: 0 0 auto; width: auto; }
.itm #product-category #content > .itm-refine-h + .row ul, .itm #product-category #content > h3 + .row ul { margin-bottom: 0; }
.itm #compare-total { display: none !important; }
.itm [class*="col"]:has(> .mb-3 > #compare-total), .itm [class*="col"]:has(> #compare-total), .itm [class*="col"]:has(> .form-group > #compare-total) { display: none; }
.itm #product-category #content > .row:has(#input-sort), .itm #product-search #content > .row:has(#input-sort), .itm #product-manufacturer #content > .row:has(#input-sort) { align-items: center; justify-content: flex-end; background: var(--itm-surface); border: 1px solid var(--itm-border); border-radius: var(--itm-radius); padding: 12px 8px 0; margin: 8px 0 16px; }
.itm #content > .row:has(#input-sort) > .col-lg-3:has(#compare-total) { display: none; }
/* The mega menu, sub-category chips and brand filter replace the long category list column */
.itm #product-category #column-left, .itm #product-search #column-left, .itm #product-manufacturer #column-left { display: none !important; }
.itm #product-category #content > .row li a, .itm #product-category .row-cols-sm-2 li a { display: inline-block; background: var(--itm-surface); border: 1px solid var(--itm-border-strong); border-radius: 999px; padding: 6px 14px; margin: 0 6px 8px 0; font-weight: 600; font-size: 14px; color: var(--itm-strong); text-decoration: none; }
.itm #product-category #content > .row li a:hover { border-color: var(--itm-accent); color: var(--itm-link); }
.itm #product-category hr { display: none; }
.itm .itm-grid { margin-bottom: 20px; }
.itm-facets { background: var(--itm-surface); border: 1px solid var(--itm-border); border-radius: var(--itm-radius); padding: 12px 14px; margin: 4px 0 12px; display: flex; gap: 12px; align-items: center; }
.itm-facets-label { font-weight: 700; font-size: 13px; color: var(--itm-strong); white-space: nowrap; }
.itm-facets-list { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: thin; padding-bottom: 2px; }
.itm-facets .itm-chip { text-decoration: none; }
.itm #column-left .list-group-item, .itm #column-right .list-group-item { font-size: 14px; }
.itm .pagination { --bs-pagination-bg: var(--itm-surface); --bs-pagination-color: var(--itm-strong); --bs-pagination-border-color: var(--itm-border); --bs-pagination-hover-bg: var(--itm-surface-3); --bs-pagination-hover-color: var(--itm-strong); --bs-pagination-active-bg: var(--itm-accent); --bs-pagination-active-border-color: var(--itm-accent); --bs-pagination-active-color: var(--itm-on-accent); --bs-pagination-disabled-bg: var(--itm-surface); --bs-pagination-disabled-color: var(--itm-muted); }
.itm .pagination .page-link { border-radius: 8px; margin: 0 3px; }
.itm .product-list .itm-card { flex-direction: row; }
.itm .product-list .itm-card-image { width: 200px; flex: none; border-bottom: 0; border-right: 1px solid var(--itm-border); }
.itm .product-list .itm-card-actions { flex-direction: column; justify-content: center; width: 220px; }
.itm .product-list .itm-card-title a::after { display: none; }

/* ---------- Product page ---------- */
.itm #product-info #content { background: var(--itm-surface); border-radius: var(--itm-radius); padding: 28px; border: 1px solid var(--itm-border); margin-bottom: 30px; }
.itm #product-info .image img, .itm .itm-noimage img { border: 1px solid var(--itm-border); border-radius: var(--itm-radius); padding: 16px; background: #fff; }
.itm #product-info .image .img-thumbnail { background: #fff; border-color: var(--itm-border); }
.itm .itm-noimage img { width: 100%; }
.itm-brand-link { display: inline-block; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 13px; margin-bottom: 4px; }
.itm-product-title { font-size: 27px; font-weight: 800; line-height: 1.2; margin-bottom: 14px; letter-spacing: -0.02em; }
.itm-meta { font-size: 13px; color: var(--itm-muted); display: flex; flex-wrap: wrap; gap: 4px 18px; margin-bottom: 14px; }
.itm-copy { border: 1px solid var(--itm-border-strong); background: var(--itm-surface-2); color: var(--itm-strong); border-radius: 6px; font-size: 12px; font-weight: 700; padding: 1px 8px; margin-left: 4px; font-variant-numeric: tabular-nums; }
.itm-copy:hover { border-color: var(--itm-accent); }
.itm-copy i { margin-left: 5px; color: var(--itm-muted); }
.itm-copy.is-copied i::before { content: "\f00c"; color: var(--itm-ok); }
.itm #product-info .itm-stock { font-size: 14px; padding: 6px 12px; margin-bottom: 10px; }
.itm-eta { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--itm-text); margin-bottom: 14px; }
.itm-eta i { color: var(--itm-link); font-size: 18px; margin-top: 2px; }
.itm-eta strong { color: var(--itm-strong); }
.itm-eta small { display: block; color: var(--itm-muted); font-size: 12px; }
.itm-price-block { margin-bottom: 8px; }
.itm-price-block h2 { margin: 0; }
.itm-price-block .price-new { font-size: 36px; font-weight: 800; color: var(--itm-strong); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.itm-price-block .price-old { color: var(--itm-muted); text-decoration: line-through; }
.itm-price-ex { color: var(--itm-muted); font-size: 14px; }
.itm #product-info #input-quantity { max-width: 80px; text-align: center; font-weight: 700; }
.itm #product-info .input-group-text { font-weight: 600; }
.itm-btn-cart { flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 20px; font-size: 17px !important; }
.itm-trust { list-style: none; padding: 14px 16px; margin: 6px 0 0; background: var(--itm-surface-2); border: 1px solid var(--itm-border); border-radius: var(--itm-radius-sm); display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; font-size: 13px; font-weight: 500; color: var(--itm-strong); }
.itm-trust i { color: var(--itm-link); width: 18px; }
.itm-ask-btn { margin-top: 12px; width: 100%; display: flex; align-items: center; justify-content: center; gap: 10px; }
.itm #product-info .nav-tabs { margin-top: 18px; }
.itm #product-info .nav-tabs .nav-link { font-weight: 600; color: var(--itm-muted); border: 0; border-bottom: 3px solid transparent; }
.itm #product-info .nav-tabs .nav-link.active { color: var(--itm-strong); border-bottom-color: var(--itm-accent); background: none; }
.itm #product-info .tab-content { padding-top: 16px; }
.itm #product-info .btn-group .btn-light { border: 1px solid var(--itm-border-strong); }
.itm #product-info #tab-description { line-height: 1.7; }

/* Sticky buy bar (appears when the main add-to-basket button scrolls out of view) */
.itm-buybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035; background: var(--itm-header); border-top: 1px solid var(--itm-border); box-shadow: 0 -10px 30px rgba(0, 0, 0, .25); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transform: translateY(110%); transition: transform .2s ease; }
.itm-buybar.is-visible { transform: none; }
.itm-buybar .container { display: flex; align-items: center; gap: 14px; min-height: 68px; }
.itm-buybar img { width: 48px; height: 48px; object-fit: contain; background: #fff; border-radius: 8px; }
.itm-buybar-name { flex: 1; min-width: 0; font-weight: 700; color: var(--itm-strong); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.itm-buybar-name small { display: block; font-weight: 500; font-size: 12px; color: var(--itm-muted); }
.itm-buybar-price { font-weight: 800; font-size: 20px; color: var(--itm-strong); white-space: nowrap; }
body.itm-has-buybar .itm-chat-fab { bottom: 84px; }

/* Recently viewed */
.itm-recent[hidden] { display: none; }
.itm-recent-list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 1fr); gap: 12px; overflow-x: auto; scrollbar-width: thin; padding-bottom: 6px; }
.itm-recent-item { display: grid; grid-template-columns: 64px 1fr; gap: 12px; align-items: center; padding: 10px; background: var(--itm-surface); border: 1px solid var(--itm-border); border-radius: var(--itm-radius-sm); color: var(--itm-text) !important; }
.itm-recent-item:hover { border-color: var(--itm-accent); }
.itm-recent-item img { width: 64px; height: 64px; object-fit: contain; background: #fff; border-radius: 6px; }
.itm-recent-item span { font-size: 13px; font-weight: 600; color: var(--itm-strong); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.itm-recent-item strong { display: block; font-size: 14px; color: var(--itm-strong); margin-top: 2px; }

/* ---------- Generic pages (account, checkout, cart, info) ---------- */
.itm #checkout-cart #content, .itm #checkout-checkout #content, .itm #information-information #content, .itm #information-contact #content,
.itm [id^="account-"] #content, .itm #product-compare #content, .itm #information-sitemap #content, .itm #product-manufacturer #content, .itm #checkout-success #content, .itm #error-not-found #content { background: var(--itm-surface); border-radius: var(--itm-radius); padding: 28px; border: 1px solid var(--itm-border); margin-bottom: 30px; }
.itm #information-information #content { max-width: 900px; }
.itm #content h1 { font-size: 28px; font-weight: 800; margin-bottom: 18px; }
.itm #content .img-thumbnail { background: #fff; border-color: var(--itm-border); }
.itm #checkout-checkout .card, .itm #checkout-cart .card { background: var(--itm-surface-2); }

/* ---------- Footer ---------- */
.itm-usp-band { background: var(--itm-surface); border-top: 1px solid var(--itm-border); margin-top: 40px; }
.itm-usp-band ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding: 26px 0; }
.itm-usp-band li { display: flex; align-items: center; gap: 12px; font-weight: 600; color: var(--itm-strong); font-size: 14px; }
.itm-usp-band i { width: 44px; height: 44px; border-radius: 50%; background: var(--itm-accent-soft); color: var(--itm-link); display: flex; align-items: center; justify-content: center; font-size: 18px; flex: none; }
.itm-footer { background: var(--itm-chrome); color: var(--itm-chrome-text); padding-top: 48px; font-size: 14px; margin: 0; border: 0; position: relative; }
:root[data-bs-theme=dark] .itm-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--itm-rgb); }
.itm-footer h5, .itm-footer .itm-footer-h { color: var(--itm-chrome-strong); font-size: 15px; font-weight: 700; margin-bottom: 14px; letter-spacing: 0; }
.itm-footer a { color: var(--itm-chrome-text) !important; }
.itm-footer a:hover { color: var(--itm-chrome-strong) !important; text-decoration: underline !important; }
.itm-footer li { margin-bottom: 8px; }
.itm-footer-brand { font-size: 24px; font-weight: 800; color: var(--itm-chrome-strong); margin-bottom: 10px; }
.itm-footer-about { max-width: 360px; line-height: 1.6; }
.itm-footer-contact i { color: #22d3ee; margin-right: 6px; }
.itm-footer-pay { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 18px; color: var(--itm-chrome-muted); font-size: 13px; }
.itm-footer-pay i { font-size: 30px; color: var(--itm-chrome-strong); }
.itm-footer-bottom { border-top: 1px solid var(--itm-chrome-border); margin-top: 32px; padding: 18px 0; font-size: 13px; color: var(--itm-chrome-muted); }
.itm #cookie { background: var(--itm-chrome); color: var(--itm-chrome-text); }

/* ==========================================================================
   AI assistant
   ========================================================================== */
.itm-chat-fab { position: fixed; right: 20px; bottom: 20px; z-index: 1040; display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px 12px 14px; border: 0; border-radius: 999px; font-weight: 700; font-size: 15px; color: var(--itm-on-accent); background: var(--itm-accent); box-shadow: 0 10px 30px rgba(0, 0, 0, .35), 0 0 0 4px var(--itm-glow); transition: bottom .2s ease, transform .15s ease; }
.itm-chat-fab:hover { transform: translateY(-2px); background: var(--itm-accent-hover); }
.itm-chat-fab i { font-size: 20px; }
.itm-chat-fab[aria-expanded=true] { display: none; }
.itm-chat-panel { position: fixed; right: 20px; bottom: 20px; z-index: 1045; width: min(420px, calc(100vw - 24px)); height: min(640px, calc(100vh - 40px)); display: flex; flex-direction: column; background: var(--itm-surface); color: var(--itm-text); border: 1px solid var(--itm-border-strong); border-radius: 20px; box-shadow: var(--itm-shadow-lg); overflow: hidden; }
.itm-chat-panel[hidden] { display: none; }
.itm-chat-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--itm-border); background: var(--itm-surface-2); position: relative; }
.itm-chat-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--itm-rgb); }
.itm-chat-avatar { width: 38px; height: 38px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--itm-accent-soft); color: var(--itm-link); font-size: 18px; flex: none; }
.itm-chat-title { font-weight: 800; color: var(--itm-strong); font-size: 15px; margin: 0; line-height: 1.2; }
.itm-chat-sub { font-size: 12px; color: var(--itm-muted); }
.itm-chat-head button { margin-left: auto; border: 0; background: none; color: var(--itm-muted); width: 36px; height: 36px; border-radius: 10px; font-size: 18px; }
.itm-chat-head button + button { margin-left: 0; }
.itm-chat-head button:hover { background: var(--itm-surface-3); color: var(--itm-strong); }
.itm-chat-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; scroll-behavior: smooth; }
.itm-chat-msg { max-width: 88%; padding: 10px 14px; border-radius: 16px; font-size: 14px; line-height: 1.5; word-wrap: break-word; }
.itm-chat-msg p { margin: 0 0 8px; }
.itm-chat-msg p:last-child, .itm-chat-msg ul:last-child { margin-bottom: 0; }
.itm-chat-msg ul { padding-left: 18px; margin: 0 0 8px; }
.itm-chat-msg.is-bot { align-self: flex-start; background: var(--itm-surface-2); border: 1px solid var(--itm-border); color: var(--itm-text); border-bottom-left-radius: 6px; }
.itm-chat-msg.is-bot strong { color: var(--itm-strong); }
.itm-chat-msg.is-user { align-self: flex-end; background: var(--itm-accent); color: var(--itm-on-accent); border-bottom-right-radius: 6px; white-space: pre-wrap; }
.itm-chat-msg.is-error { border-color: var(--itm-danger); color: var(--itm-text); }
.itm-chat-msg.is-error::before { content: "\f071"; font: var(--fa-font-solid); color: var(--itm-danger); margin-right: 6px; }
.itm-chat-typing { display: inline-flex; gap: 4px; padding: 14px 16px; }
.itm-chat-typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--itm-muted); animation: itm-dot 1.1s infinite ease-in-out; }
.itm-chat-typing span:nth-child(2) { animation-delay: .15s; }
.itm-chat-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes itm-dot { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
.itm-chat-products { display: flex; flex-direction: column; gap: 8px; align-self: stretch; }
.itm-chat-product { display: grid; grid-template-columns: 56px 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; background: var(--itm-surface); border: 1px solid var(--itm-border-strong); border-radius: 12px; color: var(--itm-text) !important; text-decoration: none !important; }
.itm-chat-product:hover { border-color: var(--itm-accent); }
.itm-chat-product img { width: 56px; height: 56px; object-fit: contain; background: #fff; border-radius: 8px; }
.itm-chat-product-name { font-size: 13px; font-weight: 700; color: var(--itm-strong); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.3; }
.itm-chat-product .itm-stock { margin-top: 4px; font-size: 11px; padding: 1px 7px; }
.itm-chat-product-price { font-weight: 800; color: var(--itm-strong); white-space: nowrap; }
.itm-chat-suggest { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 10px; }
.itm-chat-suggest button { border: 1px solid var(--itm-border-strong); background: var(--itm-surface); color: var(--itm-strong); border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 600; }
.itm-chat-suggest button:hover { border-color: var(--itm-accent); color: var(--itm-link); }
.itm-chat-form { display: flex; gap: 8px; padding: 12px 12px 8px; border-top: 1px solid var(--itm-border); align-items: flex-end; }
.itm-chat-form textarea { flex: 1; resize: none; max-height: 120px; min-height: 44px; border-radius: 12px; padding: 10px 12px; font-size: 14px; }
.itm-chat-form button { width: 44px; height: 44px; border-radius: 12px; flex: none; padding: 0; }
.itm-chat-note { font-size: 11.5px; color: var(--itm-muted); padding: 0 14px 12px; margin: 0; line-height: 1.4; }
.itm-chat-note a { color: var(--itm-muted) !important; text-decoration: underline !important; }

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) {
  .itm-tiles { grid-template-columns: repeat(4, 1fr); }
  .itm-brands { grid-template-columns: repeat(4, 1fr); }
  .itm-rail-track { grid-auto-columns: calc((100% - 36px) / 4); }
  .itm-mega-links { columns: 2; }
}
@media (max-width: 991.98px) {
  .itm-header-row { flex-wrap: wrap; gap: 8px 10px; min-height: 64px; padding: 8px 0; }
  .itm-logo img { height: 36px; }
  .itm-search { order: 5; flex-basis: 100%; max-width: none; padding-bottom: 4px; }
  .itm-search-kbd { display: none; }
  .itm-action-label { display: none; }
  .itm-hero-grid { grid-template-columns: 1fr; }
  .itm-promos { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
  .itm-hero { padding: 32px; min-height: 280px; }
  .itm-hero-art { opacity: .5; }
  .itm-usp-strip ul, .itm-usp-band ul { grid-template-columns: repeat(2, 1fr); }
  .itm-rail-track { grid-auto-columns: calc((100% - 24px) / 3); }
  .itm-trust { grid-template-columns: 1fr; }
  .itm-ai-teaser { grid-template-columns: auto 1fr; }
  .itm-ai-teaser .btn { grid-column: 1 / -1; }
}
@media (max-width: 767.98px) {
  body.itm { font-size: 15px; }
  .itm-topbar-usps li { font-size: 12px; }
  .itm-tiles { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .itm-tile { padding: 14px 8px; }
  .itm-tile-icon { width: 44px; height: 44px; font-size: 19px; }
  .itm-tile-count { display: none; }
  .itm-brands { grid-template-columns: repeat(3, 1fr); }
  .itm-promos { grid-template-columns: 1fr; }
  .itm-promo { min-height: 120px; }
  .itm-hero h1 { font-size: 30px; }
  .itm-hero p { font-size: 15px; }
  .itm-hero-stats { gap: 18px; }
  .itm-rail-track { grid-auto-columns: calc((100% - 12px) / 2); }
  .itm-rail-btn { display: none; }
  .itm-section-head h2 { font-size: 20px; }
  .itm-business { padding: 26px; }
  .itm-card-body { padding: 10px 12px 4px; }
  .itm-card-actions { padding: 8px 12px 12px; }
  .itm-card-price .price-new { font-size: 18px; }
  .itm-card-add span, .itm-card-icon { display: none; }
  .itm #product-info #content { padding: 16px; }
  .itm-product-title { font-size: 22px; }
  .itm-minicart { width: calc(100vw - 24px); }
  .itm .product-list .itm-card { flex-direction: column; }
  .itm .product-list .itm-card-image { width: auto; border-right: 0; }
  .itm .product-list .itm-card-actions { width: auto; flex-direction: row; }
  .itm-buybar img, .itm-buybar-name small { display: none; }
  .itm-buybar-price { font-size: 17px; }
  .itm-chat-fab span { display: none; }
  .itm-chat-fab { padding: 14px; }
  .itm-chat-panel { right: 0; bottom: 0; width: 100vw; height: 100dvh; border-radius: 0; }
  .itm-mode-btn { width: 38px; }
}
@media (max-width: 479.98px) {
  .itm-usp-strip ul, .itm-usp-band ul { grid-template-columns: 1fr; }
  .itm-tiles { grid-template-columns: repeat(2, 1fr); }
}

/* OpenCart's base stylesheet pins the footer absolutely; let it flow instead */
.itm #container { position: relative; min-height: 100vh; margin-bottom: 0; padding-bottom: 0 !important; display: flex; flex-direction: column; }
.itm #content, .itm #column-left, .itm #column-right { padding-bottom: 24px; text-align: left; }
.itm #container > main { flex: 1; }
.itm footer.itm-footer { position: static; height: auto; }

/* ---------- Motion, contrast and forced-colours preferences ---------- */
@media (prefers-reduced-motion: no-preference) {
  :root[data-bs-theme=dark] .itm-search-btn { transition: background-position .4s ease; }
  :root[data-bs-theme=dark] .itm-search-btn:hover { background-position: 100% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .itm *, .itm *::before, .itm *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media (prefers-contrast: more) {
  :root[data-bs-theme=dark] { --itm-text: #eef2f8; --itm-muted: #c9d1de; --itm-border: #55627a; --itm-border-strong: #7a879d; }
  :root[data-bs-theme=light] { --itm-text: #111827; --itm-muted: #374151; --itm-border: #9aa4b5; --itm-border-strong: #6b7688; }
  .itm-hero h1 { background: none !important; color: #fff !important; }
}
@media (forced-colors: active) {
  .itm-stock, .itm-chip, .itm-card, .itm-chat-msg { border: 1px solid CanvasText; }
  .itm-chip.is-active { forced-color-adjust: none; background: Highlight; color: HighlightText !important; }
  .itm-hero h1 { color: CanvasText; background: none; }
}

/* Cookie bar */
.itm #cookie { border-top: 1px solid var(--itm-chrome-border); box-shadow: 0 -10px 30px rgba(0, 0, 0, .3); }
.itm #cookie p { color: var(--itm-chrome-text); }
.itm #cookie a { color: var(--itm-chrome-strong) !important; text-decoration: underline; font-weight: 700; }

/* OpenCart's base stylesheet gives the basket dropdown a light grey background; use the theme surface */
.itm #cart { margin-bottom: 0; }
.itm #cart .dropdown-menu, .itm #cart .itm-minicart { background: var(--itm-surface); }
.itm #cart .dropdown-menu li { min-width: 0; }
/* required-field asterisk: theme colour with enough contrast in both looks */
.itm div.required .col-form-label::before, .itm div.required .form-label::before { color: var(--itm-danger); }

/* Stripe Checkout payment step */
.itm-stripe-note { color: var(--itm-text); margin-bottom: 10px; }
.itm-stripe-note i { color: var(--itm-ok); margin-right: 6px; }
.itm-stripe-logos { display: flex; gap: 10px; font-size: 30px; color: var(--itm-strong); margin-bottom: 14px; }

/* Specifications table (from Icecat) in the product description */
.itm #tab-description h3 { font-size: 18px; margin: 22px 0 10px; }
.itm .itm-specs { max-width: 820px; font-size: 14px; border: 1px solid var(--itm-border); border-radius: var(--itm-radius-sm); overflow: hidden; }
.itm .itm-specs th { background: var(--itm-surface-3); color: var(--itm-strong); font-weight: 700; padding: 8px 12px; }
.itm .itm-specs td { padding: 7px 12px; border-color: var(--itm-border); }
.itm .itm-specs td:first-child { color: var(--itm-muted); width: 42%; }
.itm .itm-specs td:last-child { color: var(--itm-strong); font-weight: 500; }
.itm .itm-specs-source { font-size: 12px; color: var(--itm-muted); }

/* Icons load without blocking the page; reserve their space so nothing jumps */
.itm .fa-solid, .itm .fa-regular, .itm .fa-brands { display: inline-block; min-width: 1em; }

/* Brands A-Z page: comfortable tap targets and a tidy grid */
.itm #product-manufacturer #content h2 { font-size: 20px; margin: 22px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--itm-border); }
.itm #product-manufacturer #content .row a { display: inline-flex; align-items: center; min-height: 36px; padding: 4px 0; font-weight: 600; }
.itm #product-manufacturer #content > p a, .itm #product-manufacturer #content p > a[href^="#"] { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; min-height: 34px; margin: 2px; border: 1px solid var(--itm-border-strong); border-radius: 8px; font-weight: 700; text-decoration: none; }

/* ---------- Cookie consent banner (when Google tags are on) ---------- */
.itm-consent { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1080; background: var(--itm-chrome); color: var(--itm-chrome-text); border-top: 1px solid var(--itm-chrome-border); box-shadow: 0 -10px 30px rgba(0, 0, 0, .3); padding: 14px 0; }
.itm-consent[hidden] { display: none; }
.itm-consent .container { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; justify-content: space-between; }
.itm-consent p { margin: 0; flex: 1 1 420px; font-size: 14px; color: var(--itm-chrome-text); }
.itm-consent p strong { color: var(--itm-chrome-strong); margin-right: 6px; }
.itm-consent a { color: var(--itm-chrome-strong); text-decoration: underline; font-weight: 700; }
.itm-consent-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.itm-consent .btn { min-height: 44px; }
.itm-consent .btn-outline-primary { color: var(--itm-chrome-strong); border-color: var(--itm-chrome-muted); }
.itm-consent .btn-outline-primary:hover { background: var(--itm-chrome-2); color: var(--itm-chrome-strong); }
.itm-link-btn { background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; font: inherit; cursor: pointer; }
.itm-link-btn:hover { color: var(--itm-chrome-strong); }

/* ---------- Large item delivery note ---------- */
.itm-large i { color: var(--itm-due); }

/* ---------- Discontinued product page ---------- */
.itm-gone { display: flex; gap: 24px; align-items: flex-start; background: var(--itm-surface); border: 1px solid var(--itm-border); border-radius: var(--itm-radius); padding: 24px; margin-bottom: 28px; }
.itm-gone-img { flex: 0 0 auto; width: 160px; height: 160px; object-fit: contain; background: #fff; border-radius: var(--itm-radius-sm); padding: 8px; opacity: .8; }
.itm-gone h1 { font-size: 26px; margin: 4px 0 8px; color: var(--itm-strong); }
.itm-gone-flag { display: inline-flex; gap: 8px; align-items: center; margin: 0; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--itm-out); background: var(--itm-out-bg); border: 1px solid var(--itm-out-line); border-radius: 999px; padding: 4px 12px; }
.itm-gone-meta { color: var(--itm-muted); font-size: 14px; }
.itm-gone-search { display: flex; gap: 8px; max-width: 520px; margin-top: 14px; }
.itm-gone-search .btn { white-space: nowrap; }
.itm-gone-h2 { font-size: 20px; margin: 0 0 16px; color: var(--itm-strong); }
.itm-gone-h2 a, .itm-gone p a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 575.98px) {
  .itm-gone { flex-direction: column; padding: 18px; }
  .itm-gone-img { width: 120px; height: 120px; }
}