/* ==========================================================================
   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;}
/* The first column is flush with the red "Κατηγορίες" button (196px) instead of
   overhanging it by 41px, so the arrows sit inside that edge too. */
.legacy-category-roots{flex:0 0 196px;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 14px;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;}

/* Τα δύο πάνελ που το js μετακινεί στο κινητό: τα μοντέλα μέσα στη
   μπάρα των φίλτρων και η ταξινόμηση μέσα στο συρτάρι. Κάρτα μέσα σε κάρτα
   δεν θέλουμε: το πάνελ παίρνει το περίγραμμα των διπλανών κουτιών. */
/* Το .mobile-only της site.css επιβάλλει inline-flex με !important, οπότε η
   θέση είναι flex container: το πάνελ πιάνει όλο το πλάτος ως flex item. */
.catalog-model-slot>.catalog-filter-block{flex:1 1 100%;min-width:0;
  box-shadow:none;border:1px solid var(--em-line);border-radius:11px;}
/* εικονίδιο μηχανής μπροστά από το «Επιλογή μοντέλου» στο κινητό */
.catalog-model-title-icon{color:var(--em-red);margin-right:2px;font-size:14px;}
/* Σελίδα μοντέλου στο κινητό: φωτό + όνομα και από κάτω οι κατηγορίες.
   Το «My Parking» και το «Όλες οι μάρκες μηχανής» μένουν στο desktop —
   εδώ πάνω τρώνε τη θέση των προϊόντων. */
.catalog-model-hero-slot{flex-wrap:wrap;gap:10px;}
.catalog-model-hero-slot>.catalog-model-card{flex:1 1 100%;min-width:0;
  box-shadow:none;border:1px solid var(--em-line);border-radius:11px;padding:10px;}
.catalog-model-hero-slot>.catalog-filter-block{flex:1 1 100%;min-width:0;
  box-shadow:none;border:1px solid var(--em-line);border-radius:11px;}
.catalog-model-hero-slot .catalog-model-parking,
.catalog-model-hero-slot .catalog-model-link{display:none;}
/* 240 και όχι λιγότερο: κάτω από αυτό κόβεται το «Αποθηκεύτηκε στο γκαράζ σου» */
.catalog-model-hero-slot .catalog-model-photo{max-width:240px;}
.catalog-model-hero-slot .catalog-model-name{font-size:18px;margin:10px 0 4px;}
.catalog-model-hero-slot .catalog-model-meta{margin:0;}
.catalog-filters-stack>.catalog-sort-form{display:block;width:100%;margin:0;background:var(--em-card);
  border-radius:var(--em-radius);box-shadow:var(--em-shadow);padding:12px 14px;}
.catalog-filters-stack>.catalog-sort-form select{width:100%;min-width:0;}

/* ---------- 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 */
/* Οι φωτογραφίες μοντέλων είναι όλες τετράγωνες. Το 150px ύψος με cover έκοβε
   πάνω-κάτω τη μηχανή· τετράγωνο κουτί με contain τη δείχνει ολόκληρη. Το
   max-width την κρατάει να μην κυριαρχεί στο πλάι. */
