/* ==========================================================================
   emoto-net.css — legacy-faithful skin for the MVC 5 port.
   Loaded AFTER site.css so it wins; site.css stays the untouched copy of the
   production stylesheet.  Everything here mirrors www.e-moto.gr as captured
   in the reference screenshots (home / category / brand / model).
   ========================================================================== */

:root{
  --em-red:#e01f26;
  --em-red-dark:#b8181e;
  --em-ink:#1a1d21;
  --em-nav:#23272e;
  --em-strip:#2f343d;
  --em-top:#111417;
  --em-muted:#808690;
  --em-line:#e6e6e8;
  --em-page:#efefef;
  --em-card:#fff;
  --em-yellow:#ffd23d;
  --em-yellow-2:#ffc60a;
  --em-cream:#faf7f0;
  --em-radius:14px;
  --em-shadow:0 1px 3px rgba(16,18,22,.07),0 1px 2px rgba(16,18,22,.04);
}

body{background:var(--em-page);color:var(--em-ink);font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;}
.content-shell{padding:0 0 40px;}
a{text-decoration:none;}

/* ---------- top utility bar ---------------------------------------------- */
.legacy-topbar{background:var(--em-top);color:#e9e9ec;font-size:12.5px;}
.legacy-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px;padding-top:5px;padding-bottom:5px;}
.legacy-topbar-copy{opacity:.85;}
.legacy-topbar-links{display:flex;align-items:center;gap:8px;}
.legacy-topbar-pill{display:inline-flex;align-items:center;gap:6px;background:#22262c;border-radius:999px;padding:4px 11px;color:#e9e9ec;font-size:12px;line-height:1.5;white-space:nowrap;}
.legacy-topbar-pill:hover{background:#2c3138;color:#fff;}
.legacy-topbar-pill-icon{font-size:11px;}
.legacy-topbar-rating .legacy-topbar-pill-icon{color:var(--em-yellow);}
.legacy-lang-switch{display:flex;gap:4px;margin-left:4px;}
.legacy-lang-switch a{display:inline-block;padding:4px 10px;border-radius:6px;background:#22262c;color:#c9cbd0;font-size:11.5px;font-weight:700;letter-spacing:.03em;}
.legacy-lang-switch a.is-active{background:#4a5059;color:#fff;}

/* ---------- header: logo + brand strip + tools ----------------------------
   The live header is <header class="black"> — solid black behind the logo,
   brand strip and search, with #30323a on the nav. The logo PNG is white+red
   artwork, so a white header renders only the red "moto". Keep it black. */
/* site.css pins .legacy-header with position:sticky — the legacy header scrolls
   away with the page. Use `relative` (NOT `static`): it still scrolls away, but
   keeps a stacking context so the live-search dropdown and the mega-menus paint
   over the page instead of under the slider / price-slider thumbs / toggles. */
.legacy-header{background:#000;color:#fff;position:relative;top:auto;z-index:900;}
.legacy-brand-row{display:flex;align-items:center;gap:20px;padding-top:12px;padding-bottom:10px;}
/* natural size, exactly as the live site renders it (live caps at max-height:70px) */
.legacy-site-logo{flex:0 0 auto;}
.legacy-site-logo img{height:55px;width:193px;max-height:70px;display:block;}
.legacy-brand-strip{display:flex;align-items:center;justify-content:space-between;gap:14px;flex:1 1 auto;flex-wrap:nowrap;min-width:0;}
.legacy-brand-strip a{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;opacity:.92;transition:opacity .15s,transform .15s;}
.legacy-brand-strip a:hover{opacity:1;transform:translateY(-1px);}
/* Sizes come from the inline width/height (real aspect ratio per logo) — do NOT
   set width or height here or the presentational attributes get overridden. */
.legacy-brand-strip img{display:block;max-width:100%;object-fit:contain;}
.legacy-header-tools{display:flex;align-items:center;gap:10px;flex:0 0 auto;}
.legacy-tool-box{display:inline-flex;align-items:center;gap:10px;border:1.5px solid #4a4f57;border-radius:12px;padding:9px 16px 9px 10px;color:#fff;background:transparent;}
.legacy-tool-box:hover{background:#1a1d21;border-color:#6d737c;color:#fff;}
.legacy-tool-icon-wrap{width:34px;height:34px;border-radius:50%;background:#fff;color:#111417;display:inline-flex;align-items:center;justify-content:center;font-size:14px;}
.legacy-tool-copy{display:flex;flex-direction:column;line-height:1.15;}
.legacy-tool-copy strong{font-size:14.5px;font-weight:700;color:#fff;}
.legacy-tool-copy small{font-size:11.5px;color:#9aa0a8;}

/* ---------- big search + live suggestions --------------------------------- */
.legacy-search-row{padding-bottom:14px;}
.legacy-search-shell{position:relative;display:flex;align-items:stretch;border:1px solid #2a2e34;border-radius:12px;overflow:visible;background:#fff;}
.legacy-search-shell input[type=search]{border-radius:12px 0 0 12px;}
.legacy-search-button{border-radius:0 12px 12px 0;}
.legacy-search-shell input[type=search]{flex:1 1 auto;border:0;outline:0;padding:15px 18px;font-size:15px;background:transparent;}
.legacy-search-shell input[type=search]::placeholder{color:#a3a7ae;}
.legacy-search-button{flex:0 0 auto;width:56px;border:0;background:var(--em-red);color:#fff;font-size:17px;cursor:pointer;}
.legacy-search-button:hover{background:var(--em-red-dark);}
.live-suggest{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:120;background:#fff;border:1px solid var(--em-line);border-radius:12px;box-shadow:0 12px 34px rgba(16,18,22,.16);overflow:hidden;display:none;max-height:70vh;overflow-y:auto;}
.live-suggest.open{display:block;}
.live-suggest-group{padding:8px 0;}
.live-suggest-group+.live-suggest-group{border-top:1px solid var(--em-line);}
.live-suggest-head{padding:6px 16px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--em-muted);}
.live-suggest-item{display:flex;align-items:center;gap:11px;padding:8px 16px;color:var(--em-ink);font-size:14px;}
.live-suggest-item:hover,.live-suggest-item.active{background:#f5f5f7;color:var(--em-ink);}
.live-suggest-item img{width:40px;height:40px;object-fit:contain;flex:0 0 auto;background:#fff;}
.live-suggest-item i{width:20px;text-align:center;color:var(--em-muted);}
.live-suggest-item .ls-main{flex:1 1 auto;min-width:0;}
.live-suggest-item .ls-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.live-suggest-item .ls-sub{display:block;font-size:11.5px;color:var(--em-muted);}
.live-suggest-item .ls-price{font-weight:800;font-size:13.5px;white-space:nowrap;}
.live-suggest-empty{padding:16px;color:var(--em-muted);font-size:14px;text-align:center;}

/* ---------- nav bar + mega menus ------------------------------------------ */
.legacy-nav-bar{display:flex;align-items:stretch;background:#30323a;border-radius:12px 12px 0 0;position:relative;}
.legacy-categories-nav{position:relative;flex:0 0 auto;}
.legacy-categories-toggle{display:flex;align-items:center;justify-content:space-between;gap:26px;min-width:196px;height:100%;padding:14px 16px;border:0;background:var(--em-red);color:#fff;font-weight:700;font-size:14.5px;border-radius:12px 0 0 0;cursor:pointer;}
.legacy-categories-toggle:hover{background:var(--em-red-dark);}
.legacy-main-nav{display:flex;align-items:center;gap:2px;padding:0 8px;flex:1 1 auto;}
.legacy-nav-item{display:inline-flex;align-items:center;gap:6px;padding:14px 13px;color:#f0f0f2;font-size:14px;font-weight:600;background:transparent;border:0;cursor:pointer;white-space:nowrap;}
.legacy-nav-item:hover,.legacy-nav-item.is-open{color:var(--em-yellow);}
.legacy-nav-item .caret{font-size:10px;opacity:.8;}
.legacy-nav-item.is-accent{color:var(--em-yellow);}
.legacy-nav-item .gift-dot{color:var(--em-red);font-size:10px;vertical-align:super;}

/* generic full-width drop panel used by Κατασκευαστές / Μοντέλα / My Parking */
.legacy-drop{position:absolute;top:100%;left:0;right:0;z-index:110;background:#fff;border-radius:0 0 14px 14px;box-shadow:0 22px 44px rgba(16,18,22,.18);padding:22px 26px 26px;display:none;max-height:76vh;overflow-y:auto;}
.legacy-drop.open{display:block;}
.legacy-drop-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--em-line);margin-bottom:16px;}
/* explicit colour: the drop inherits the dark nav bar's white text, so the
   heading was white-on-white inside the panel */
.legacy-drop-head h3{margin:0;font-size:20px;font-weight:800;color:var(--em-ink);}
.legacy-drop-head a{color:var(--em-red);font-weight:700;font-size:13.5px;}
.legacy-drop-sub{font-size:13px;font-weight:800;color:var(--em-ink);margin:0 0 12px;}
.legacy-model-tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:22px;}
.legacy-model-tile{display:flex;flex-direction:column;gap:6px;color:var(--em-ink);text-align:center;}
.legacy-model-tile img{width:100%;height:96px;object-fit:contain;background:#f5f5f7;border-radius:8px;}
.legacy-model-tile b{font-size:11.5px;font-weight:800;letter-spacing:.04em;}
.legacy-model-tile span{font-size:12px;color:#3d434b;line-height:1.3;}
.legacy-model-tile:hover b,.legacy-model-tile:hover span{color:var(--em-red);}
.legacy-drop-cols{display:grid;grid-template-columns:repeat(6,1fr);gap:18px 22px;}
.legacy-drop-col h4{font-size:12.5px;font-weight:800;letter-spacing:.05em;margin:0 0 8px;padding-bottom:7px;border-bottom:1px solid var(--em-line);}
.legacy-drop-col ul{list-style:none;margin:0;padding:0;}
.legacy-drop-col li{margin-bottom:5px;}
.legacy-drop-col a{font-size:12.5px;color:#3d434b;line-height:1.35;}
.legacy-drop-col a:hover{color:var(--em-red);}
.legacy-brand-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px;}
.legacy-brand-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:74px;
  border:1px solid var(--em-line);border-radius:10px;background:#fff;padding:9px 8px;font-size:12.5px;font-weight:700;
  color:#3d434b;text-align:center;}
.legacy-brand-cell img{max-width:100%;max-height:30px;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply;}
.legacy-brand-cell span{font-size:11px;letter-spacing:.03em;line-height:1.2;overflow:hidden;text-overflow:ellipsis;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.legacy-brand-cell:hover{border-color:var(--em-red);color:var(--em-red);}

/* /brands directory — same idea, logo above the name */
.landing-card-logo img{max-width:100%;max-height:34px;width:auto;height:auto;object-fit:contain;
  margin-bottom:6px;mix-blend-mode:multiply;}

/* categories mega (the red button) */
.legacy-categories-mega{position:absolute;top:100%;left:0;z-index:115;display:none;background:#fff;border-radius:0 0 14px 14px;box-shadow:0 22px 44px rgba(16,18,22,.18);min-width:1040px;}
.legacy-categories-nav.legacy-open .legacy-categories-mega{display:flex;}
.legacy-category-roots{flex:0 0 236px;background:#fff;border-right:1px solid var(--em-line);padding:10px 0;border-radius:0 0 0 14px;}
.legacy-root-link{display:flex;align-items:center;justify-content:space-between;width:100%;gap:10px;padding:11px 18px;border:0;background:transparent;font-size:14px;font-weight:600;color:var(--em-ink);cursor:pointer;text-align:left;}
.legacy-root-link:hover,.legacy-root-link.active{background:#f5f5f7;color:var(--em-red);}
.legacy-arrow{font-style:normal;opacity:.5;}
.legacy-category-panels{flex:1 1 auto;padding:18px 22px;max-height:70vh;overflow-y:auto;}
.legacy-root-panel{display:none;grid-template-columns:repeat(4,1fr);gap:16px 22px;}
.legacy-root-panel.active{display:grid;}
.legacy-category-group h4{font-size:12.5px;font-weight:800;margin:0 0 7px;padding-bottom:6px;border-bottom:1px solid var(--em-line);}
.legacy-category-group h4 a{color:var(--em-ink);}
.legacy-category-group ul{list-style:none;margin:0;padding:0;}
.legacy-category-group li{margin-bottom:4px;}
.legacy-category-group a{font-size:12.5px;color:#3d434b;}
.legacy-category-group a:hover{color:var(--em-red);}

/* ---------- breadcrumbs ---------------------------------------------------- */
.catalog-page-breadcrumbs{padding:14px 0 12px;}
.catalog-breadcrumb-list{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0;padding:0;font-size:14.5px;}
.catalog-breadcrumb-item+.catalog-breadcrumb-item::before{content:"/";margin-right:8px;color:#b6b9be;}
.catalog-breadcrumb-item a{color:#6c727b;}
.catalog-breadcrumb-item a:hover{color:var(--em-red);}
.catalog-breadcrumb-item:last-child{color:var(--em-ink);font-weight:700;}

/* ---------- generic white panel ------------------------------------------- */
.section-panel{background:var(--em-card);border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:24px 26px;margin-bottom:18px;}

/* ---------- catalog hero + filter bar -------------------------------------- */
.catalog-hero-panel{padding:26px 28px 24px;}
/* site.css ships .catalog-seo-heading{text-align:right} and .catalog-page-intro
   {justify-self:end;text-align:right} from an older layout — neutralise them,
   the legacy catalog hero is left-aligned. */
.catalog-page-title,.catalog-seo-heading{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:25px;font-weight:700;line-height:1.18;margin:0;color:var(--em-ink);text-align:left;justify-self:start;max-width:none;}
.catalog-page-count{top:-.3em;margin-left:8px;font-size:13px;font-weight:400;color:var(--em-muted);}
.catalog-page-count-number{font-weight:800;color:var(--em-ink);font-size:14px;}
.catalog-page-count-label{font-size:11.5px;}
/* The count <sup> is raised inside the H1's line box, so ~23px of that box is
   already empty under it — a 14px margin on top of that read as a hole. */
.catalog-page-intro{margin:2px 0 0;color:#5f656e;font-size:14px;line-height:1.6;max-width:none;text-align:left;justify-self:start;}
.catalog-hero-panel{padding:22px 28px 20px;}
.catalog-hero-extra{margin-top:16px;}
.catalog-manu-details>summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;}
.catalog-manu-details>summary::-webkit-details-marker{display:none;}
.catalog-manu-details .prose{margin-top:14px;padding-top:14px;border-top:1px solid var(--em-line);}
.catalog-hero-btn{display:inline-flex;align-items:center;gap:8px;border:1.5px solid #23272e;border-radius:9px;padding:8px 14px;font-size:13px;font-weight:700;color:var(--em-ink);background:#fff;}
.catalog-hero-btn:hover{background:#23272e;color:#fff;}

/* .catalog-shell is a grid with its own row gap, and every child also carried a
   margin-bottom — the two stacked and every vertical gap on a catalog page was
   ~34px of nothing. One source of spacing only. */
.catalog-shell{gap:12px;}
.catalog-shell>*{margin-bottom:0;}
/* a little air above the trail, and readable at a glance */
.catalog-breadcrumbs,.catalog-page-breadcrumbs{padding-top:14px;padding-bottom:4px;}

.catalog-filter-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--em-card);border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:14px 20px;margin-bottom:0;}
.catalog-quick-toggle-form{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0;flex:1 1 auto;}
.catalog-toggle-row{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--em-line);border-radius:11px;padding:11px 14px;margin:0;cursor:pointer;background:#fff;min-width:158px;}
.catalog-toggle-copy strong{font-size:14px;font-weight:600;color:var(--em-ink);}
.catalog-toggle-switch{position:relative;display:inline-block;width:42px;height:23px;flex:0 0 auto;}
.catalog-toggle-switch input{position:absolute;opacity:0;width:0;height:0;}
.catalog-toggle-switch em{position:absolute;inset:0;background:#d6d8dc;border-radius:999px;transition:background .18s;}
.catalog-toggle-switch em::after{content:"";position:absolute;top:2.5px;left:3px;width:18px;height:18px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s;}
.catalog-toggle-switch input:checked+em{background:var(--em-red);}
.catalog-toggle-switch input:checked+em::after{transform:translateX(18px);}

.catalog-price-filter{display:flex;align-items:center;gap:14px;border:1px solid var(--em-line);border-radius:11px;padding:11px 16px;flex:1 1 300px;min-width:280px;background:#fff;}
.catalog-price-min,.catalog-price-max{font-size:11.5px;color:var(--em-muted);white-space:nowrap;font-weight:600;}
.catalog-price-slider-shell{position:relative;flex:1 1 auto;height:20px;display:flex;align-items:center;}
.catalog-price-slider-track{position:absolute;left:0;right:0;height:4px;background:#e2e4e8;border-radius:3px;}
.catalog-price-slider-active{position:absolute;height:4px;background:var(--em-red);border-radius:3px;}
.catalog-price-slider-shell input[type=range]{position:absolute;left:0;width:100%;margin:0;background:transparent;pointer-events:none;-webkit-appearance:none;appearance:none;height:20px;}
.catalog-price-slider-shell input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:15px;height:15px;border-radius:50%;background:#1a1d21;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer;}
.catalog-price-slider-shell input[type=range]::-moz-range-thumb{pointer-events:auto;width:13px;height:13px;border-radius:50%;background:#1a1d21;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer;}
.catalog-price-slider-shell input[type=range]::-moz-range-track{background:transparent;}

/* no label any more — the select sits on its own, pushed to the right edge */
.catalog-sort-form{display:flex;align-items:center;margin:0 0 0 auto;flex:0 0 auto;}
.catalog-sort-form select{border:1px solid var(--em-line);border-radius:9px;padding:9px 30px 9px 12px;font-size:14px;background:#fff;min-width:150px;}

/* ---------- catalog layout -------------------------------------------------- */
.catalog-layout{display:grid;grid-template-columns:262px minmax(0,1fr);gap:18px;align-items:start;}
/* With lazy load the results column keeps growing, so a static sidebar scrolls
   away and the filters become unreachable. Stick it to the viewport and let it
   scroll on its own when the facet list is taller than the screen. */
@media (min-width:992px){
  .catalog-layout>.catalog-sidebar-card{position:sticky;top:12px;max-height:calc(100vh - 24px);
    overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;}
  .catalog-layout>.catalog-sidebar-card::-webkit-scrollbar{width:8px;}
  .catalog-layout>.catalog-sidebar-card::-webkit-scrollbar-thumb{background:#d9dade;border-radius:8px;}
}
.catalog-layout-no-sidebar{grid-template-columns:minmax(0,1fr);}
.catalog-results-panel{padding:0;background:transparent;box-shadow:none;}
.catalog-results-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}

/* ---------- sidebar facet cards -------------------------------------------- */
.catalog-filters-stack{display:flex;flex-direction:column;gap:14px;}
.catalog-filter-block{background:var(--em-card);border-radius:var(--em-radius);box-shadow:var(--em-shadow);overflow:hidden;}
.catalog-filter-block>summary{display:flex;align-items:center;gap:8px;padding:15px 16px;cursor:pointer;list-style:none;}
.catalog-filter-block>summary::-webkit-details-marker{display:none;}
.catalog-filter-title{flex:1 1 auto;font-size:14px;font-weight:600;color:var(--em-ink);}
.catalog-filter-meta{font-size:12px;color:var(--em-muted);font-weight:600;}
/* ONE toggle marker per <details>, driven by that element's own open state.
   site.css supplies `.catalog-filter-block summary::after` as a *descendant*
   selector, so it also painted the nested group pills and flipped them to "−"
   whenever the OUTER block was open. These rules re-scope it per element; the
   selectors are weighted to outrank site.css's `[open] summary::after` (0,2,2). */
.catalog-filter-block > summary::after{content:"+";}
.catalog-filter-block[open] > summary::after{content:"\2212";}

.catalog-filter-block .catalog-cat-group > summary::after,
.catalog-filter-block .catalog-category-tree-group > summary::after{
  content:"+";width:20px;height:20px;border-radius:50%;border:0;
  background:rgba(255,255,255,.22);color:#fff;font-size:12px;font-weight:800;
  display:grid;place-items:center;flex:0 0 auto;}
.catalog-filter-block .catalog-cat-group[open] > summary::after,
.catalog-filter-block .catalog-category-tree-group[open] > summary::after{content:"\2212";}
.catalog-filter-content{padding:0 16px 14px;}
/* .catalog-filter-content is a grid, so its children default to min-width:auto
   and refuse to shrink below their min-content width. With the nowrap group
   title in site.css, a long name ("Εργαλεία μοτοσυκλετών") pushed the whole
   tree past the sidebar. Let the box shrink and let the title wrap instead of
   being clipped. */
.catalog-filter-content>*{min-width:0;}
.catalog-category-tree{min-width:0;}
.catalog-filter-block .catalog-category-tree-group>summary strong{white-space:normal;overflow:visible;
  overflow-wrap:anywhere;line-height:1.22;}
.catalog-facet-search-field input{width:100%;border:1px solid var(--em-line);border-radius:9px;padding:9px 12px;font-size:13px;outline:0;}
.catalog-facet-search-field input:focus{border-color:#c9ccd2;}
.catalog-filter-options{margin-top:10px;max-height:322px;overflow-y:auto;scrollbar-width:thin;}
.catalog-filter-options::-webkit-scrollbar{width:8px;}
.catalog-filter-options::-webkit-scrollbar-thumb{background:#c9ccd2;border-radius:4px;}
.catalog-filter-option{display:flex;align-items:center;gap:10px;padding:8px 2px;border-bottom:1px solid #f1f1f3;color:#3d434b;font-size:13px;line-height:1.3;}
.catalog-filter-option:last-child{border-bottom:0;}
.catalog-filter-option:hover{color:var(--em-red);}
.catalog-filter-option-main{display:flex;align-items:flex-start;gap:10px;flex:1 1 auto;min-width:0;}
.catalog-filter-option-check{width:16px;height:16px;border:1.5px solid #c9ccd2;border-radius:4px;flex:0 0 auto;position:relative;margin-top:1px;}
.catalog-filter-option.active .catalog-filter-option-check{background:var(--em-red);border-color:var(--em-red);}
.catalog-filter-option.active .catalog-filter-option-check::after{content:"";position:absolute;left:4.5px;top:1px;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);}
/* long Greek category names must wrap, not run past the card edge —
   site.css only sets overflow-wrap on the model facet, not on these */
.catalog-filter-option-label{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;white-space:normal;}
.catalog-filter-option-count{font-size:12px;color:var(--em-muted);flex:0 0 auto;}
.catalog-filter-option.is-hidden{display:none;}

/* red root pills (category accordion on the model page) */
.catalog-cat-accordion{display:flex;flex-direction:column;gap:9px;margin-top:10px;}
.catalog-cat-group>summary{display:flex;align-items:center;gap:9px;background:var(--em-red);color:#fff;border-radius:9px;padding:10px 12px;cursor:pointer;list-style:none;font-size:12.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;}
.catalog-cat-group>summary::-webkit-details-marker{display:none;}
.catalog-cat-group>summary .cg-caret{font-size:10px;}
.catalog-cat-group>summary .cg-name{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;white-space:normal;line-height:1.25;}
.catalog-cat-group .catalog-filter-options{padding:2px 4px 0;}

/* model card in the sidebar */
.catalog-model-card{background:var(--em-cream);border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:14px;}
/* photo fills the whole frame, matching the card's rounded corners */
.catalog-model-card-media{position:relative;background:#fff;border-radius:10px;overflow:hidden;line-height:0;}
.catalog-model-card-media img{width:100%;height:150px;object-fit:cover;display:block;border-radius:10px;}
/* Χαρακτηριστικά μοντέλου — sits under the photo, full width */
.catalog-model-specs-btn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:12px;background:var(--em-ink);color:#fff;border-radius:999px;padding:9px 15px;font-size:11.5px;font-weight:600;white-space:nowrap;border:0;cursor:pointer;}
.catalog-model-specs-btn:hover{background:#000;color:#fff;}

.model-specs-modal{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:24px;}
.model-specs-modal[hidden]{display:none;}
.model-specs-backdrop{position:absolute;inset:0;background:rgba(16,18,22,.55);}
.model-specs-dialog{position:relative;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.3);width:min(760px,100%);max-height:86vh;overflow:auto;}
.model-specs-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px 16px;border-bottom:1px solid var(--em-line);position:sticky;top:0;background:#fff;}
.model-specs-head h3{margin:0;font-family:"Roboto Condensed",Manrope,sans-serif;font-size:20px;font-weight:700;}
.model-specs-x{border:0;background:transparent;font-size:26px;line-height:1;color:#6c727b;cursor:pointer;padding:0 4px;}
.model-specs-x:hover{color:var(--em-ink);}
.model-specs-table{width:100%;border-collapse:collapse;font-size:14px;}
.model-specs-table th{text-align:left;font-weight:500;color:#3d434b;padding:13px 24px;width:44%;background:#faf8f3;border-bottom:1px solid #f0ece3;}
.model-specs-table td{padding:13px 24px;font-weight:700;color:var(--em-ink);border-bottom:1px solid #f0ece3;}
.model-specs-table tr:last-child th,.model-specs-table tr:last-child td{border-bottom:0;}
.spec-buy{display:inline-flex;align-items:center;gap:8px;color:var(--em-red);font-weight:700;}
.spec-buy:hover{color:var(--em-red-dark);text-decoration:underline;}
.spec-buy i{font-size:12px;}
@media (max-width:575px){
  .model-specs-modal{padding:12px;}
  .model-specs-table th,.model-specs-table td{padding:10px 14px;font-size:13px;}
  .model-specs-table th{width:50%;}
}
.catalog-model-name{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:21px;font-weight:700;line-height:1.2;margin:14px 0 6px;color:var(--em-ink);}
.catalog-model-meta{font-size:13px;color:var(--em-muted);margin:0 0 12px;}
.catalog-model-link{font-size:13px;color:var(--em-ink);border-top:1px solid #e9e4d8;display:block;padding-top:11px;}
.catalog-model-link:hover{color:var(--em-red);}

/* ---------- product card (catalog style) ------------------------------------ */
.catalog-product-card{display:flex;flex-direction:column;background:#fff;border-radius:10px;box-shadow:var(--em-shadow);overflow:hidden;transition:box-shadow .16s,transform .16s;}
.catalog-product-card:hover{box-shadow:0 8px 22px rgba(16,18,22,.13);transform:translateY(-2px);}
.pc-top{display:flex;align-items:stretch;background:var(--em-strip);min-height:30px;}
.pc-brand{flex:1 1 auto;display:flex;align-items:center;padding:6px 11px;color:#fff;font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pc-off{flex:0 0 auto;display:flex;align-items:center;padding:6px 11px;background:var(--em-red);color:#fff;font-size:12px;font-weight:800;}
.pc-media{position:relative;display:block;padding:14px 14px 6px;background:#fff;}
.pc-media img{width:100%;height:132px;object-fit:contain;display:block;}
.pc-stock{position:absolute;right:12px;bottom:4px;width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.pc-stock::after{content:"";width:6px;height:6px;border-radius:50%;}
.pc-stock.in{background:#dff3e4;}
.pc-stock.in::after{background:#1f7a3f;}
/* orderable but not on the shelf (1-3 / 4-10 days, κατόπιν παραγγελίας) */
.pc-stock.soon{background:#fdf3df;}
.pc-stock.soon::after{background:#c9962a;}
.pc-stock.out{background:#fde3e6;}
.pc-stock.out::after{background:#c62435;}
.pc-title{display:block;padding:8px 12px 0;text-align:center;font-size:13.5px;line-height:1.35;color:var(--em-ink);min-height:56px;overflow:hidden;}
.pc-title:hover{color:var(--em-red);}
.pc-price{display:flex;align-items:baseline;justify-content:center;gap:7px;padding:6px 12px 10px;}
.pc-now{font-size:17px;font-weight:800;color:var(--em-ink);}
.pc-was{font-size:12.5px;color:#a3a7ae;text-decoration:line-through;}
.pc-actions{display:flex;gap:7px;padding:0 10px 12px;}
.pc-actions form{margin:0;flex:1 1 auto;}
.pc-add,.pc-buy{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;border-radius:8px;padding:8px 6px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.pc-add{background:var(--em-red);border:1px solid var(--em-red);color:#fff;}
.pc-add:hover{background:var(--em-red-dark);border-color:var(--em-red-dark);color:#fff;}
.pc-buy{background:#fff;border:1px solid #d3d5da;color:var(--em-ink);flex:0 0 auto;padding-left:12px;padding-right:12px;}
.pc-buy:hover{border-color:var(--em-ink);background:#f6f6f7;color:var(--em-ink);}
.catalog-product-card.is-out .pc-add{background:#f1f1f3;border-color:#e4e4e7;color:#b0b3b9;pointer-events:none;}
.catalog-product-card.is-out .pc-buy{color:#b0b3b9;border-color:#e4e4e7;pointer-events:none;}

/* active filter pills */
.catalog-active-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.catalog-active-pill{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--em-line);border-radius:999px;padding:6px 12px;font-size:12.5px;color:var(--em-ink);box-shadow:var(--em-shadow);}
.catalog-active-pill:hover{border-color:var(--em-red);color:var(--em-red);}
.catalog-filter-reset-link{display:inline-flex;align-items:center;padding:6px 13px;border-radius:999px;background:var(--em-ink);color:#fff;font-size:12.5px;font-weight:700;}
.catalog-filter-reset-link:hover{background:#000;color:#fff;}

.catalog-pagination{display:flex;gap:7px;justify-content:center;margin-top:24px;flex-wrap:wrap;}
.catalog-pagination a{min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;border:1px solid var(--em-line);background:#fff;color:var(--em-ink);font-size:13.5px;font-weight:600;}
.catalog-pagination a:hover{border-color:var(--em-ink);}
.catalog-pagination a.is-current{background:var(--em-red);border-color:var(--em-red);color:#fff;}

.empty-card{background:#fff;border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:40px;text-align:center;}
.empty-card h3{font-size:19px;font-weight:800;margin:0 0 6px;}
.muted{color:var(--em-muted);}

/* ---------- HOME ------------------------------------------------------------ */
.legacy-home-hero-shell{display:grid;grid-template-columns:236px minmax(0,1fr);gap:0;background:#fff;border-radius:0 0 var(--em-radius) var(--em-radius);box-shadow:var(--em-shadow);overflow:hidden;margin-bottom:18px;position:relative;}
.legacy-home-rail{border-right:1px solid var(--em-line);padding:8px 0;}
.legacy-home-rail-links{display:flex;flex-direction:column;}
.legacy-home-root-link{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 18px;border:0;background:transparent;font-size:13.5px;line-height:1.3;color:var(--em-ink);cursor:pointer;text-align:left;width:100%;}
.legacy-home-root-link:hover,.legacy-home-root-link.active{background:#f5f5f7;color:var(--em-red);}
.legacy-home-hero-main{position:relative;min-height:314px;}
.legacy-home-slides{position:relative;height:100%;min-height:314px;}
.legacy-home-slide{position:absolute;inset:0;opacity:0;transition:opacity .5s;display:flex;}
.legacy-home-slide.active{opacity:1;}
.legacy-home-slide img{width:100%;height:100%;object-fit:cover;display:block;}
/* Slides are the real CMS banner artwork (getbanners) — no generated promos. */
.legacy-home-slide-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.9);border:0;color:var(--em-ink);font-size:17px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.15);z-index:3;}
.legacy-home-slide-nav.prev{left:12px;}
.legacy-home-slide-nav.next{right:12px;}
.legacy-home-dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:7px;z-index:3;}
.legacy-home-dots button{width:8px;height:8px;border-radius:50%;border:0;background:rgba(0,0,0,.25);cursor:pointer;padding:0;}
.legacy-home-dots button.active{background:var(--em-ink);}
.legacy-home-category-panels{position:absolute;inset:0;background:#fff;z-index:5;padding:18px 22px;overflow-y:auto;display:none;}
.legacy-home-hero-shell.legacy-home-menu-open .legacy-home-category-panels{display:block;}
.legacy-home-root-panel{display:none;}
.legacy-home-root-panel.active{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 22px;}

/* model finder + numbered stat tiles */
/* stretch so the tiles column matches the form's height instead of hugging its
   own content */
.home-finder-panel{display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;align-items:stretch;background:#fff;border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:22px 24px 24px;margin-bottom:18px;}
/* the head repeats the panel's columns, so "ή κάνε περιήγηση σε" starts exactly
   above the yellow tiles rather than trailing the heading */
.home-finder-head{grid-column:1/-1;display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;align-items:baseline;margin-bottom:8px;}
.home-finder-head h2{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:27px;font-weight:700;margin:0;white-space:nowrap;}
.home-finder-head span{font-size:15px;color:#5f656e;}
.home-finder-form{display:flex;flex-direction:column;gap:10px;margin:0;}
.finder-free-shell{position:relative;}
.home-finder-form input,.home-finder-form select{width:100%;border:1px solid var(--em-line);border-radius:10px;padding:11px 13px;font-size:14px;background:#fff;outline:0;}
.home-finder-form input:focus,.home-finder-form select:focus{border-color:#c9ccd2;}
.home-finder-row{display:grid;grid-template-columns:1fr 96px;gap:10px;}
/* the nav drop is full width, so brand / cc / model fit on one line there —
   display:contents lifts the row's two selects into the form's own grid */
.legacy-drop .home-finder-form{display:grid;grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr);gap:10px;}
.legacy-drop .home-finder-form .finder-free-shell{grid-column:1/-1;}
.legacy-drop .home-finder-row{display:contents;}
.home-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.home-stat{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(135deg,var(--em-yellow),var(--em-yellow-2));border-radius:12px;padding:16px 14px 16px 18px;color:var(--em-ink);}
.home-stat:hover{filter:brightness(1.04);color:var(--em-ink);}
.home-stat-no{position:absolute;top:-8px;left:-8px;width:22px;height:22px;border-radius:50%;background:var(--em-ink);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.home-stat-copy{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;}
.home-stat-copy strong{font-size:19px;font-weight:800;color:var(--em-red);}
.home-stat-copy span{font-size:13.5px;font-weight:600;}
.home-stat-icon{width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.75);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--em-ink);flex:0 0 auto;}

/* section head with carousel arrows */
.home-block{margin-bottom:18px;}
.home-block-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;}
.home-block-head h2{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:26px;font-weight:700;margin:0;}
.home-block-nav{display:flex;gap:8px;}
.home-block-nav button{width:38px;height:38px;border-radius:50%;border:1px solid var(--em-line);background:#fff;color:var(--em-ink);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.home-block-nav button:hover{border-color:var(--em-ink);}
.home-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3*14px)/4);gap:14px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;padding-bottom:4px;scrollbar-width:none;}
.home-rail::-webkit-scrollbar{display:none;}
.home-rail>*{scroll-snap-align:start;}

/* featured categories tiles */
.home-featured{background:#fff;border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:22px 24px 24px;margin-bottom:18px;}
.home-featured-eyebrow{display:block;font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--em-red);margin-bottom:4px;}
.home-featured h2{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:25px;font-weight:700;margin:0 0 16px;}
.home-featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.home-featured-tile{position:relative;display:block;border-radius:12px;overflow:hidden;min-height:190px;}
.home-featured-tile img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .3s;}
.home-featured-tile:hover img{transform:scale(1.05);}
.home-featured-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.68) 100%);}
.home-featured-tile b{position:absolute;left:18px;bottom:14px;z-index:2;color:#fff;font-family:"Roboto Condensed",Manrope,sans-serif;font-size:24px;font-weight:700;}

/* ---------- footer ---------------------------------------------------------- */
.legacy-footer{background:#f4f4f5;border-top:1px solid #e2e2e5;margin-top:26px;padding:44px 0 0;}
.legacy-footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding-bottom:36px;}
.legacy-footer h3{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:26px;font-weight:700;margin:0 0 16px;}
.legacy-footer h4{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:22px;font-weight:700;margin:26px 0 12px;}
.legacy-footer p{font-size:13.5px;line-height:1.75;color:#3d434b;margin:0 0 14px;}
.legacy-footer-btn{display:inline-flex;align-items:center;border:1px solid #23272e;border-radius:8px;padding:9px 18px;font-size:13.5px;font-weight:600;color:var(--em-ink);background:#fff;}
.legacy-footer-btn:hover{background:#23272e;color:#fff;}
/* height stays auto — site.css already sets width:155px, and forcing a height
   here squashed the logo to 155x30 on artwork that is 155x70. */
.legacy-footer-logo{margin-top:22px;display:block;}
.legacy-newsletter label{display:block;font-size:13px;color:#3d434b;margin-bottom:6px;}
.legacy-newsletter-row{display:flex;gap:10px;}
.legacy-newsletter-row input{flex:1 1 auto;border:1px solid #d3d5da;border-radius:8px;padding:11px 13px;font-size:14px;outline:0;background:#fff;}
.legacy-newsletter-row button{flex:0 0 auto;border:0;border-radius:8px;background:var(--em-red);color:#fff;font-size:14px;font-weight:700;padding:11px 22px;cursor:pointer;}
.legacy-newsletter-row button:hover{background:var(--em-red-dark);}
.legacy-footer-contact strong{font-size:14.5px;}
.legacy-social{display:flex;gap:9px;margin:18px 0;}
.legacy-social a{width:33px;height:33px;border-radius:50%;background:var(--em-nav);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;}
.legacy-social a:hover{background:var(--em-red);color:#fff;}
.legacy-footer-links{list-style:none;margin:0;padding:0;}
.legacy-footer-links li{margin-bottom:7px;}
.legacy-footer-links a{font-size:13.5px;color:#3d434b;}
.legacy-footer-links a:hover{color:var(--em-red);}
.legacy-footer-bottom{border-top:1px solid #e2e2e5;padding:18px 0;text-align:center;font-size:12.5px;color:#6c727b;}
.legacy-footer-bottom a{color:var(--em-ink);font-weight:700;}

/* ---------- product detail ----------------------------------------------------
   The detail page now renders the legacy markup (detail-top-layout /
   detail-media-column / product-price-row / detail-buy-panel / detail-mobile-bar
   / best-price-guarantee), so site.css owns its styling. The port's own
   detail-* rules were removed: they fought the real ones — .detail-quick-card in
   particular, which on the legacy page is the small fitment link card, not a
   panel. Only additions the legacy page does not have are kept below. */

/* Εγγύηση καλύτερης τιμής — one collapsed box under the description instead of
   the legacy full-width two-column band. site.css lays the section out as a
   grid with a 420px-min form column and blows the heading up to 2.5rem; both
   are wrong once everything lives inside the accordion. */
/* margin:0 — .detail-copy is a grid and already spaces its children; any extra
   margin here doubles the gap against the fitment cards above. */
.best-price-compact{display:block;grid-template-columns:none;margin:0;padding:0;border:0;}
.best-price-compact .best-price-guarantee-copy{gap:4px;margin-bottom:4px;}
.best-price-compact .best-price-guarantee-copy h2{font-size:17px;line-height:1.25;font-weight:800;}
.best-price-compact .best-price-guarantee-copy p{font-size:13px;line-height:1.55;max-width:none;}
.best-price-compact .best-price-guarantee-form summary{min-height:46px;padding:10px 14px;font-size:12px;
  letter-spacing:.07em;text-transform:uppercase;}

/* My Parking — the saved bikes, one card per shortcut */
/* lazy-load button / sentinel under the results grid */
.catalog-more{display:flex;justify-content:center;padding:22px 0 6px;}
.catalog-more[hidden]{display:none;}
.catalog-more button{min-width:220px;}

/* cc chips on a bike-brand page */
.bike-cc-filter{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;}
.bike-cc-label{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--em-muted);margin-right:2px;}
.bike-cc-chip{border:1px solid var(--em-line);border-radius:999px;padding:6px 13px;font-size:13px;font-weight:600;
  color:#3d434b;background:#fff;}
.bike-cc-chip:hover{border-color:var(--em-red);color:var(--em-red);}
.bike-cc-chip.is-active{background:var(--em-red);border-color:var(--em-red);color:#fff;}

/* the garage, inside the My Parking nav drop */
.nav-garage{margin:0 0 14px;padding-bottom:14px;border-bottom:1px solid var(--em-line);}
.nav-garage-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.nav-garage-head h4{margin:0;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--em-muted);}
.nav-garage-head form{margin:0;}
.nav-garage-head button{border:0;background:transparent;color:var(--em-muted);font-size:12px;cursor:pointer;text-decoration:underline;}
.nav-garage-head button:hover{color:var(--em-red);}
.nav-garage-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;}
.nav-garage-item{display:flex;align-items:center;gap:6px;border:1px solid var(--em-line);border-radius:10px;
  background:#fff;padding:6px 8px 6px 6px;}
.nav-garage-link{display:flex;align-items:center;gap:9px;flex:1 1 auto;min-width:0;color:var(--em-ink);font-size:13px;font-weight:600;}
.nav-garage-link img{width:46px;height:34px;object-fit:contain;flex:0 0 auto;}
.nav-garage-link span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.nav-garage-link:hover{color:var(--em-red);}
.nav-garage-item form{margin:0;}
.nav-garage-item form button{width:24px;height:24px;flex:0 0 auto;border:0;border-radius:7px;background:transparent;
  color:#a3a7ae;font-size:17px;line-height:1;cursor:pointer;}
.nav-garage-item form button:hover{background:#f4f4f6;color:var(--em-red);}

/* the saved bikes live in the same panel as the page title, so this heading
   has to sit clearly below it — smaller than the H1, no eyebrow */
.garage-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin:18px 0 0;padding-top:16px;border-top:1px solid var(--em-line);}
.garage-head h2{margin:0;font-family:"Roboto Condensed",Manrope,sans-serif;font-size:18px;font-weight:700;
  color:var(--em-ink);}
.garage-head form{margin:0;}
.garage-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin-top:14px;}
.garage-card{display:flex;flex-direction:column;border:1px solid var(--em-line);border-radius:12px;background:#fff;
  overflow:hidden;}
.garage-media{display:block;padding:10px 12px 0;background:#fff;}
.garage-media img{width:100%;height:110px;object-fit:contain;display:block;}
.garage-copy{display:flex;flex-direction:column;gap:2px;padding:10px 14px 14px;flex:1 1 auto;}
.garage-name{font-size:14px;font-weight:700;line-height:1.3;color:var(--em-ink);}
.garage-name:hover{color:var(--em-red);}
.garage-meta{margin:0;font-size:12.5px;color:var(--em-muted);}
.garage-actions{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:12px;}
.garage-actions form{margin:0;}
.garage-actions .btn{flex:1 1 auto;padding:8px 10px;font-size:13px;text-align:center;}
.garage-remove{width:34px;height:34px;flex:0 0 auto;border:1px solid var(--em-line);border-radius:9px;background:#fff;
  color:var(--em-muted);font-size:19px;line-height:1;cursor:pointer;}
.garage-remove:hover{border-color:var(--em-red);color:var(--em-red);}
.garage-panel .section-head{align-items:center;}

/* "Είναι η μηχανή μου" on the model page's sidebar card */
.catalog-model-park{margin:10px 0 0;}
.catalog-model-park button{display:inline-flex;align-items:center;gap:8px;width:100%;justify-content:center;
  border:1px solid var(--em-line);border-radius:9px;background:#fff;color:var(--em-ink);
  padding:9px 12px;font-size:13px;font-weight:700;cursor:pointer;}
.catalog-model-park button:hover{border-color:var(--em-red);color:var(--em-red);}
.catalog-model-parked{margin:10px 0 0;font-size:12.5px;font-weight:600;color:#1f7a3f;display:flex;gap:7px;
  align-items:center;justify-content:center;flex-wrap:wrap;}
.catalog-model-parked a{color:var(--em-red);}

/* compatible models: brand tiles + modal (kept — this is the port's own UI) */
.compat-brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:16px;}
.compat-brand{display:flex;flex-direction:column;align-items:flex-start;gap:3px;border:1px solid var(--em-line);border-radius:11px;background:#fff;padding:14px 16px;cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s;}
.compat-brand:hover{border-color:var(--em-red);box-shadow:var(--em-shadow);}
.compat-brand strong{font-size:14.5px;font-weight:800;letter-spacing:.03em;color:var(--em-ink);}
.compat-brand span{font-size:12px;color:var(--em-muted);}
.compat-modal{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:24px;}
.compat-modal[hidden]{display:none;}
.compat-backdrop{position:absolute;inset:0;background:rgba(16,18,22,.55);}
.compat-dialog{position:relative;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.3);width:min(680px,100%);max-height:84vh;display:flex;flex-direction:column;}
.compat-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px;border-bottom:1px solid var(--em-line);}
.compat-head h3{margin:0;font-family:"Roboto Condensed",Manrope,sans-serif;font-size:19px;font-weight:700;}
.compat-head small{font-size:12.5px;font-weight:400;color:var(--em-muted);margin-left:6px;}
.compat-x{border:0;background:transparent;font-size:26px;line-height:1;color:#6c727b;cursor:pointer;padding:0 4px;}
.compat-x:hover{color:var(--em-ink);}
.compat-filters{display:flex;gap:10px;padding:14px 22px 0;flex-wrap:wrap;}
.compat-search{flex:1 1 200px;border:1px solid var(--em-line);border-radius:9px;padding:10px 13px;font-size:14px;outline:0;}
.compat-cc{flex:0 0 auto;border:1px solid var(--em-line);border-radius:9px;padding:10px 13px;font-size:14px;background:#fff;}
.compat-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;padding:16px 22px 22px;overflow-y:auto;}
.compat-link{display:flex;flex-direction:column;gap:3px;border:1px solid var(--em-line);border-radius:10px;padding:11px 13px;color:var(--em-ink);}
.compat-link:hover{border-color:var(--em-red);color:var(--em-red);}
.compat-link-name{font-size:13.5px;font-weight:700;line-height:1.25;}
.compat-link-meta{font-size:11.5px;color:var(--em-muted);}
.compat-empty{grid-column:1/-1;margin:6px 0;color:var(--em-muted);font-size:13.5px;text-align:center;}

/* ---------- checkout ---------------------------------------------------------- */
.co-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start;}
.co-main{display:flex;flex-direction:column;gap:18px;}
.co-block{margin-bottom:0;}
.co-block h2,.co-h2{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:19px;font-weight:700;margin:0 0 16px;color:var(--em-ink);}
.co-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.co-field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.co-field>span{font-size:12.5px;font-weight:600;color:#5f656e;}
.co-field>span em{color:var(--em-red);font-style:normal;}
.co-field input,.co-field select,.co-field textarea{border:1px solid var(--em-line);border-radius:9px;padding:11px 13px;font-size:14px;background:#fff;outline:0;width:100%;font-family:inherit;}
.co-field input:focus,.co-field select:focus,.co-field textarea:focus{border-color:#9aa0a8;}
.co-field textarea{resize:vertical;}
.co-check{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:13.5px;color:#3d434b;cursor:pointer;}
.co-check input{width:17px;height:17px;accent-color:var(--em-red);flex:0 0 auto;}
.co-invoice{margin-top:14px;}
.co-options{display:flex;flex-direction:column;gap:10px;}
.co-option{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--em-line);border-radius:11px;padding:14px;cursor:pointer;transition:border-color .15s,background .15s;}
.co-option:hover{border-color:#9aa0a8;}
.co-option input{margin-top:2px;width:17px;height:17px;accent-color:var(--em-red);flex:0 0 auto;}
.co-option input:checked~.co-option-body strong{color:var(--em-red);}
.co-option:has(input:checked){border-color:var(--em-red);background:#fff7f7;}
.co-option-body{display:flex;flex-direction:column;gap:3px;min-width:0;}
.co-option-body strong{font-size:14.5px;font-weight:700;display:flex;align-items:center;gap:8px;}
.co-option-body small{font-size:12.5px;color:var(--em-muted);line-height:1.45;}
.co-option.is-off{opacity:.55;cursor:not-allowed;background:#fafafa;}

.co-guest{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:16px;padding:14px 16px;border:1px solid var(--em-line);border-radius:11px;background:#fafafa;font-size:13.5px;color:#3d434b;}
.co-signedin{display:flex;align-items:center;gap:9px;margin:16px 0 0;font-size:13.5px;color:#1f7a3f;font-weight:600;}
.co-coupon{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--em-line);}
.co-coupon label{display:block;font-size:12px;font-weight:700;color:#5f656e;margin-bottom:7px;}
.co-coupon-row{display:flex;gap:8px;}
.co-coupon-row input{flex:1 1 auto;min-width:0;border:1px solid var(--em-line);border-radius:9px;padding:10px 12px;font-size:13.5px;outline:0;}
.co-coupon-btn{flex:0 0 auto;border:1px solid var(--em-ink);border-radius:9px;background:#fff;color:var(--em-ink);font-size:13px;font-weight:700;padding:10px 14px;cursor:pointer;}
.co-coupon-btn:hover{background:var(--em-ink);color:#fff;}
.co-ship-extra{margin:-4px 0 4px 30px;font-size:13px;}
.co-ship-cost{font-style:normal;margin-left:auto;font-size:13.5px;font-weight:800;color:var(--em-red);}
.co-option-body strong{justify-content:flex-start;width:100%;}
.co-side{position:sticky;top:18px;}
.co-summary h2{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:19px;font-weight:700;margin:0 0 14px;}
.co-line{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid #f1f1f3;}
.co-line img{width:44px;height:44px;object-fit:contain;flex:0 0 auto;}
.co-line-name{flex:1 1 auto;min-width:0;font-size:13px;line-height:1.35;display:flex;flex-direction:column;gap:2px;}
.co-line-name small{color:var(--em-muted);font-size:12px;}
.co-line strong{font-size:13.5px;white-space:nowrap;}
.co-total-row{display:flex;justify-content:space-between;align-items:baseline;padding:9px 0;font-size:14px;color:#3d434b;}
.co-total-row.co-grand{border-top:1px solid var(--em-line);margin-top:6px;padding-top:14px;font-size:16px;color:var(--em-ink);}
.co-total-row.co-grand strong{font-size:22px;font-weight:800;}
.co-terms{margin:16px 0 4px;}
.co-submit{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;margin-top:14px;border:0;border-radius:10px;background:var(--em-red);color:#fff;font-size:15px;font-weight:700;padding:14px;cursor:pointer;}
.co-submit:hover{background:var(--em-red-dark);}
.co-guard{margin:14px 0 0;padding:12px 14px;border-radius:10px;background:#fff8e6;border:1px solid #f0dfae;font-size:12.5px;line-height:1.55;color:#6b5518;}
.co-guard code{background:rgba(0,0,0,.06);padding:1px 5px;border-radius:4px;font-size:11.5px;}
.co-back{display:block;text-align:center;margin-top:14px;font-size:13.5px;color:#5f656e;}
.co-back:hover{color:var(--em-red);}
.co-table{width:100%;border-collapse:collapse;font-size:13.5px;margin-bottom:10px;}
.co-table th{text-align:left;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--em-muted);padding:0 10px 10px 0;border-bottom:1px solid var(--em-line);}
.co-table td{padding:11px 10px 11px 0;border-bottom:1px solid #f1f1f3;}
.co-table td:last-child,.co-table th:last-child{text-align:right;padding-right:0;font-weight:700;}
.co-dl{display:grid;grid-template-columns:170px minmax(0,1fr);gap:10px 16px;margin:0 0 18px;font-size:14px;}
.co-dl dt{color:var(--em-muted);}
.co-dl dd{margin:0;color:var(--em-ink);font-weight:600;}
@media (max-width:991px){
  .co-grid{grid-template-columns:minmax(0,1fr);}
  .co-side{position:static;}
  .co-fields{grid-template-columns:minmax(0,1fr);}
  .co-dl{grid-template-columns:minmax(0,1fr);gap:2px 0;}
  .co-dl dd{margin-bottom:10px;}
}

/* ---------- login / account --------------------------------------------------- */
.auth-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;}
.auth-card{margin-bottom:0;}
/* right column: register + guest order check, both folded */
.auth-stack{display:grid;gap:18px;align-content:start;}
.auth-fold{padding-top:0;padding-bottom:0;}
.auth-fold summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;
  list-style:none;padding:18px 0;}
.auth-fold summary::-webkit-details-marker{display:none;}
.auth-fold summary .co-h2{margin:0;font-size:17px;font-weight:800;color:var(--em-ink);}
.auth-fold-icon{color:var(--em-muted);transition:transform .18s ease;}
.auth-fold[open] .auth-fold-icon{transform:rotate(180deg);}
.auth-fold[open] summary{border-bottom:1px solid var(--em-line);margin-bottom:16px;}
.auth-fold>*:last-child{margin-bottom:18px;}
.auth-form{display:flex;flex-direction:column;gap:14px;margin-top:18px;}
.auth-form .co-field{gap:6px;}
.auth-error{display:flex;align-items:center;gap:9px;margin:16px 0 0;padding:12px 14px;border-radius:10px;background:#fdecec;border:1px solid #f3c9c9;color:#a11b1b;font-size:13.5px;}
.auth-alt{margin:16px 0 0;font-size:13px;color:var(--em-muted);}
.auth-alt a{color:var(--em-red);font-weight:600;}
.co-submit-ghost{background:var(--em-ink);}
.co-submit-ghost:hover{background:#000;}
.account-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.account-orders td:first-child a{color:var(--em-red);font-weight:700;}
.order-status{display:inline-block;background:#f1f1f3;border-radius:999px;padding:4px 11px;font-size:12px;font-weight:600;color:#3d434b;white-space:nowrap;}
@media (max-width:991px){ .auth-grid{grid-template-columns:minmax(0,1fr);} }

/* ---------- landing pages ---------------------------------------------------- */
.landing-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;}
.landing-card{display:flex;flex-direction:column;gap:5px;background:#fff;border-radius:11px;box-shadow:var(--em-shadow);padding:15px 16px;color:var(--em-ink);}
.landing-card:hover{box-shadow:0 8px 22px rgba(16,18,22,.13);color:var(--em-red);}
.landing-card strong{font-size:14.5px;font-weight:700;}
.landing-card span{font-size:12.5px;color:var(--em-muted);}
.landing-letter{grid-column:1/-1;font-family:"Roboto Condensed",Manrope,sans-serif;font-size:21px;font-weight:700;margin:14px 0 2px;padding-bottom:6px;border-bottom:2px solid var(--em-red);}
.prose{font-size:14.5px;line-height:1.75;color:#3d434b;}
.prose h2{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:21px;font-weight:700;margin:26px 0 10px;color:var(--em-ink);}
.prose ul{padding-left:20px;}
.prose li{margin-bottom:6px;}

/* ---------- responsive -------------------------------------------------------- */
.mobile-only{display:none;}
@media (max-width:1199px){
  .catalog-results-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .home-rail{grid-auto-columns:calc((100% - 2*14px)/3);}
  .legacy-model-tiles,.legacy-drop-cols{grid-template-columns:repeat(4,1fr);}
  .legacy-brand-grid{grid-template-columns:repeat(6,1fr);}
  .legacy-brand-strip{display:none;}
}
@media (max-width:991px){
  .desktop-only{display:none !important;}
  .mobile-only{display:block;}
  .catalog-layout{grid-template-columns:minmax(0,1fr);}
  /* phone filter bar: Διαθέσιμα | Προσφορές | sort on one row, the sort hard
     right against the toggles; the price slider and the Φίλτρα button take
     their own full-width rows underneath. */
  /* display:contents lifts the toggles out of their own form box so they and
     the (separate) sort form share one flex line; the form still submits. */
  .catalog-quick-toggle-form{display:contents;}
  /* every control gets the full width on a phone — three of them never fit
     side by side anyway, and half-width boxes just looked unfinished */
  .catalog-toggle-row{flex:1 1 100%;min-width:0;padding:11px 14px;}
  .catalog-price-filter{flex:1 1 100%;min-width:0;order:5;}
  .catalog-sort-form{order:4;flex:1 1 100%;width:100%;margin:0;}
  .catalog-sort-form select{width:100%;max-width:none;min-width:0;}
  .catalog-mobile-actions{flex:1 1 100%;order:6;}
  .catalog-results-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .home-finder-panel{grid-template-columns:minmax(0,1fr);}
  .home-stats{grid-template-columns:repeat(2,1fr);}
  .legacy-home-hero-shell{grid-template-columns:minmax(0,1fr);}
  .legacy-home-rail{display:none;}
  .home-featured-grid{grid-template-columns:1fr;}
  .legacy-footer-cols{grid-template-columns:1fr;gap:26px;}
  .legacy-topbar-copy{display:none;}
  .home-rail{grid-auto-columns:calc((100% - 14px)/2);}
  .legacy-model-tiles,.legacy-drop-cols{grid-template-columns:repeat(2,1fr);}
  .legacy-brand-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:575px){
  .catalog-results-grid{grid-template-columns:minmax(0,1fr);}
  .home-stats{grid-template-columns:1fr;}
  .home-rail{grid-auto-columns:88%;}
  .catalog-page-title{font-size:23px;}
  .legacy-header-tools .legacy-tool-copy{display:none;}
}

/* product page — characteristics from the catalog filters (FiltersValues),
   the same rows the admin edits. Its own class, not .detail-specs: the legacy
   site.css turns that one into a two-column card grid. */
.product-specs{width:100%;border-collapse:collapse;margin:20px 0 0;font-size:14px;
  text-align:left;table-layout:fixed}
.product-specs caption{caption-side:top;text-align:left;font-size:12.5px;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;color:#111;padding:0 0 8px}
.product-specs th,.product-specs td{text-align:left;vertical-align:top;padding:8px 0;
  border-bottom:1px solid #eceef1}
.product-specs th{font-weight:600;color:#5b6270;width:38%;padding-right:16px}
.product-specs td{font-weight:600;color:#111}
.product-specs a{color:inherit;text-decoration:none;border-bottom:1px dotted #c9ced6}
.product-specs a:hover{color:var(--brand,#b3131b);border-bottom-color:currentColor}
.product-specs tr:last-child th,.product-specs tr:last-child td{border-bottom:0}
.product-specs-rest{display:inline}
.product-specs-rest summary{display:inline;cursor:pointer;color:var(--brand,#b3131b);font-weight:700;
  list-style:none;margin-left:4px}
.product-specs-rest summary::-webkit-details-marker{display:none}
.product-specs-rest[open] summary{color:#6b7280}
@media (max-width:640px){.product-specs th{width:45%}}

/* cart / checkout notice, driven by /admin/settings (holidays, delays) */
.shop-notice{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0;padding:12px 15px;border-radius:12px;
  background:#fff6e5;border:1px solid #f0dcb4;color:#8a5b00;font-size:14.5px;line-height:1.55;font-weight:600}
.shop-notice i{margin-top:3px;flex:0 0 auto}