/* wrapper: κρατάει το badge και τη φωτό — χωρίς φωτό πέφτει μόνο το κουτί */
.catalog-model-photo{position:relative;max-width:300px;margin-inline:auto;}
.catalog-model-photo.no-photo .catalog-model-card-media{display:none;}
.catalog-model-photo.no-photo{text-align:center;}
.catalog-model-photo.no-photo .catalog-model-parked{position:static;transform:none;margin:0 0 2px;
  box-shadow:none;background:#eef7f0;}
.catalog-model-card-media{position:relative;background:#fff;border-radius:10px;overflow:hidden;line-height:0;
aspect-ratio:1/1;}
.catalog-model-card-media img{width:100%;height:100%;object-fit:contain;display:block;border-radius:10px;}
/* Χαρακτηριστικά μοντέλου — label και οριζόντιο πινακάκι κάτω από το SEO κείμενο */
.model-specs-flat{margin:14px 0 0;}
.model-specs-title{margin:0;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
color:#7a808a;list-style:none;}
.model-specs-title::-webkit-details-marker{display:none;}
/* στο desktop είναι απλό label — μόνο στο κινητό ανοιγοκλείνει */
.model-specs-caret{display:none;}
.model-specs-note{font-weight:400;text-transform:none;letter-spacing:0;color:#8a9099;margin-left:6px;}
/* ισούψεις στήλες: το περίσσευμα πέφτει στο κάτω μέρος της
   τελευταίας στήλης, όχι σαν μισή σειρά δεξιά. */
/* 4 στήλες και όχι 5: το πλαίσιο κοόβεται στα 1238px, οπότε με 5
   το κελί έπεφτε στα 210px — λιγότερο από τα 231px που θέλουν τα μεγαλύτερα
   λεκτικά, κι έσπαγαν σε διπλή γραμμή. */
.model-spec-strip{columns:4 240px;column-gap:24px;column-rule:1px solid #ece7dc;
margin:10px 0 0;padding:10px 16px;background:#fff;border:1px solid #ece7dc;border-radius:12px;}
.model-spec{display:flex;flex-direction:column;gap:3px;min-width:0;
break-inside:avoid;-webkit-column-break-inside:avoid;padding:7px 6px;border-radius:7px;}
.model-spec-label{font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#7a808a;
line-height:1.3;}
.model-spec-value{font-size:13.5px;font-weight:700;color:var(--em-ink);line-height:1.25;overflow-wrap:anywhere;}
/* ένας σύνδεσμος ανά keyword μέσα στην τιμή (15W-50 MA or 10W-40 MA), το υπόλοιπο κείμενο μένει μαύρο */
.model-spec-link{color:var(--em-red);text-decoration:none;white-space:nowrap;transition:color .15s ease;}
.model-spec-link i{font-size:11px;opacity:.55;margin-left:2px;}
.model-spec-link:hover{color:var(--em-red-dark);}
.model-spec-link:hover i{opacity:1;}
@media (max-width:575px){
  .model-specs-flat{margin-top:12px;}
  /* στο κινητό το label γίνεται κουμπί: κλειστό πιάνει μία γραμμή */
  .model-specs-title{display:inline-flex;align-items:center;gap:8px;cursor:pointer;
    padding:7px 13px;border:1px solid var(--em-line);border-radius:10px;background:#fff;
    color:var(--em-ink);font-size:11.5px;user-select:none;}
  .model-specs-caret{display:inline-block;font-size:9px;color:#8a9099;transition:transform .18s ease;}
  .model-specs-flat[open] .model-specs-caret{transform:rotate(180deg);}
  .model-specs-flat[open] .model-specs-title{background:#faf8f3;border-color:#cfc7b6;}
  /* Στο κινητό μία στήλη: κάθε χαρακτηριστικό μια σειρά, ετικέτα αριστερά και
     τιμή δεξιά. Το δίστηλο έκοβε τα λεκτικά στη μέση σε πλάτος τηλεφώνου. */
  .model-spec-strip{columns:auto;column-gap:0;column-rule:0;padding:4px 12px;border-radius:8px;}
  .model-spec{flex-direction:row;align-items:baseline;justify-content:space-between;
    gap:12px;padding:7px 2px;border-radius:0;border-bottom:1px solid #f1ede4;}
  .model-spec:last-child{border-bottom:0;}
  .model-spec-label{flex:0 1 auto;max-width:48%;}
  .model-spec-value{font-size:12.5px;text-align:right;flex:1 1 auto;min-width:0;}
}
.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);text-align:center;}
.catalog-model-meta{font-size:13px;color:var(--em-muted);margin:0 0 12px;text-align:center;}
/* My Parking: κανονικό κουμπί, όχι έντονο link */
.catalog-model-parking{display:flex;align-items:center;justify-content:center;gap:7px;
border:1px solid var(--em-line);border-radius:9px;background:#fff;color:var(--em-ink);
padding:8px 14px;font-size:13px;font-weight:500;margin:0 0 12px;}
.catalog-model-parking:hover{border-color:#cfc7b6;background:#faf8f3;color:var(--em-ink);}
.catalog-model-link{font-size:13px;color:var(--em-ink);border-top:1px solid #e9e4d8;display:block;padding-top:11px;text-align:center;}
.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;}
/* Collapsed it is a 17px dot pinned bottom-right of the photo. On hover the
   label slides open leftwards, into the card — the pill is anchored right, so
   growing its width is what moves the text inwards. */
.pc-stock{position:absolute;right:12px;bottom:4px;height:17px;border-radius:999px;display:flex;align-items:center;justify-content:flex-end;max-width:calc(100% - 26px);overflow:hidden;box-shadow:0 1px 3px rgba(16,18,22,.12);}
.pc-stock::after{content:"";flex:0 0 auto;width:6px;height:6px;margin:0 5.5px;border-radius:50%;}
.pc-stock-label{max-width:0;padding:0;opacity:0;overflow:hidden;white-space:nowrap;font-size:11px;font-weight:700;line-height:1;transition:max-width .28s ease,padding .28s ease,opacity .16s ease;}
.pc-stock.in{background:#dff3e4;color:#1f7a3f;}
.pc-stock.in::after{background:#1f7a3f;}
/* orderable but not on the shelf (1-3 / 4-10 days, κατόπιν παραγγελίας) */
.pc-stock.soon{background:#fdf3df;color:#8a6410;}
.pc-stock.soon::after{background:#c9962a;}
.pc-stock.out{background:#fde3e6;color:#c62435;}
.pc-stock.out::after{background:#c62435;}
/* Touch devices have no hover: there the dot keeps its title and stays shut. */
@media (hover:hover){
  .catalog-product-card:hover .pc-stock-label{max-width:160px;padding:0 1px 0 9px;opacity:1;}
}
.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 ------------------------------------------------------------ */
/* The home rail is the SAME column as the red «Κατηγορίες» button above it —
   drive it from the shared variable instead of a hardcoded 236px, or the two
   drift apart (they did: rail 236 vs button 196, 40px of overhang). */
.legacy-home-hero-shell{display:grid;grid-template-columns:var(--legacy-categories-column) 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 14px;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;}
/* Τα ανενεργά slides μένουν στη θέση τους για το fade. Χωρίς visibility/
   pointer-events ήταν απλώς διάφανα: το τελευταίο του DOM καθόταν από πάνω
   και έτρωγε ΟΛΑ τα clicks, οπότε κάθε slide πήγαινε στον δικό του σύνδεσμο. */
.legacy-home-slide{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s,visibility 0s linear .5s;display:flex;}
.legacy-home-slide.active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .5s,visibility 0s;}
.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(180deg,#fbfcfd 0%,#eff2f5 34%,#dbe0e7 51%,#e7ebf0 68%,#f7f9fb 100%);border:1px solid #d2d7de;box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(16,24,40,.07);border-radius:12px;padding:16px 14px 16px 18px;color:var(--em-ink);}
.home-stat:hover{filter:brightness(1.02);border-color:#b9c1cb;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:#fff;border:1px solid #e3e7ec;box-shadow:0 1px 1px rgba(16,24,40,.05);display:flex;align-items:center;justify-content:center;font-size:13px;color:#475467;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,.legacy-newsletter-form 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);}
/* On a phone the footer column is far too narrow for field + button side by
   side: the input collapsed to a few pixels while the button kept its full
   width. Stack them instead. */
@media (max-width:991px){
  .legacy-newsletter-row{flex-direction:column;align-items:stretch;}
  .legacy-newsletter-row input,.legacy-newsletter-row button{width:100%;flex:0 0 auto;}
}
.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. */


/* 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{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:2;
  display:inline-flex;align-items:center;gap:6px;max-width:calc(100% - 16px);
  padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.94);
  box-shadow:0 1px 4px rgba(16,18,22,.14);
  font-size:11px;font-weight:600;line-height:1.25;color:#1f7a3f;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.catalog-model-parked i{font-size:10.5px;flex:0 0 auto;}

/* 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;}

/* Σύνδεση μέσα στο checkout: email + κωδικός σε μία σειρά, χωρίς έξοδο από τη ροή */
.co-guest{margin-top:16px;padding:14px 16px;border:1px solid var(--em-line);border-radius:11px;background:#fafafa;font-size:13.5px;color:#3d434b;}
/* κλειστό accordion: μόνο η πρόταση· το βέλος γυρίζει όταν ανοίγει */
.co-guest-lead{display:block;margin:0;line-height:1.55;cursor:pointer;list-style:none;}
.co-guest-lead::-webkit-details-marker{display:none;}
/* μόνο το δεύτερο μισό της πρότασης δείχνει σαν link — αυτό ανοίγει το accordion */
.co-guest-link{color:var(--em-red);font-weight:700;text-decoration:none;}
.co-guest-lead:hover .co-guest-link{color:#b30000;}
/* inline, αμέσως μετά την τελευταία λέξη */
.co-guest-icon{display:inline-block;margin-left:7px;color:inherit;font-size:11.5px;transition:transform .18s ease;}
.co-guest[open] .co-guest-lead{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--em-line);}
.co-guest[open] .co-guest-icon{transform:rotate(180deg);}
.co-guest-lead:hover .co-guest-icon{color:var(--em-red);}
.co-guest-err{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:9px 12px;border-radius:9px;
  background:#fdecec;border:1px solid #f3c9c9;color:#a11b1b;font-size:13px;}
.co-guest-err a{color:#a11b1b;font-weight:700;text-decoration:underline;}
.co-guest-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:end;}
.co-guest-field{display:flex;flex-direction:column;gap:5px;min-width:0;}
.co-guest-field span{font-size:12px;font-weight:700;color:#5f656e;}
.co-guest-field input{width:100%;padding:10px 12px;border:1px solid var(--em-line);border-radius:9px;
  background:#fff;font-size:14px;font-family:inherit;color:var(--em-ink);}
.co-guest-field input:focus{outline:2px solid rgba(212,0,0,.35);outline-offset:1px;border-color:var(--em-red);}
.co-guest-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;
  padding:10px 18px;height:41px;border:0;border-radius:9px;background:var(--em-red);color:#fff;
  font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.co-guest-btn:hover{background:#b30000;}
.co-guest-alt{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 0;font-size:13px;}
.co-guest-alt a{color:var(--em-red);font-weight:600;}
.co-guest-alt span{color:var(--em-muted);}
/* compact social row inside the checkout panel */
.auth-social-compact{margin-top:14px;}
.auth-social-compact .auth-social-divider{margin-bottom:10px;font-size:12px;}
.auth-social-compact .auth-social-btn{display:inline-flex;width:auto;flex:1 1 190px;margin-bottom:0;padding:9px 14px;font-size:13.5px;}
.auth-social-compact{display:flex;flex-wrap:wrap;gap:9px;}
.auth-social-compact .auth-social-divider{flex:1 1 100%;margin-bottom:2px;}
@media(max-width:720px){
  .co-guest-form{grid-template-columns:minmax(0,1fr);}
  .co-guest-btn{width:100%;}
}
/* όταν τα δύο links σπάνε σε δύο γραμμές, ο διαχωριστής κρέμεται */
@media(max-width:520px){ .co-guest-alt span{display:none;} .co-guest-alt{gap:4px 14px;} }
.co-signedin{display:flex;align-items:center;gap:9px;margin:16px 0 0;font-size:13.5px;color:#1f7a3f;font-weight:600;}
/* Indented to line up with the text of .co-signedin above, past its icon. */
.co-autosave{margin:5px 0 0 25px;font-size:12.5px;line-height:1.45;color:var(--em-muted);font-weight:400;}
@media(max-width:640px){.co-autosave{margin-left:0;}}
.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;}
/* ACS Locker/Smartpoint picker στο checkout */
.co-acs-picker{margin:-2px 0 10px 30px;padding:12px;border:1px solid var(--em-line);border-radius:10px;background:#fafafb;}
@media(max-width:640px){.co-acs-picker{margin-left:0;}}
.co-acs-search{display:flex;gap:8px;}
.co-acs-search input{flex:1 1 auto;min-width:0;border:1px solid var(--em-line);border-radius:9px;padding:9px 12px;font-size:13.5px;outline:0;}
.co-acs-search button{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:9px 12px;cursor:pointer;}
.co-acs-search button:hover{background:var(--em-ink);color:#fff;}
.co-acs-list{margin-top:10px;display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto;}
.co-acs-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1px solid var(--em-line);border-radius:9px;background:#fff;padding:9px 11px;font-size:13px;cursor:pointer;}
.co-acs-item:hover{border-color:var(--em-ink);}
.co-acs-item.is-on{border-color:var(--em-red);box-shadow:0 0 0 1px var(--em-red);}
.co-acs-item strong{flex:0 0 auto;font-size:13.5px;}
.co-acs-item span{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px;line-height:1.3;}
.co-acs-item small{color:var(--em-muted);font-size:12px;}
.co-acs-item em{flex:0 0 auto;font-style:normal;font-size:11px;font-weight:700;padding:3px 7px;border-radius:20px;background:#eef0f3;color:#5f656e;}
.co-acs-empty{margin:10px 0 0;font-size:13px;color:var(--em-muted);}
.co-acs-picked{margin:0 0 10px;font-size:13px;font-weight:600;}
.co-acs-picked.is-ok{color:#1d7a3d;}
.co-acs-picked.is-bad{color:var(--em-red);}
/* Παραλαβή & πληρωμή στο κατάστημα: το toggle στην κορυφή του checkout */
.co-instore-prepay{display:block;margin-top:6px;color:#8a6d1f;font-weight:600;}
.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;}
/* Τα εργαλεία βοήθειας κάτω από το πάνελ αγοράς: συμβατότητα, συχνές
   ερωτήσεις, ερώτηση, εγγύηση τιμής, τηλέφωνο. */
.detail-help-tools{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px;}
.detail-help-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;height:44px;
padding:0 12px;border:1px solid var(--em-line);border-radius:8px;background:#fff;color:var(--em-ink);
font-size:15px;cursor:pointer;text-decoration:none;}
.detail-help-btn:hover{border-color:var(--em-ink);color:var(--em-ink);}
.detail-help-phone{font-weight:600;font-size:14px;}
.detail-help-phone span{white-space:nowrap;}
/* Η συμβατότητα ήρθε από πλαίσιο σε κουμπί: κρατάει το κείμενο («1 συμβατά
   μοντέλα»), γιατί εκεί ήταν όλη η πληροφορία του πλαισίου. Στα universal δεν
   πατιέται, οπότε δείχνει και σαν ταμπελάκι. */
.detail-help-fitment{font-weight:600;font-size:14px;}
.detail-help-fitment span{white-space:nowrap;}
.detail-help-fitment.is-static{background:#e9e7e1;color:#3f4652;cursor:default;
border:2px solid #fff;}
.detail-help-fitment.is-static:hover{border-color:#fff;}
.detail-help-modal{border:0;border-radius:14px;padding:0;width:min(560px,94vw);max-height:88vh;color:inherit;
box-shadow:0 24px 60px rgba(16,24,40,.28);}
.detail-help-modal[open]{display:flex;flex-direction:column;}
.detail-help-modal::backdrop{background:rgba(16,24,40,.45);}
.detail-help-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;
border-bottom:1px solid var(--em-line);}
.detail-help-head h3{margin:0;font-size:17px;font-weight:700;}
.detail-help-x{background:none;border:0;font-size:26px;line-height:1;cursor:pointer;color:#6b7280;padding:0 4px;}
.detail-help-modal>p{margin:14px 20px 0;}
.detail-help-form{display:flex;flex-direction:column;gap:12px;padding:14px 20px 20px;overflow:auto;}
.detail-help-form label{display:flex;flex-direction:column;gap:5px;font-size:13.5px;color:#4b5563;}
.detail-help-form input,.detail-help-form textarea{border:1px solid var(--em-line);border-radius:8px;padding:10px 12px;
font:inherit;font-size:15px;color:var(--em-ink);}
.detail-help-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media (max-width:520px){.detail-help-row{grid-template-columns:1fr;}}
/* Εγγύηση καλύτερης τιμής — modal, όχι πάνελ μέσα στη σελίδα: κλειστό έμοιαζε
   με κομμάτι της περιγραφής και μπέρδευε. Κρατιέται το κέλυφος του
   .detail-help-modal και μόνο η φόρμα έρχεται από το site.css, που την ξέρει
   ήδη ως αυτόνομο grid δύο στηλών. */
.best-price-modal{width:min(680px,94vw);}
.best-price-modal-body{padding:14px 20px 20px;overflow:auto;}
.best-price-modal-body>p.muted{margin:0;font-size:13.5px;line-height:1.55;}
.best-price-modal-body>.best-price-notice{margin-top:12px;}
.best-price-modal .best-price-form{padding-top:14px;}
.best-price-modal .best-price-field input{min-height:44px;border-radius:8px;}
@media (max-width:560px){.best-price-modal .best-price-form{grid-template-columns:1fr;}
  .best-price-modal .best-price-submit{justify-self:stretch;width:100%;}}
/* Λογαριασμοί κατάθεσης: μονοδιάστημη γραφή, γιατί ο πελάτης τους αντιγράφει
   ψηφίο-ψηφίο και τα ομοιόμορφα πλάτη κάνουν το λάθος ορατό. */
/* Κλειστοί μέχρι να επιλεγεί η κατάθεση: το radio είναι αδερφός του
   .co-option-body, οπότε το άνοιγμα γίνεται χωρίς JavaScript. */
.co-deposit-accounts{display:none;margin-top:8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
font-size:12.5px;line-height:1.8;letter-spacing:.02em;}
.co-option input:checked ~ .co-option-body .co-deposit-accounts{display:block;}
.co-deposit-accounts b{display:block;margin-bottom:6px;font-family:inherit;font-size:12.5px;}
.payments-accounts{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px;
line-height:1.9;letter-spacing:.02em;background:#f6f4f1;border-radius:10px;padding:14px 16px;}

/* Επιβεβαίωση παραγγελίας για προϊόντα που δεν έχει ο προμηθευτής. */
.order-confirm-modal{width:min(520px,94vw);}
.order-confirm-body{padding:16px 20px 20px;overflow:auto;}
.order-confirm-body p{margin:0 0 10px;font-size:14px;line-height:1.6;}
.order-confirm-ask{font-weight:700;color:var(--em-ink);}
.order-confirm-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:16px;}
@media (max-width:420px){.order-confirm-actions{flex-direction:column-reverse;}
  .order-confirm-actions .btn{width:100%;}}

/* το μολυβάκι του διαχειριστή δίπλα στον κωδικό */
.detail-code-edit{display:inline-flex;align-items:center;margin-left:8px;color:#fff;opacity:.85;text-decoration:none;}
.detail-code-edit:hover{opacity:1;color:#fff;}
.detail-stock-pickup{font-style:italic;opacity:.85;}
/* Χρονογραμμή αποστολής (/checkorder). Πιο πρόσφατο πρώτο· η κόκκινη
   κουκκίδα είναι το σημείο που βρίσκεται τώρα το δέμα. */
.track-line{list-style:none;margin:20px auto 0;padding:0 0 0 28px;max-width:520px;position:relative;text-align:left;}
.track-line::before{content:"";position:absolute;left:5px;top:8px;bottom:10px;width:2px;background:var(--em-line);}
.track-step{position:relative;padding:0 0 20px;}
.track-step:last-child{padding-bottom:0;}
.track-step::before{content:"";position:absolute;left:-28px;top:4px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--em-line);box-sizing:border-box;}
.track-step.is-latest::before{background:var(--em-red);border-color:var(--em-red);box-shadow:0 0 0 4px rgba(224,31,38,.15);}
.track-step time{display:block;font-size:12.5px;color:#6b7280;font-variant-numeric:tabular-nums;letter-spacing:.01em;}
.track-step b{display:block;font-size:15px;font-weight:600;color:var(--em-ink);margin-top:1px;}
.track-step.is-latest b{color:var(--em-red);font-weight:700;}
.track-step span{display:block;font-size:12.5px;color:#6b7280;margin-top:1px;}
.track-step span i{font-size:10px;opacity:.7;margin-right:3px;}
.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;}
/* Only the product name may wrap; a price broken across two lines ("39,90" / "€")
   reads as two numbers. */
.co-table td:not(:first-child),.co-table th:not(:first-child){white-space:nowrap;}
.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;}
/* social login buttons (render only when the OAuth keys are configured) */
.auth-social{margin-top:18px;}
.auth-social-divider{display:flex;align-items:center;gap:12px;color:var(--em-muted);font-size:12.5px;margin:0 0 12px;}
.auth-social-divider::before,.auth-social-divider::after{content:"";flex:1;height:1px;background:var(--em-line);}
.auth-social-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:11px 14px;
  border-radius:10px;border:1px solid var(--em-line);background:#fff;color:var(--em-ink);
  font-size:14px;font-weight:700;text-decoration:none;margin-bottom:9px;transition:filter .15s ease;}
.auth-social-btn:hover{filter:brightness(.96);text-decoration:none;}
.auth-social-btn:last-child{margin-bottom:0;}
.auth-social-google i{color:#ea4335;}
.auth-social-facebook{background:#1877f2;border-color:#1877f2;color:#fff;}
.auth-social-facebook:hover{color:#fff;}
.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);}
  /* Τηλέφωνο, με τη σειρά που χρησιμοποιείται:
     Διαθέσιμα | Προσφορές → εύρος τιμής → Επιλογή μοντέλου → Επιπλέον φίλτρα.
     Η ταξινόμηση φεύγει από τη μπάρα — το js τη βάζει πρώτη στο συρτάρι. */
  /* display:contents lifts the toggles out of their own form box so they and
     the price slider share the bar's flex lines; the form still submits. */
  .catalog-quick-toggle-form{display:contents;}
  /* Δύο μισά κουτιά σε μία σειρά αντί για δύο ολόκληρες σειρές:
     κερδίζουμε ~70px ύψος πριν φανεί το πρώτο προϊόν. */
  .catalog-toggle-row{flex:1 1 calc(50% - 7px);min-width:0;padding:10px 12px;gap:8px;}
  .catalog-toggle-copy strong{font-size:13.5px;}
  .catalog-toggle-switch{width:38px;height:21px;}
  .catalog-toggle-switch em::after{width:16px;height:16px;top:2.5px;}
  .catalog-toggle-switch input:checked+em::after{transform:translateX(17px);}
  .catalog-price-filter{flex:1 1 100%;min-width:0;order:5;}
  .catalog-model-slot{flex:1 1 100%;min-width:0;order:6;}
  .catalog-model-hero-slot{flex:1 1 100%;min-width:0;order:6;}
  .catalog-mobile-actions{flex:1 1 100%;order:7;}
  .catalog-filter-bar>.catalog-sort-form{display:none;}
  .catalog-results-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  /* Phone home: the slider scales with the screen instead of being cropped —
     the active slide sizes the box (the others stay absolute for the fade), so
     the banner keeps its own proportions like the legacy site. */
  .legacy-home-hero-main,.legacy-home-slides{min-height:0;height:auto;}
  .legacy-home-slide.active{position:relative;inset:auto;}
  .legacy-home-slide img{height:auto;object-fit:contain;}
  .legacy-home-slide-nav{width:32px;height:32px;font-size:15px;}
  /* the finder title and its fields belong together: one column, no gutter */
  .home-finder-panel{grid-template-columns:minmax(0,1fr);gap:0;padding:16px 16px 18px;}
  .home-finder-head{grid-template-columns:minmax(0,1fr);gap:2px;margin-bottom:10px;}
  .home-finder-head h2{white-space:normal;font-size:23px;}
  /* the numbered counter tiles are desktop furniture — off on a phone */
  .home-stats{display:none;}
  .home-finder-head span{display:none;}
  .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-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}

/* chosen size / colour on a cart or order line */
.cart-variant{display:block;margin-top:3px;font-size:12.5px;color:#6b7280;font-weight:600}
.detail-buy-options{display:flex;gap:12px;flex-wrap:wrap;width:100%;margin-bottom:4px}
.detail-buy-option{display:flex;flex-direction:column;gap:5px;flex:1 1 150px;min-width:0}
.detail-buy-option>span{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#6b7280}
.detail-buy-option select{border:1px solid #d8dce2;border-radius:10px;padding:10px 12px;font:inherit;font-weight:600;background:#fff}
.detail-variant-warning{flex:1 1 100%;background:#fff6e5;border:1px solid #f0dcb4;color:#8a5b00;border-radius:10px;
  padding:10px 13px;font-size:13.5px;font-weight:600;margin-bottom:4px}

/* handover to the bank */
.co-card-redirect{text-align:center;max-width:620px;margin:0 auto}
.co-card-redirect .btn{margin-top:14px}
.co-test-badge{display:inline-block;margin-left:6px;padding:2px 9px;border-radius:999px;background:#fff6e5;
  border:1px solid #f0dcb4;color:#8a5b00;font-size:12.5px;font-weight:700}
/* Deliberately not flex: the bare text runs around <strong> each became their
   own flex item, and a flex item will not shrink below its longest word. The
   customer's email is one unbreakable word, so on a phone the row could not fit,
   pushed the email out of sight and widened the whole document — which is what
   cut the order table and the totals off at the right edge. */
.co-placed{display:block;color:#1f7a3f;font-weight:600;margin:10px 0 0;line-height:1.5;overflow-wrap:break-word}
.co-placed i{margin-right:8px}

/* header: sign out, on the corner of the account box */
.legacy-tool-account{position:relative;display:flex}
.legacy-logout-form{position:absolute;top:-7px;right:-7px;margin:0;z-index:3}
.legacy-logout-btn{width:26px;height:26px;border-radius:50%;border:2px solid #000;background:var(--em-red,#d40000);
  color:#fff;font-size:11px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;
  padding:0;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.legacy-logout-btn:hover{background:#a80f0f}

/* ΑΦΜ lookup feedback on the checkout invoice block */
.co-vat-status{grid-column:1/-1;margin:2px 0 0;font-size:13px;color:#6b7280;line-height:1.5}
.co-vat-status.is-busy{color:#8a6d1f}
.co-vat-status.is-ok{color:#1f7a3f;font-weight:600}
.co-vat-status.is-bad{color:#b3131b}
.co-pp-status{margin:10px 0;padding:10px 13px;border-radius:10px;background:#f4f5f7;font-size:14px}
.co-pp-status.is-bad{background:#fdecec;color:#b3131b}
.co-pp-card{margin-top:14px;text-align:left}
.co-pp-row{display:flex;gap:12px}
.co-pp-field{flex:1 1 auto;margin-bottom:10px}
.co-pp-field label{display:block;font-size:12px;font-weight:700;color:#6b7280;margin-bottom:4px}
/* The host of a PayPal CardFields iframe must not be styled as an input.
   PayPal renders its own bordered field inside, 78px tall, so a 44px bordered
   box here drew a second frame and overflowed by 34px — on a phone the CVV
   ended up under the pay button. The host is now a plain block and PayPal's
   field is the visible control; its typography is set from the SDK. */
.co-pp-field>div{border:0;padding:0;height:auto;min-height:44px}
/* .catalog-page-title is an inline-block elsewhere, so it shrink-wraps to the
   text and text-align:center then centres inside a 180px box — which looks
   exactly like no centring at all. Force a full-width block on this page. */
.co-card-redirect h1.catalog-page-title{display:block;width:100%;text-align:center;justify-self:stretch}
.co-card-redirect .co-pp-card>button{width:100%;margin-top:6px}
@media (max-width:575px){.co-pp-row{gap:10px}}
/* list tiles whose product needs a size picked first */
.catalog-product-card .pc-choose{display:flex;align-items:center;justify-content:center;gap:7px;grid-column:1 / -1;text-decoration:none;}
.compat-universal{display:flex;align-items:center;gap:9px;margin:14px 0 0;padding:13px 16px;border:1px solid #e2e5ea;border-radius:10px;background:#f7f9fb;font-size:15px;font-weight:700;color:#2c313a;}
.compat-universal i{color:var(--em-red);}

/* Cookie consent — nothing loads until this is answered */
.em-consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:9000;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;max-width:960px;margin:0 auto;padding:16px 20px;background:#fff;border:1px solid #e2e5ea;border-radius:14px;box-shadow:0 18px 44px rgba(16,18,22,.22);}
.em-consent[hidden]{display:none;}
.em-consent-text{flex:1 1 380px;min-width:0;font-size:13.5px;line-height:1.5;color:#3a4048;}
.em-consent-text strong{display:block;font-size:15px;color:#1d2026;margin-bottom:3px;}
.em-consent-text a{color:var(--em-red);font-weight:700;}
.em-consent-actions{display:flex;gap:10px;flex:0 0 auto;}
.em-consent button{border:1px solid #d6dae0;border-radius:9px;padding:10px 16px;font-size:13.5px;font-weight:700;cursor:pointer;background:#fff;color:#3a4048;}
.em-consent-yes{background:var(--em-red)!important;border-color:var(--em-red)!important;color:#fff!important;}
.em-consent-yes:hover{background:var(--em-red-dark)!important;}
.em-recaptcha{margin:6px 0 2px;}
@media (max-width:575px){.em-consent{left:8px;right:8px;bottom:8px;padding:14px}.em-consent-actions{width:100%}.em-consent button{flex:1 1 0}}
/* «πρόσθεσε ακόμη X€ για δωρεάν μεταφορικά» */
/* One line: icon and phrase side by side, never wrapping. */
.cart-freeship{display:inline-flex;align-items:center;gap:9px;flex-wrap:nowrap;white-space:nowrap;margin:10px 0 0;padding:10px 14px;border:1px solid #ffe0a3;border-radius:10px;background:#fff8e5;font-size:14px;color:#5c4708;text-align:left;}
.cart-freeship i{flex:0 0 auto;}
.cart-freeship > span{flex:0 1 auto;}
.cart-freeship i{color:#d08700;}
.cart-freeship.is-done{border-color:#b7e4c7;background:#eefaf1;color:#1a5c34;}
.cart-freeship.is-done i{color:#1a7f37;}
.cart-freeship-bar{flex:1 1 100%;height:6px;border-radius:99px;background:#f0e2bd;overflow:hidden;}
.cart-freeship-bar > span{display:block;height:100%;border-radius:99px;background:#d08700;}
/* τίτλος καλαθιού αριστερά, προτροπή δωρεάν μεταφορικών απέναντι */
.cart-head{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.cart-head > h1{margin:0;}
.cart-head .cart-freeship{margin:0;flex:0 0 auto;}
/* Only on a narrow phone is the line allowed to wrap, rather than overflow. */
@media (max-width:767px){.cart-head .cart-freeship{flex:1 1 100%;white-space:normal;}}
/* Free-shipping badge στην πάνω γωνία του τίτλου του checkout.
   Στο κινητό μένει το εικονίδιο με μία λέξη — ο τίτλος δεν σπάει. */
.co-freeship-sup{display:none;align-items:center;gap:6px;margin-left:10px;padding:4px 11px;
  border:1px solid #ffe0a3;border-radius:999px;background:#fff8e5;color:#5c4708;
  font-size:11.5px;font-weight:700;line-height:1.5;white-space:nowrap;vertical-align:super;}
.co-freeship-sup:not([hidden]){display:inline-flex;}
.co-freeship-sup i{color:#d08700;font-size:12px;}
.co-freeship-sup.is-done{border-color:#b7e4c7;background:#eefaf1;color:#1a5c34;}
.co-freeship-sup.is-done i{color:#1a7f37;}
.co-freeship-sup .fs-short{display:none;}
@media (max-width:640px){
  .co-freeship-sup{margin-left:8px;padding:3px 9px;font-size:11px;}
  .co-freeship-sup .fs-long{display:none;}
  .co-freeship-sup .fs-short{display:inline;}
}

/* --- Σύνοψη παραγγελίας: στην κορυφή και διπλωμένη στο κινητό --- */
.co-summary-toggle{display:none;}
/* The summary deliberately stays LAST on a phone. Shipping cost and the payment
   surcharge only settle once the courier and the payment method are chosen, so a
   total shown above the form would be a number the customer cannot yet trust.
   It sits directly above the terms checkbox and the submit button, which is the
   moment the figures are final and worth reading. */
@media (max-width:991px){
  .co-grid{display:flex;flex-direction:column;}
  .co-side{order:0;}
  .co-summary-toggle{display:none;}
  .co-summary > h2{display:block;}
  .co-summary-body{display:block;}
}

/* --- Καλάθι --- */
.cart-table{display:flex;flex-direction:column;gap:12px;margin:18px 0;}
.cart-row{display:grid;grid-template-columns:64px 1fr auto auto auto auto;gap:14px;align-items:center;
  border:1px solid var(--em-line);border-radius:14px;padding:10px 14px;}
.cart-cell-img{width:64px;height:64px;object-fit:contain;background:#f4f2ee;border-radius:8px;}
.cart-cell-name a{font-weight:600;}
.cart-cell-qty,.cart-cell-del{margin:0;}
.cart-cell-total{font-weight:700;min-width:84px;text-align:right;}

/* On a phone the six desktop columns crushed the product name into a 71px
   ribbon that wrapped over eight lines. The row takes the shape of the checkout
   summary instead — small picture, name with the line total beside it, and the
   unit price, quantity and bin on a quieter second line. */
@media (max-width:767px){
  .cart-row{
    grid-template-columns:56px minmax(0,1fr) auto auto;
    grid-template-areas:"img name name total" "img price qty del";
    gap:4px 10px;align-items:center;padding:10px 12px;
  }
  .cart-cell-img{grid-area:img;width:56px;height:56px;align-self:start;}
  .cart-cell-name{grid-area:name;align-self:start;font-size:13.5px;line-height:1.35;}
  .cart-cell-name a{font-weight:600;}
  .cart-cell-total{grid-area:total;align-self:start;min-width:0;font-size:14px;white-space:nowrap;}
  .cart-cell-price{grid-area:price;font-size:12.5px;color:var(--em-muted);justify-self:start;}
  .cart-cell-qty{grid-area:qty;justify-self:end;}
  .cart-cell-qty .qty-input{width:52px;height:32px;padding:2px 6px;font-size:13.5px;text-align:center;}
  .cart-cell-del{grid-area:del;justify-self:end;}
  .cart-cell-del .btn{padding:5px 9px;font-size:12.5px;}
  .cart-variant{display:block;color:var(--em-muted);font-size:12px;}
}

.cart-foot{display:flex;justify-content:space-between;align-items:flex-end;border-top:2px solid var(--em-line);padding-top:16px;flex-wrap:wrap;gap:16px;}
.cart-foot-right{text-align:right;}
.cart-foot-total{font-size:22px;}
.cart-foot-go{margin-top:10px;}

/* Full-width actions on a phone: a thumb reaches an edge-to-edge button far
   more reliably than a 190px one floating in the middle of the row. */
@media (max-width:767px){
  .cart-foot{flex-direction:column-reverse;align-items:stretch;gap:12px;}
  .cart-foot-right{text-align:center;}
  .cart-foot-total{font-size:20px;}
  .cart-foot-go{margin-top:12px;}
  .cart-foot .btn,
  .cart-foot-go .btn{width:100%;justify-content:center;padding-top:13px;padding-bottom:13px;}
  .co-submit{width:100%;justify-content:center;}

  /* Everything in this column is centred on a phone: with edge-to-edge buttons
     a left-aligned caption above them reads as misaligned. */
  .cart-express{width:100%;text-align:center;}
  #cart-express-button{max-width:none;}
  .cart-express-head{justify-content:center;}
  .cart-express-note{text-align:center;}
  .cart-express-phone{max-width:none;margin-left:auto;margin-right:auto;}
  .cart-express-phone span{text-align:center;}
  .cart-express-phone input{text-align:center;}
  .cart-express-phone small{text-align:center;}
  .cart-express-error{text-align:center;}
}

/* Wallet buttons on the payment page */
.co-pp-wallet{margin:0 0 10px;}
.co-pp-wallet[hidden]{display:none;}
.co-pp-applepay-btn{display:block;width:100%;height:46px;border:0;border-radius:8px;cursor:pointer;
  -webkit-appearance:-apple-pay-button;appearance:-apple-pay-button;
  -apple-pay-button-type:plain;-apple-pay-button-style:black;}
.co-pp-wallet .gpay-card-info-container,
.co-pp-wallet button{width:100%!important;}

/* Ο χάρτης της Επικοινωνίας: σταθερή αναλογία, ώστε να μη χοροπηδάει η
   σελίδα όσο φορτώνει το iframe, και γωνίες σαν των υπόλοιπων καρτών. */
.contact-map-frame{position:relative;margin:6px 0 18px;border-radius:12px;overflow:hidden;border:1px solid #e2e2e5;background:#f4f4f5;aspect-ratio:16/9}
.contact-map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@media (max-width:600px){.contact-map-frame{aspect-ratio:4/3}}

/* Σήματα αποδεκτών καρτών (Nexi): footer, τρόποι πληρωμής, βήμα πληρωμής */
.cards-banner{max-width:100%;height:auto;width:340px}
.legacy-footer-cards{margin:22px 0 0}
.legacy-footer-cards .cards-banner{width:100%;max-width:340px}
.co-cards{display:block;margin:10px 0 2px}
.co-cards .cards-banner{width:280px}
/* PayPal: ξεχωριστό σήμα κάτω από τις κάρτες — δεν το περιέχει το banner της Nexi */
.pp-mark{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:7px 13px;line-height:1;
  background:#fff;border:1px solid #e2e2e5;border-radius:8px}
.pp-mark i{font-size:21px;color:#003087}
.pp-mark-txt{font-family:"Roboto Condensed",Manrope,sans-serif;font-size:19px;font-weight:700;color:#003087}
.pp-mark-txt b{color:#009cde;font-weight:700}
/* Το αποδεικτικό: στο χαρτί μένει μόνο η παραγγελία */
@media print{
  .legacy-header,.legacy-topbar,.legacy-footer,.co-print,.legacy-breadcrumbs{display:none!important}
  .section-panel{box-shadow:none;border:0}
}

/* --- Σιωπηλή προσθήκη στο καλάθι: μικρό pop πάνω δεξιά ------------------- */
/* Ανοίγει με dialog.show() (όχι showModal): χωρίς μαύρο φόντο, χωρίς να    */
/* κλειδώνει τη σελίδα — απλά επιβεβαιώνει ότι το προϊόν μπήκε.             */
dialog.ca-pop{
  position:fixed;top:84px;right:18px;left:auto;bottom:auto;margin:0;z-index:9000;
  width:320px;max-width:calc(100vw - 24px);padding:0;border:0;border-radius:12px;
  background:#fff;color:#1b1b1b;box-shadow:0 14px 38px rgba(0,0,0,.22);
  animation:ca-in .18s ease-out
}
dialog.ca-pop::backdrop{background:transparent}
@keyframes ca-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){dialog.ca-pop{animation:none}}
.ca-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid #ececec;
  font-size:14px;background:#f5faf5;border-radius:12px 12px 0 0}
.ca-head i.fa-circle-check{color:#2e9b4f;font-size:16px}
.ca-head strong{font-weight:700;flex:1 1 auto;line-height:1.2}
.ca-x{border:0;background:none;color:#8a8a8a;font-size:15px;line-height:1;cursor:pointer;padding:2px 4px}
.ca-x:hover{color:#1b1b1b}
.ca-body{display:flex;gap:10px;padding:11px 12px;align-items:flex-start}
.ca-img{width:56px;height:56px;object-fit:contain;flex:0 0 56px;background:#fafafa;border:1px solid #eee;border-radius:8px}
.ca-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.ca-name{font-size:13px;line-height:1.3;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ca-opts{font-size:12px;color:#666}
.ca-meta{font-size:13px;color:#c9161d;font-weight:700}
.ca-acts{display:flex;gap:8px;padding:0 12px 12px}
.ca-acts>*{flex:1 1 0;text-align:center;font-size:13px;font-weight:600;border-radius:8px;padding:8px 6px;
  cursor:pointer;text-decoration:none;line-height:1.2}
.ca-cont{border:1px solid #d6d6d6;background:#fff;color:#1b1b1b}
.ca-cont:hover{background:#f3f3f3}
.ca-go{border:1px solid #c9161d;background:#c9161d;color:#fff}
.ca-go:hover{background:#a81117;border-color:#a81117;color:#fff}
@media (max-width:600px){
  dialog.ca-pop{top:auto;bottom:12px;right:12px;left:12px;width:auto}
}

/* --- Live αναζήτηση σε δύο στήλες: μοντέλα | προϊόντα -------------------- */
/* Η κλάση "cols" μπαίνει από το JS μόνο όταν ο server έστειλε ΚΑΙ τα δύο.  */
/* Κάτω από 860px μένει μία στήλη, όπως ήταν.                               */
@media (min-width:860px){
  .live-suggest.cols{right:auto;width:min(740px,92vw)}
  .live-suggest.cols .live-suggest-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .live-suggest.cols .live-suggest-cols .live-suggest-group+.live-suggest-group{
    border-top:0;border-left:1px solid var(--em-line)}
}

/* Επιβεβαίωση παραγγελίας: το κουμπί του αποδεικτικού στη ΣΕΙΡΑ του μηνύματος,
   δεξιά. Έπεφτε από κάτω και έσπρωχνε τη λίστα προϊόντων προς τα κάτω. */
/* «Δείχνουμε 80 από 1.696» κάτω από τη λίστα μοντέλων: λέει ότι η λίστα είναι
   κομμένη και ότι η αναζήτηση φτάνει τα υπόλοιπα. */
.catalog-facet-more{margin:8px 2px 0;font-size:12px;line-height:1.45;color:#726a60}
.catalog-facet-none{margin:10px 2px;font-size:13px;color:#726a60}

.co-placed-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:10px 0 0}
.co-placed-row .co-placed{margin:0;flex:1 1 320px}
.co-placed-row .co-print{margin:0;flex:0 0 auto}
@media (max-width:600px){
  .co-placed-row{align-items:flex-start}
  .co-placed-row .co-print{width:100%}
  .co-placed-row .co-print .legacy-footer-btn{width:100%;justify-content:center}
}