/*
 * Nový dizajn COMCO (COMCO-74), téma nd.
 *
 * Načíta sa len pri téme nd (na DEV predvolene, inde cez ?design=nd), v zlúčenom CSS navrch
 * za bootstrap + style + comco.min + comco-templates (helpers.php comco_combined_css()).
 * Šablóny témy sú v template/nd/ a obsahujú len súbory, ktoré prepisujú template/default.
 *
 * Pozor: v komentároch len typografické úvodzovky („…“). Rovná úvodzovka bez páru zhltne kus
 * zlúčeného CSS, lebo ju _css_minify berie ako začiatok reťazca.
 */

/* ============================================================
   Písma: self-host (SIL OFL 1.1), zdroj Google Fonts, len latin + latin-ext.
   Súbory v template/nd/fonts/, cesta relatívne k tomuto súboru.
   ============================================================ */
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(../fonts/barlow-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(../fonts/barlow-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap;
  src: url(../fonts/barlow-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap;
  src: url(../fonts/barlow-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../fonts/barlow-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../fonts/barlow-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap;
  src: url(../fonts/barlow-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap;
  src: url(../fonts/barlow-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../fonts/barlow-semi-condensed-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../fonts/barlow-semi-condensed-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 700; font-display: swap;
  src: url(../fonts/barlow-semi-condensed-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Semi Condensed'; font-style: normal; font-weight: 700; font-display: swap;
  src: url(../fonts/barlow-semi-condensed-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(../fonts/ibm-plex-mono-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(../fonts/ibm-plex-mono-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url(../fonts/ibm-plex-mono-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap;
  src: url(../fonts/ibm-plex-mono-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../fonts/ibm-plex-mono-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(../fonts/ibm-plex-mono-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ============================================================
   Tokeny z prototypu (css/styles.css). Prefix --nd-, lebo comco.css
   má vlastné --muted a --info.
   ============================================================ */
:root {
  --nd-accent: #f2b71e;        /* zlatá COMCO */
  --nd-accent-deep: #e0a50c;   /* hover na zlatej ploche */
  --nd-accent-ink: #9a6800;    /* zlatý text na svetlom */
  --nd-accent-soft: #fdf4d8;
  --nd-on-accent: #2b2d2f;     /* text na zlatej ploche */

  --nd-ink: #26282b;
  --nd-ink-2: #3c3f44;
  --nd-muted: #6b7178;
  --nd-muted-2: #9aa0a8;
  --nd-line: #e4e6e9;
  --nd-line-2: #eef0f2;
  --nd-surface: #ffffff;
  --nd-surface-2: #f6f7f8;
  --nd-surface-3: #ebedef;
  --nd-dark: #15171a;          /* hlavička, pätička */
  --nd-dark-2: #26282b;

  --nd-ok: #1b8f4d;            /* skladom */
  --nd-ok-soft: #e8f5ee;
  --nd-warn: #c9700d;          /* málo kusov */
  --nd-warn-soft: #fdf2e3;
  --nd-info: #1763c9;          /* VIN, sedí na auto */
  --nd-info-soft: #e9f1fc;
  --nd-danger: #c8322b;        /* vypredane, nedostupne */
  --nd-danger-soft: #fdecea;

  --nd-font-display: "Barlow Semi Condensed", "Arial Narrow", sans-serif;
  --nd-font-body: "Barlow", system-ui, sans-serif;
  --nd-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --nd-r-sm: 4px;
  --nd-r: 6px;
  --nd-r-lg: 10px;
  --nd-r-pill: 999px;
  --nd-shadow-sm: 0 1px 2px rgba(20,24,29,.06), 0 1px 1px rgba(20,24,29,.04);
  --nd-shadow: 0 4px 14px rgba(20,24,29,.08);
  --nd-shadow-lg: 0 14px 40px rgba(20,24,29,.16);

  --nd-maxw: 1280px;

  /* velkosti pisma pod 16 px: na desktope presne tato hodnota, na mobile o 1,5 px vacsia (nizsie) */
  --nd-fs-10-5: 10.5px;
  --nd-fs-11: 11px;
  --nd-fs-11-5: 11.5px;
  --nd-fs-12: 12px;
  --nd-fs-12-5: 12.5px;
  --nd-fs-13: 13px;
  --nd-fs-13-5: 13.5px;
  --nd-fs-14: 14px;
  --nd-fs-14-5: 14.5px;
  --nd-fs-15: 15px;
}

/* mobil: vsetko pismo pod 16 px o 1,5 px vacsie, zaklad 15 -> 16 px (Stefan 06.10.2026: na mobile je vsade male) */
@media (max-width: 767px) {
  :root {
    --nd-fs-10-5: 12px;
    --nd-fs-11: 12.5px;
    --nd-fs-11-5: 13px;
    --nd-fs-12: 13.5px;
    --nd-fs-12-5: 14px;
    --nd-fs-13: 14.5px;
    --nd-fs-13-5: 15px;
    --nd-fs-14: 15.5px;
    --nd-fs-14-5: 16px;
    --nd-fs-15: 16px;
  }
  /* texty s pevnou velkostou zo stareho CSS */
  .nd-footer__legal p { font-size: inherit; }
  body.nd .ntf-on .ntf-bar-hint { font-size: 12.5px; }
}

/* ============================================================
   Základ: písmo 15 px, na mobile 16 px cez --nd-fs-* (rozhodnutie 06.10.2026), nadpisy Barlow Semi Condensed.
   ============================================================ */
body.nd {
  font-family: var(--nd-font-body);
  font-size: var(--nd-fs-15);
  line-height: 1.5;
  color: var(--nd-ink);
  -webkit-font-smoothing: antialiased;
  background: var(--nd-surface-2);   /* pozadie stranky ako prototyp (styles.css body: var(--surface-2)) */
  text-rendering: optimizeLegibility;
}
body.nd h1, body.nd h2, body.nd h3, body.nd h4, body.nd h5 {
  font-family: var(--nd-font-display);
  font-weight: 700;
  letter-spacing: -0.01em;
}
body.nd input, body.nd select, body.nd textarea, body.nd button {
  font-family: inherit;
}
/* bezny text (07.10.2026, Stefan: 14 px je malo): stare CSS dava p 12 px a .container p / .mainContainer ul 14 px,
   v nd beru velkost bloku, v ktorom su - v obsahu zaklad 15 px (mobil 16). Stitky, kody a pata maju vlastne pravidla. */
body.nd p, body.nd .container p, body.nd .mainContainer ul { font-size: inherit; }

/* ============================================================
   Rám: šírka obsahu ako Bootstrap .container (hlavička lícuje s obsahom stránok)
   ============================================================ */
.nd-wrap { margin: 0 auto; padding: 0 15px; }
@media (min-width: 768px) { .nd-wrap { width: 750px; } }
@media (min-width: 992px) { .nd-wrap { width: 970px; } }
@media (min-width: 1200px) { .nd-wrap { width: 1170px; } }
/* Pod 768 px je .container na celú šírku ako .nd-wrap aj od 480 px (style.css mu dáva pevných 450 px: hero aj obsah
   mali 420 px v strede okna, hlavička celú šírku; napr. pás značiek na titulke pri 767 px; 15.10.2026) */
@media (min-width: 480px) and (max-width: 767px) { body.nd .container { width: 100%; } }

.nd-ico { flex-shrink: 0; display: block; }

/* ============================================================
   Paleta starého obsahu: žltá #ffe41a a jej odtiene na akcent nd.
   GENEROVANÉ skriptom build/nd_palette.py z kópií nd v base/ (style.css, comco.css, comco-templates.css),
   ručne needitovať. Po zmene farieb v base/ ho spusti znova (--check povie, či treba).
   Selektory sú rovnaké ako v origináli, vyhrávajú len poradím; pravidlá nižšie ich môžu prebiť.
   ============================================================ */
/* nd-palette:start */
.searchBox .input-group .form-control:focus{border-color:var(--nd-accent)}
.searchBox .input-group .input-group-addon{background-color:var(--nd-accent)}
.searchBox .input-group .input-group-addon{border-color:var(--nd-accent)}
.top-right .cart-dropdown a{background-color:var(--nd-accent)}
.cart-dropdown a{background-color:var(--nd-accent)}
.top-right .cart-dropdown a:hover{background-color:var(--nd-accent)}
.cart-dropdown a:hover{background-color:var(--nd-accent)}
.top-right .cart-dropdown ul.dropdown-menu{background-color:var(--nd-accent)}
.cart-dropdown ul.dropdown-menu{background-color:var(--nd-accent)}
.navbar-default .navbar-header .navbar-toggle{background-color:var(--nd-accent)}
.navbar-default .navbar-collapse li a:hover{color:var(--nd-accent)}
.navbar-default .navbar-collapse li a.focus{color:var(--nd-accent)}
.navbar-default .navbar-collapse li a:focus{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.dropdown .dropdown-menu li a:hover{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.active a{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.active a:focus{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.active a:hover{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.active.dropdown .dropdown-menu li a{color:#252525}
.navbar-default .navbar-collapse li.active.dropdown .dropdown-menu li a:hover{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.dropdown.open a:hover{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.dropdown.open a.focus{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.dropdown.open a:focus{color:var(--nd-accent)}
.navbar-default .navbar-collapse li.dropdown .dropdown-menu li.active a{color:var(--nd-accent)}
.navbar-default .navbar-nav>.open>a{background-color:transparent}
.navbar-default .navbar-nav>.open>a{color:var(--nd-accent)}
.navbar-default .navbar-nav>.open>a:focus{color:var(--nd-accent)}
.navbar-default .navbar-nav>.open>a:hover{color:var(--nd-accent)}
@media(min-width:992px){
.navTop-middle .searchBox .input-group .form-control{border-left-color:transparent}
}
.navTop .cart-dropdown>a{background-color:transparent}
.navTop .cart-dropdown>a:hover{background-color:transparent}
.navTop .cart-dropdown>a i{background-color:var(--nd-accent)}
.nav-category{background-color:var(--nd-accent)}
.nav-category button .icon-bar{background-color:#fff}
.nav-category .dropdown-menu li a:hover{color:var(--nd-accent)}
.nav-category .dropdown-menu li a:hover i{color:var(--nd-accent)}
.nav-category .dropdown-menu li.active a{color:var(--nd-accent)}
.bannerV3 .btn{border:3px solid var(--nd-accent)}
.bannerV3 .btn i{color:var(--nd-accent)}
.bannerV3 .btn:hover{background-color:var(--nd-accent)}
.box i{color:var(--nd-accent)}
.version2 .box:hover{border:5px solid var(--nd-accent)}
.footer{border-top:8px solid var(--nd-accent)}
.footer .newsletter .input-group .form-control{border:0}
.footer .newsletter .input-group .input-group-addon{border:3px solid var(--nd-accent)}
.footer .newsletter .input-group .input-group-addon i{color:var(--nd-accent)}
.footer .newsletter .input-group .input-group-addon:hover{background-color:var(--nd-accent)}
.footer .newsletter .input-group .input-group-addon:hover{border-color:var(--nd-accent)}
.footer.version2 .footerLink .list-inline li a{color:#8d8d8d}
.footer.version2 .newsletter .input-group .input-group-addon{background-color:#e9e9e9}
.footer.version2 .newsletter .input-group .input-group-addon:hover{background-color:var(--nd-accent)}
.footer.version2 .newsletter .input-group .input-group-addon:hover{border-color:var(--nd-accent)}
.copyRight.version2 p a:hover{color:var(--nd-accent)}
.form-body .panel .panel-body .btn-primary{background-color:var(--nd-accent)}
.logIn .panel .panel-body .btn-primary{background-color:var(--nd-accent)}
#login .modal-dialog .modal-content .modal-body .btn-primary{background-color:var(--nd-accent)}
.form-body .panel .panel-body .btn-link{color:var(--nd-accent)}
.logIn .panel .panel-body .btn-link{color:var(--nd-accent)}
#login .modal-dialog .modal-content .modal-body .btn-link{color:var(--nd-accent)}
.form-body .panel .panel-heading{background-color:var(--nd-accent)}
.logIn .panel .panel-heading{background-color:var(--nd-accent)}
#login .modal-dialog .modal-content .modal-header{background-color:var(--nd-accent)}
.sideBar .panel .panel-heading{background-color:var(--nd-accent)}
.sideBar .input-group .input-group-addon{border:0}
.productListSingle .media .media-body .btn-group .btn-default:hover{background-color:var(--nd-accent)}
.productListSingle .media .media-body .btn-group .btn-default:focus{background-color:var(--nd-accent)}
.productListSingle .media .media-body .btn-group .btn-default:hover{border-color:var(--nd-accent)}
.productListSingle .media .media-body .btn-group .btn-default:focus{border-color:var(--nd-accent)}
.productListSingle .media:hover h3{color:var(--nd-accent)}
.singleProduct .media .media-body .list-inline li a{color:#b4b4b4}
.singleProduct .media .media-body .tabArea .nav-tabs li a{color:#b4b4b4}
.sideBar .input-group .input-group-addon{background-color:transparent}
.sideBar .input-group .input-group-addon{border-color:#bfbfbf}
.progress-wizard .progress-wizard-step .progress-wizard-dot{background:var(--nd-accent)}
.progress-wizard .progress-wizard-step .progress .progress-bar{background:var(--nd-accent)}
.userProfile .btn-group a{background-color:#f0f0f0}
.userProfile .btn-group a:hover{background-color:var(--nd-accent)}
.userProfile .btn-group a.active{background-color:var(--nd-accent)}
.userProfile .btn-group a:hover{color:#fff}
.userProfile .btn-group a.active{color:#fff}
.navbar-default .navbar-collapse li.dropdown .dropdown-menu li a:hover{background-color:var(--nd-accent)}
.navbar-default .navbar-collapse li.dropdown .dropdown-menu li a:hover{color:#fff}
.navbar-collapse li.dropdown.open .dropdown-toggle{background-color:var(--nd-accent)!important}
.navbar-default .navbar-collapse li.dropdown a:hover{background-color:var(--nd-accent)!important}
.navbar-default .navbar-collapse li.dropdown:hover{background-color:var(--nd-accent)!important}
#main-menu-place li a:hover{background-color:var(--nd-accent)}
.nav-category .dropdown-menu li a:hover{background-color:var(--nd-accent)}
.nav-category .dropdown-menu li.active a{background-color:var(--nd-accent)}
.nav-category .dropdown-menu li a:hover{color:#000}
.nav-category .dropdown-menu li.active a{color:#000}
.button.buy{border:1px solid var(--nd-accent)}
.button.buy{background:var(--nd-accent)}
.sideBar .btn-primary{background-color:var(--nd-accent)}
.ad_top_tabs a:hover{background-color:#ddd}
.ad_top_tabs_big a{background-color:#f5f5f5}
.ad_top_tabs_big a:hover{background-color:#dfdfdf}
.ordersummary .basket tfoot{background-color:#f5f5f5}
.ad-model-ul li:hover{background-color:#efefef}
.ad-type-ul li:hover{background-color:#efefef}
.ad-catbox .ad-catbox-inner{background:-moz-linear-gradient(top,#f5f5f5 73%,var(--nd-accent) 100%)}
.ad-catbox .ad-catbox-inner{background:-webkit-linear-gradient(top,#f5f5f5 73%,var(--nd-accent) 100%)}
.ad-catbox .ad-catbox-inner{background:linear-gradient(to bottom,#f5f5f5 73%,var(--nd-accent) 100%)}
.ad-catbox .ad-catbox-inner:hover{background:-moz-linear-gradient(top,#f5f5f5 29%,var(--nd-accent) 100%)}
.ad-catbox .ad-catbox-inner:hover{background:-webkit-linear-gradient(top,#f5f5f5 29%,var(--nd-accent) 100%)}
.ad-catbox .ad-catbox-inner:hover{background:linear-gradient(to bottom,#f5f5f5 29%,var(--nd-accent) 100%)}
.ad-filter-man div:hover{border:1px solid var(--nd-accent-deep)!important}
.ad-filter-checked div{border:1px solid var(--nd-accent-deep)!important}
.ad-detail-use h4:hover{background-color:#f5f5f5}
.ad-detail-oe a{color:var(--nd-accent)}
.ad-detail-replace a{color:var(--nd-accent)}
.ad-product-info a{color:var(--nd-accent)}
p a{color:var(--nd-accent)}
.tabArea .nav-tabs li a:hover{color:#252525}
.tabArea .nav-tabs li a:hover{background-color:transparent}
.tabArea .nav-tabs li.active a{color:#252525}
.ad-product-info a:hover{color:var(--nd-accent)}
.btn-primary{background-color:var(--nd-accent)!important}
.btn-primary:hover{background-color:var(--nd-accent)!important}
.btn-primary{border:1px solid var(--nd-accent)!important}
.btn-primary:hover{border:1px solid var(--nd-accent)!important}
.ad-product-manufacturer a{color:#000}
.ad-product-manufacturer a:hover{color:#000}
.ajaxbasket-bubble .ajaxbasket-content i{color:green}
.ajaxbasket-bubble .ajaxbasket-footer a{color:green}
.ajaxbasket-bubble .ajaxbasket-footer a:hover{color:green}
#vinbox-body a:hover{background-color:var(--nd-accent)}
.faq_question .question.selected{background-color:var(--nd-accent)}
.pagegallery .text_col.focus{background-color:var(--nd-accent)}
.pagegallery .text_col:hover{background-color:var(--nd-accent)}
.pagination .active{background-color:var(--nd-accent)}
.pagination li a:hover{background-color:var(--nd-accent)}
.category-filter .btn{border:1px solid #fff}
.basket .error p{background-color:red}
.pagination .active{border:1px solid var(--nd-accent)}
.newsletter.button{border:1px solid #ccc}
.watchdog.button{border:1px solid #ccc}
.newsletter.button{background-color:#f5f5f5}
.watchdog.button{background-color:#f5f5f5}
.contact-form-left a{color:#000}
.ordersummary h4{background-color:var(--nd-accent)}
.customer-orders .title{background-color:var(--nd-accent)}
.customer-orders.title{background-color:var(--nd-accent)}
.login_register_href a{color:#000}
.vin_bubble{background-color:var(--nd-accent)}
.login-error p a.login-error-recover{background-color:var(--nd-accent)}
.login-error p a.login-error-recover:hover{background-color:var(--nd-accent)}
.login-error p a.login-error-recover:focus{background-color:var(--nd-accent)}
.login-error p a.login-error-recover:hover{background-color:#e6b720}
.catbox ul li a{background:-moz-linear-gradient(top,#fafafa 30%,#fefefe 82%,var(--nd-accent) 100%)}
.catbox ul li a{background:-webkit-linear-gradient(top,#fafafa 30%,#fefefe 82%,var(--nd-accent) 100%)}
.catbox ul li a{background:linear-gradient(to bottom,#fafafa 30%,#fefefe 82%,var(--nd-accent) 100%)}
.catbox ul li a:hover{background:-moz-linear-gradient(top,#fafafa 10%,#fefefe 20%,var(--nd-accent) 100%)}
.catbox ul li a:hover{background:-webkit-linear-gradient(top,#fafafa 10%,#fefefe 20%,var(--nd-accent) 100%)}
.catbox ul li a:hover{background:linear-gradient(to bottom,#fafafa 10%,#fefefe 20%,var(--nd-accent) 100%)}
.copyRight a:hover{color:#fff}
#search_expand_button{background-color:var(--nd-accent)}
.ad_top_tabs a{background-color:#fff}
.main_page_form .ad_top_tabs .active{background-color:var(--nd-accent)!important}
.orders_a:hover{background-color:var(--nd-accent)}
.header_links a:hover{color:#fff}
.vin_code_group .title{background-color:var(--nd-accent)}
.login_register_box .btn-register:focus{color:var(--nd-accent)}
.login_register_box .btn-register:hover{color:var(--nd-accent)}
.bp-btn-minimizer{background-color:var(--nd-accent)}
.bp-button{background-color:var(--nd-accent)}
.progress-wizard .active{background:var(--nd-accent)}
.ad-cs-modal{border-top:3px solid var(--nd-accent-deep)}
.ad-cs-modal .ad-cs-added-img img{background:#fff}
.ad-cs-modal .ad-cs-basket{background:var(--nd-accent)}
.ad-cs-modal .ad-cs-sec{border-bottom:2px solid var(--nd-accent)}
.ad-cs-modal .ad-cs-item-img img{background:#fff}
.ad-cs-modal .ad-cs-add{border:1px solid var(--nd-accent)}
.ad-cs-modal .ad-cs-add{background:var(--nd-accent)}
.fitment-mfr.open>.fitment-head{background:var(--nd-accent)}
.fitment-model.open>.fitment-head{background:#fafafa}
@media(max-width:767px){
.ad-detail-use ul.fitment-types .ad-type-name{color:#252525}
.ad-detail-use ul.fitment-types .ad-type-year{color:#888}
.ad-detail-use ul.fitment-types .ad-type-kw{color:#333}
.ad-detail-use ul.fitment-types .ad-type-hp{color:#333}
.ad-detail-use ul.fitment-types .ad-type-ccm{color:#333}
.ad-detail-use ul.fitment-types .ad-type-code{color:#888}
}
.ad-detail-oe .oe-num>a{color:#252525}
.ad-detail-oe .oe-num>a:hover{color:#000}
.ad-detail-oe .oe-num>a:hover{background:var(--nd-accent)}
.ad-detail-oe .oe-alt a{color:#888}
.ad-detail-oe .oe-alt a:hover{color:#000}
a.ad-pack-row{color:#000}
a.ad-pack-row:hover{color:#000}
a.ad-pack-row:focus{color:#000}
a.ad-pack-row:hover{background:var(--nd-accent)}
a.ad-pack-row:focus{background:var(--nd-accent)}
.shortdesc .slider-button a.btn:hover{color:var(--nd-accent)!important}
.shortdesc .slider-button a.btn:focus-visible{color:var(--nd-accent)!important}
.shortdesc .slider-button a.btn:focus-visible{outline:3px solid var(--nd-accent)}
.shortdesc .slider-button a.btn:focus-visible{outline-offset:3px}
.features.version2 .box{border:1px solid #e3e3e3}
.features.version2 .box{border-top:4px solid var(--nd-accent)}
.features.version2 .box:hover{border-top:4px solid var(--nd-accent)}
.features.version2 .box i{background:var(--nd-accent)}
.features.version2 .box i{color:#111}
.model-cats li a:hover{background:#fff8e1}
.search-suggest__availability .ad-delivery-box .ad-de-stock b{color:#222}
body.b2b-customer .search-suggest__price-novat{color:green}
body.b2b-customer .search-suggest__price-vat{color:#666}
html.search-modal-open #searchBox{background:#f2f3f5}
html.search-modal-open #searchBox .input-group-addon{background:var(--nd-accent)}
html.search-modal-open #search-suggest{background:#fff}
html.search-modal-open #search-suggest .search-suggest__more{background:var(--nd-accent)!important}
a.search-modal__recent-item{color:#1d1f22}
a.search-modal__recent-item:hover{color:#1d1f22}
a.search-modal__recent-item:focus{color:#1d1f22}
a.search-modal__recent-item:active{background:#f6f7f8}
.search-modal__example:active{border-color:var(--nd-accent)}
a.car-bar__name{color:#26282b}
a.car-bar__name:hover{color:#26282b}
a.car-bar__name:focus{color:#26282b}
.car-bar__menu a{color:#26282b}
.car-bar__menu a:hover{background:#f6f7f8}
.car-bar__menu a:focus{background:#f6f7f8}
.car-bar__menu a:hover{color:#26282b}
.car-bar__menu a:focus{color:#26282b}
.car-bar__menu a.is-current .fa{color:#1b8f4d}
.car-bar__menu a.car-bar__menu-manage{color:#1763c9}
.car-bar__menu a.car-bar__menu-manage .fa{color:#1763c9}
.bp-load .bp-btn-minimizer{background:var(--nd-accent)}
.ad-delivery-box .ad-de-stock b{color:#222}
.ad-delivery-box a.ad-de-link{color:#8a6d00}
.ad-delivery-box a.ad-de-link:hover{color:#222}
.ad-delivery-box .ad-de-i{background:var(--nd-accent-deep)}
.ad-delivery-box .ad-de-urgency{border-left:3px solid var(--nd-accent-deep)}
.ad-delivery-box .ad-de-urgency b{color:#222}
.ad-delivery-modal{border-top:3px solid var(--nd-accent-deep)}
.ad-delivery-modal .ad-dm-head-ic{color:var(--nd-accent-deep)}
.ad-delivery-modal .ad-dm-prod-img img{background:#fff}
.ad-delivery-modal .ad-dm-alert{border:1px solid var(--nd-accent-deep)}
.ad-delivery-modal .ad-dm-row-when b{color:#1a7a1a}
.ad-delivery-modal .ad-dm-row-when small{color:#999}
.ad-delivery-modal .ad-dm-addcart{border:1px solid var(--nd-accent)}
.ad-delivery-modal .ad-dm-addcart{background:var(--nd-accent)}
.ad-qty-stepper .ad-qty-btn:hover:not(:disabled){background:var(--nd-accent)}
.container.page h2.top-products-more{background-color:var(--nd-accent)}
#pf-show-btn{background:var(--nd-accent)}
@media (max-width:767px){
.pf-bar-btn{background:var(--nd-accent)}
.pf-bar-badge{color:var(--nd-accent)}
body.pf-open-filter #parts-filter{background:#fff}
body.pf-drawer-open #pf-drawer-close{background:transparent}
}
.sort-tabs .sort-tab.active{border-top:3px solid var(--nd-accent-deep)}
@media(max-width:767px){
.cst-bar-btn{background:var(--nd-accent)}
.cst-bar-cur{color:var(--nd-accent)}
body.cst-open #cst-panel{background:#fff}
#cst-panel .cst-title{background:var(--nd-accent)}
#cst-panel .cst-list li{background:none}
body.cst-open #cst-close{background:transparent}
}
.search-results{border-left:4px solid var(--nd-accent)}
.search-categories{border-left:4px solid var(--nd-accent)}
.search-nothing{border:1px solid var(--nd-accent-deep)}
.search-nothing{border-left:4px solid var(--nd-accent-deep)}
.search-categories .pagegallery .text_col{background-color:#fff}
.search-categories .pagegallery .text_col:hover{background-color:var(--nd-accent)}
#ntf-filter .ntf-title{background:var(--nd-accent)}
@media(max-width:767px){
.ntf-on .ntf-bar-btn{background:var(--nd-accent)}
.ntf-on .ntf-bar-badge{color:var(--nd-accent)}
body.ntf-open #ntf-filter{background:#fff}
body.ntf-open #ntf-close{background:transparent}
}
body .select2-container--default .select2-results__option[aria-disabled=true]{color:#444}
body .select2-container--default .select2-results__option[aria-disabled=true]{background:#e9e9e9}
body .select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:Highlight}
body .select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:SelectedItem}
body .select2-container--default .select2-results__option--highlighted[aria-selected]{color:HighlightText}
body .select2-container--default .select2-results__option--highlighted[aria-selected]{color:SelectedItemText}
.pf-ms-win.pf-on{fill:var(--nd-accent)}
.pf-ms-wheel.pf-on{fill:var(--nd-accent)}
.pf-ms-hi{fill:var(--nd-accent)}
.qty-stepper .qty-btn:hover:not(:disabled){background:var(--nd-accent)}
#basket_spinner span{border-top-color:var(--nd-accent-deep)}
.basket-unavailable .bu-actions button{background:#fff}
.basket-unavailable .bu-actions button{color:#c0392b}
.basket-unavailable .bu-actions button:hover{background:var(--nd-accent)}
.basket-unavailable .bu-actions button:hover{color:#000}
a.order-summary-btn{background-color:green}
a.order-summary-link{color:#000}
.qr-wrap::before{border:4px solid var(--nd-accent)}
.qr-wrap::after{border:4px solid var(--nd-accent)}
.qr-wrap::after{border-color:transparent}
.qr-wrap::after{border-top-color:var(--nd-accent)}
.qr-wrap::after{border-left-color:var(--nd-accent)}
.ordersummary a.order-uuid-item-link{color:#000}
.ordersummary small.customer_reason_counter{color:#888}
.gc-edit-form input:-ms-input-placeholder{color:#c4c4c4}
.garrage-add-btn{background:var(--nd-accent)}
.office-tab-btn.active{background:#fff}
.office-tab-btn.active{border-color:#ddd}
.office-tab-btn.active{border-bottom-color:#fff}
.inv-pg-btn.active{background:#333}
.inv-pg-btn.active{border-color:#333}
:where(.page-garrage-add) #vinbox-body a:hover{background-color:var(--nd-accent)}
:where(.page-garrage-add) .vin_code_group .title{background-color:var(--nd-accent)}
.customer_dashboard a.voucher-order-link{color:#000}
.customer_dashboard a.voucher-order-plain{color:#000}
.latestArticlesB .thumbnail a.news-img-empty{background:#f2f2f2}
/* nd-palette:end */

/* ============================================================
   Facelift starého obsahu (variant B): tvar a písmo, nie rozloženie.
   Farby rieši paleta vyššie (nd-palette); tu zaoblenie, tlačidlá bez verzálok, polia formulárov.
   Bootstrap si pri spojených prvkoch (.input-group, .btn-group) nuluje rohy vyššou špecificitou.
   ============================================================ */
body.nd .btn, body.nd .button { border-radius: var(--nd-r); }
body.nd .btn { font-family: var(--nd-font-body); font-weight: 600; text-transform: none; letter-spacing: 0; }
body.nd .btn-primary { font-weight: 700; }
body.nd .button.buy { text-transform: none; border-color: var(--nd-accent); }
body.nd .button.buy:hover, body.nd .button.buy:focus { background-color: var(--nd-accent-deep); border-color: var(--nd-accent-deep); }
body.nd .form-control { border-radius: var(--nd-r); border-color: var(--nd-line); box-shadow: none; }
body.nd .form-control:focus { border-color: var(--nd-accent); box-shadow: 0 0 0 3px var(--nd-accent-soft); }
/* formuláre motívu (prihlásenie, registrácia, zabudnuté heslo, modaly #login/#signup, komentáre, profil):
   style.css im dáva sivé polia bez rámika, ostré rohy a verzálky, so špecificitou až s ID - :is() ju preberie */
body.nd :is(.form-field, .form-body .panel .panel-body, .signUp .panel .panel-body, .lostPassword .panel .panel-body, .logIn .panel .panel-body, .commentsForm, #login .modal-dialog .modal-content .modal-body, #signup .modal-dialog .modal-content .modal-body, .stepsPage form, .profile .form-horizontal) .form-group .form-control {
  border-radius: var(--nd-r); background-color: var(--nd-surface); border: 1px solid var(--nd-line);
}
body.nd :is(.form-field, .form-body .panel .panel-body, .signUp .panel .panel-body, .lostPassword .panel .panel-body, .logIn .panel .panel-body, .commentsForm, #login .modal-dialog .modal-content .modal-body, #signup .modal-dialog .modal-content .modal-body, .stepsPage form, .profile .form-horizontal) .form-group .form-control:focus { border-color: var(--nd-accent); box-shadow: 0 0 0 3px var(--nd-accent-soft); }
body.nd :is(.form-field, .form-body .panel .panel-body, .signUp .panel .panel-body, .lostPassword .panel .panel-body, .logIn .panel .panel-body, .commentsForm, #login .modal-dialog .modal-content .modal-body, #signup .modal-dialog .modal-content .modal-body) .btn-primary { border-radius: var(--nd-r); text-transform: none; }
body.nd :is(.form-field, .form-body .panel .panel-body, .signUp .panel .panel-body, .lostPassword .panel .panel-body, .logIn .panel .panel-body, .commentsForm, #login .modal-dialog .modal-content .modal-body, #signup .modal-dialog .modal-content .modal-body) .btn-primary:hover { opacity: 1; background-color: var(--nd-accent-deep); }
body.nd :is(.form-body, .signUp, .lostPassword, .logIn) .panel { border: 1px solid var(--nd-line); border-radius: var(--nd-r); overflow: hidden; }
body.nd :is(.form-body, .signUp, .lostPassword, .logIn) .panel .panel-body { border: none; }
/* .form-body (registrácia, objednávka): h3 v hlavičke má margin-top 20px - bez rámika panelu prepadol von a odsúval
   celý panel, s rámikom by robil biely pás nad hlavičkou; odsadenie preto dostane panel */
body.nd .form-body .panel { margin-top: 20px; }
body.nd .form-body .panel .panel-heading h3 { margin-top: 0; }
body.nd .login_register_box { border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface-2); }
body.nd .breadcrumb { border-radius: var(--nd-r); background-color: var(--nd-surface-2); }
/* bočné boxy (FILTER, Značky v ponuke): Bootstrap .panel */
body.nd .panel { border-color: var(--nd-line); border-radius: var(--nd-r); box-shadow: none; }
body.nd .panel > .panel-heading { border-top-left-radius: calc(var(--nd-r) - 1px); border-top-right-radius: calc(var(--nd-r) - 1px); }
/* dlaždice podkategórií (.pagegallery): výšku drží .picture_col (line-height 3.5em) a .text_col (44 px);
   pri 15 px písme by dlaždica s obrázkom bola vyššia ako bez neho a plávajúca mriežka by mala diery */
body.nd .pagegallery .frame {
  border-color: var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface); overflow: hidden;
  transition: border-color .15s, box-shadow .15s;
}
body.nd .pagegallery .frame:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow-sm); }
body.nd .pagegallery .text_col { background: transparent; }
body.nd .pagegallery .picture_col { height: 44px; line-height: 44px; }
body.nd .pagegallery .pagegallery_picture { vertical-align: middle; }
body.nd .pagegallery .text_col a { font-size: 1.1em; line-height: 1.2; }
/* dlaždice Obľúbené na titulke (.home-popular) */
body.nd .home-popular .popular-category {
  border-color: var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
  transition: border-color .15s, box-shadow .15s;
}
body.nd .home-popular .popular-category:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow-sm); }
/* košík: starý .basket má 1.1em (rátané na 13 px); pri 15 px je to 16,5 px a „Odstrániť“ (nowrap)
   v stĺpci col-sm-1 pretečie za okraj tabuľky */
body.nd .basket { font-size: 1em; }
body.nd .basket-products .remove-col { padding-right: 0; }
/* sekundárna modrá #0578d5 starého dizajnu (krokovač objednávky, Čítajte viac / Zobraziť viac, slidery) */
body.nd .progress-wizard .progress-wizard-step.complete .progress .progress-bar,
body.nd .progress-wizard .progress-wizard-step.complete .progress-wizard-dot { background-color: var(--nd-accent) !important; }
body.nd #citajte_viac, body.nd #citajte_menej,
body.nd #zobrazit_viac_button, body.nd #zobrazit_menej_button, body.nd #zobrazit_viac_button_wide, body.nd #zobrazit_menej_button_wide,
body.nd .order_comments_show_button { background-color: var(--nd-ink); border-radius: var(--nd-r-sm); }
body.nd #citajte_viac, body.nd #citajte_menej { display: inline-block; padding: 4px 14px; font-size: 1.05em; font-weight: 600; }
body.nd #citajte_viac:hover, body.nd #citajte_menej:hover,
body.nd #zobrazit_viac_button:hover, body.nd #zobrazit_menej_button:hover, body.nd #zobrazit_viac_button_wide:hover, body.nd #zobrazit_menej_button_wide:hover,
body.nd .order_comments_show_button:hover { background-color: var(--nd-ink-2); }
/* karta produktu vo výpise */
body.nd .product .product-body {
  border-color: var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
  transition: border-color .15s, box-shadow .15s;
}
body.nd .product .product-body:hover { border-color: var(--nd-muted-2); box-shadow: var(--nd-shadow); }
/* názov na karte: starý rámec mu dáva pevnú výšku 50 px (a.product_href, overflow hidden);
   pri 18 px by sa tretí riadok odrezal v polovici a prekryl štítok */
body.nd .product-body h3.name, body.nd .product-body h3.name .product_href { font-size: var(--nd-fs-15); line-height: 1.1; }
body.nd .product-body h3.name .product_href { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

/* ============================================================
   Hlavička (template/nd/header.php)
   Prilepená: top = minus výška pásika a info lišty, takže pri scrolle ostane len hlavný riadok.
   ============================================================ */
.nd-header {
  --nd-util-h: 38px;
  position: sticky;
  top: calc(-4px - var(--nd-util-h));
  z-index: 1000;
  transition: transform .25s ease;
  /* 13.10.2026 Stefan: pozadie hlavicky jednoliate - jeden vzor cez info listu aj hlavny riadok (predtym kazdy blok
     vlastny odtien a okraj); navigacny pas (#nd-nav, mimo <header>) nadvazuje vzorom posunutym o vysku hlavicky */
  background: #15171a url(../img/bg_pattern.png) repeat;
  background-size: 30px auto;
}
@media (max-width: 767px) { .nd-header.nd-hdr-hide { transform: translateY(-100%); } } /* skrývanie len na mobile, desktop ostáva prilepený */
/* mobilné vyhľadávanie na celú obrazovku je position: fixed vnútri hlavičky - transform by ho uväznil */
html.search-modal-open .nd-header { transform: none !important; z-index: 2147483000 !important; }

.nd-strip {
  height: 4px;
  background: linear-gradient(90deg,var(--nd-accent-deep) 0%,var(--nd-accent) 45%,#ffd866 70%,var(--nd-accent) 100%);
}

/* info lišta */
.nd-util { color: rgba(255,255,255,.85); font-size: var(--nd-fs-12-5); }
.nd-util__in { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: var(--nd-util-h); }
.nd-util__left, .nd-util__right { display: flex; align-items: center; gap: 18px; min-width: 0; }
.nd-util__item { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.nd-util__item .nd-ico { color: var(--nd-accent); }
body.nd .nd-util a { color: rgba(255,255,255,.85); font-weight: 600; text-decoration: none; }
body.nd .nd-util a:hover, body.nd .nd-util a:focus { color: #fff; }
.nd-util__phone .nd-ico { color: inherit; }

/* hlavný riadok (pozadie dáva .nd-header) */
.nd-main__in { display: flex; align-items: center; gap: 18px; height: 80px; }

.nd-hamburger {
  display: none; border: none; background: transparent; color: #fff;
  padding: 6px; margin-left: -6px; border-radius: var(--nd-r);
}
.nd-logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; text-decoration: none !important; }
.nd-logo img { height: 46px; width: auto; display: block; }

/* hľadanie: #searchBox drží aj mobilný modal (comco-templates.css, html.search-modal-open).
   Pravidlá políčka v hlavičke platia len pri zatvorenom modale (html:not(...)), inak by pre
   vyššiu špecificitu prebili position:fixed a vzhľad modalu. */
html:not(.search-modal-open) body.nd #searchBox.nd-search { flex: 1; min-width: 0; position: relative; margin: 0; padding: 0; width: auto; float: none; }
.nd-search__box {
  display: flex; align-items: stretch; height: 46px; background: #fff;
  border: 2px solid #15171a; border-radius: var(--nd-r); overflow: hidden;
}
.nd-search__modes { display: flex; border-right: 1px solid var(--nd-line); flex-shrink: 0; }
.nd-search__modes button {
  border: none; border-bottom: 2px solid transparent; background: transparent;
  color: var(--nd-muted); font-weight: 600; font-size: var(--nd-fs-12-5); padding: 0 12px; white-space: nowrap;
}
.nd-search__modes button:hover { color: var(--nd-ink); }
.nd-search__modes button.is-active { background: var(--nd-surface-3); color: var(--nd-ink); border-bottom-color: var(--nd-accent); }
html:not(.search-modal-open) body.nd #searchBox .nd-search__box .input-group {
  display: flex; flex: 1; min-width: 0; width: auto; height: 100%; border: none; margin: 0; padding: 0; background: #fff;
}
html:not(.search-modal-open) body.nd #searchBox .nd-search__box #search-q {
  flex: 1; min-width: 0; height: 100%; border: none; border-radius: 0; box-shadow: none; outline: none;
  padding: 0 14px; font-size: var(--nd-fs-14-5); color: var(--nd-ink); background: #fff; float: none; width: auto;
}
html:not(.search-modal-open) body.nd #searchBox[data-mode="vin"] #search-q { font-family: var(--nd-font-mono); letter-spacing: .02em; }
html:not(.search-modal-open) body.nd #searchBox .nd-search__box .nd-search__go {
  display: flex; align-items: center; gap: 8px; width: auto; height: 100%;
  border: none; border-radius: 0; padding: 0 22px; margin: 0;
  background: var(--nd-accent); color: var(--nd-on-accent); font-weight: 700; font-size: var(--nd-fs-15); text-transform: none;
}
html:not(.search-modal-open) body.nd #searchBox .nd-search__box .nd-search__go:hover { background: var(--nd-accent-deep); }
html:not(.search-modal-open) body.nd #searchBox .nd-search__go .fa { font-size: 17px; color: inherit; }
/* otvorený modal: vzhľad políčka dáva comco-templates.css, nd obal ustúpi */
html.search-modal-open .nd-search__box { display: block; height: auto; border: 0; border-radius: 0; background: none; overflow: visible; }
html.search-modal-open .nd-search__go-label { display: none; }
html.search-modal-open body.nd #searchBox .input-group-addon { background: var(--nd-accent); }

/* ikony vpravo */
.nd-icons { display: flex; align-items: center; gap: 2px; margin-left: auto; flex-shrink: 0; }
body.nd .nd-iconbtn {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 8px 12px; border-radius: var(--nd-r);
  color: rgba(255,255,255,.9); font-size: var(--nd-fs-11); font-weight: 600; line-height: 1.2; text-decoration: none;
  transition: background .15s, color .15s;
}
body.nd .nd-iconbtn:hover, body.nd .nd-iconbtn:focus { background: rgba(255,255,255,.12); color: #fff; }
.nd-iconbtn__label { max-width: 84px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nd-cartbtn__count {
  position: absolute; top: 2px; right: 8px;
  min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px;
  display: grid; place-items: center;
  background: var(--nd-accent); color: var(--nd-on-accent); font-size: var(--nd-fs-11); font-weight: 700; line-height: 1;
}
.nd-cartbtn__count[hidden] { display: none; }
.nd-cartbtn__title { display: none; } /* #basket_update_title: zdroj počtu kusov pre JS, nie je vidieť */

/* ============================================================
   Navigačný pás: Výber tovaru (mega menu) + menu(1) z adminu.
   Rozmery .nav-category (šírka nad bočným menu na titulke) ostávajú zo style.css/comco.css.
   ============================================================ */
body.nd .nd-nav.navbar {
  min-height: 0; margin: 0; border: none; border-radius: 0; z-index: 990;
  background: #15171a url(../img/bg_pattern.png) repeat;
  background-size: 30px auto;
}
.nd-nav__head { display: none; }
/* desktop: prilepený pod hlavný riadok hlavičky; --nd-nav-top meria nd_header_js.php (výška riadku sa mení
   so šírkou). Menu Výber tovaru je v nd všade zatvorené (blocks/pages_ul.php, bez .stayOpened) a otvára ho
   jQuery prechodom myšou (custom.js nav_show). */
@media (min-width: 768px) {
  /* vzor pokračuje z hlavičky: posun = pásik 4 px + info lišta 38 px + hlavný riadok (--nd-nav-top) */
  body.nd .nd-nav.navbar { position: sticky; top: var(--nd-nav-top,81px); background-position: 0 calc(-42px - var(--nd-nav-top,81px)); }
}
.nd-nav__in { display: flex; align-items: center; height: 48px; }
body.nd .nd-nav .nav-category {
  background: var(--nd-accent); height: 40px; line-height: 40px; padding: 0; margin-right: 10px;
  border-radius: var(--nd-r); float: none; flex-shrink: 0;
}
body.nd .nd-nav .nav-category > a.nd-nav__catbtn {
  display: flex; align-items: center; gap: 10px; height: 100%; padding: 0 16px;
  color: var(--nd-on-accent); font-family: var(--nd-font-display); font-size: 17px; font-weight: 700;
  text-transform: none; text-decoration: none;
}
.nd-nav__chev { margin-left: auto; }
body.nd .nd-nav .nav-category > .dropdown-menu { top: calc(100% + 4px); border-radius: var(--nd-r); box-shadow: var(--nd-shadow); border-color: var(--nd-line); overflow: hidden; }
body.nd .nd-nav .nav-category .dropdown-menu li a { font-family: var(--nd-font-body); color: var(--nd-ink); }
/* text tmavy: --nd-accent-ink na --nd-accent-soft ma kontrast len 4,4:1 (ako aktivna pilulka typu vozidla) */
body.nd .nd-nav .nav-category .dropdown-menu li.active a,
body.nd .nd-nav .nav-category .dropdown-menu li a:hover { background: var(--nd-accent-soft); color: var(--nd-on-accent); }

body.nd .nd-nav .navbar-collapse { padding: 0; border: none; box-shadow: none; }
body.nd .nd-nav .navbar-nav { margin: 0; }
/* !important: comco.css má .dropdown-toggle { color: #000 !important } */
body.nd .nd-nav .navbar-nav > li > a {
  color: rgba(255,255,255,.86) !important; font-family: var(--nd-font-body); font-size: var(--nd-fs-14); font-weight: 600;
  text-transform: none; line-height: 20px; padding: 8px 13px; margin: 0 1px; border-radius: var(--nd-r); background: transparent;
}
body.nd .nd-nav .navbar-nav > li > a:hover, body.nd .nd-nav .navbar-nav > li > a:focus,
body.nd .nd-nav .navbar-nav > li.open > a, body.nd .nd-nav .navbar-nav > li.active > a {
  background: rgba(255,255,255,.12) !important; color: #fff !important;
}
body.nd .nd-nav .navbar-nav .dropdown-menu { border-radius: var(--nd-r); box-shadow: var(--nd-shadow); border-color: var(--nd-line); }
body.nd .nd-nav .navbar-nav .dropdown-menu > li > a { font-family: var(--nd-font-body); color: var(--nd-ink); padding: 7px 16px; }
body.nd .nd-nav .navbar-nav .dropdown-menu > li > a:hover { background: var(--nd-accent-soft); color: var(--nd-on-accent); }

/* ============================================================
   Výsuvný košík a zatemnenie
   ============================================================ */
.nd-backdrop { position: fixed; inset: 0; background: rgba(15,17,20,.5); z-index: 1990; }
.nd-backdrop[hidden] { display: none; }
body.nd-lock { overflow: hidden; }

.nd-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 420px; max-width: 92vw; z-index: 2000;
  background: var(--nd-surface); box-shadow: var(--nd-shadow-lg);
  display: flex; flex-direction: column;
  transform: translateX(105%); transition: transform .25s ease; visibility: hidden;
}
body.nd-cart-open .nd-drawer { transform: none; visibility: visible; }
.nd-drawer__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 18px; border-bottom: 1px solid var(--nd-line);
}
.nd-drawer__title { display: flex; align-items: center; gap: 10px; font-family: var(--nd-font-display); font-size: 21px; font-weight: 700; }
.nd-drawer__close, .nd-nav__close { border: none; background: transparent; color: var(--nd-ink-2); padding: 6px; border-radius: var(--nd-r); }
.nd-drawer__close:hover, .nd-nav__close:hover { background: var(--nd-surface-2); }
/* obsah z create_header_basket() (helpers.php): položky li, tlačidlá Košík / Pokladňa, prázdny stav */
body.nd #basket_update_body.nd-drawer__body {
  display: flex !important; flex-direction: column; position: static; float: none; flex: 1; overflow-y: auto;
  margin: 0; padding: 8px 18px 18px; list-style: none; border: none; box-shadow: none; min-width: 0; width: auto;
}
body.nd #basket_update_body.nd-drawer__body > li { flex: none; border-bottom: 1px solid var(--nd-line-2); padding: 10px 0; }
body.nd #basket_update_body.nd-drawer__body > li:last-child { border-bottom: none; }
.nd-drawer__sum { margin-left: 4px; padding: 2px 9px; border-radius: 999px; background: var(--nd-surface-3); font-family: var(--nd-font-body); font-size: var(--nd-fs-14); font-weight: 700; color: var(--nd-ink); }
body.nd #basket_update_body > li > a { display: block; color: var(--nd-ink); text-decoration: none; }
body.nd #basket_update_body .media { margin: 0; padding: 0; border: 0; overflow: visible; color: inherit; }
body.nd #basket_update_body .basket_product { font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1.35; color: var(--nd-ink); }
body.nd #basket_update_body > li > a:hover .basket_product { color: var(--nd-accent-ink); }
body.nd #basket_update_body .basket_price { margin-top: 3px; font-size: var(--nd-fs-13-5); color: var(--nd-muted); }
/* tlačidlá Nákupný košík / Objednať: pri pár položkách na spodku panela, pri dlhom zozname prilepené; objednať je hlavná akcia */
body.nd #basket_update_body > li:has(+ li .row-fluid) { border-bottom: none; }
body.nd #basket_update_body > li:has(.row-fluid) { position: sticky; bottom: -18px; margin-top: auto; padding: 14px 0 18px; background: var(--nd-surface); border-top: 1px solid var(--nd-line); }
body.nd #basket_update_body .row-fluid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
/* pri 320 px sa Nakupny kosik s 12 px okrajmi nezmesti do polovice panela (tlacidla boli 130 a 118 px) */
@media (max-width: 359px) { body.nd #basket_update_body .btn { padding: 0 6px; } }
body.nd #basket_update_body .row-fluid > div { width: auto; float: none; padding: 0; }
body.nd #basket_update_body .btn {
  width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--nd-line); border-radius: var(--nd-r);
  background: var(--nd-surface); color: var(--nd-ink); font-family: var(--nd-font-body); font-size: var(--nd-fs-15); font-weight: 700; text-transform: none; letter-spacing: 0;
}
body.nd #basket_update_body .btn:hover { background: var(--nd-surface-2); }
/* text checkout je v lang.php verzálkami (OBJEDNAŤ) a používa ho aj starý dizajn: prevod len tu */
body.nd #basket_update_body .btn { text-transform: lowercase; }
body.nd #basket_update_body .btn::first-letter { text-transform: uppercase; }
body.nd #basket_update_body .row-fluid > div:last-child .btn { background: var(--nd-accent); border-color: var(--nd-accent); color: var(--nd-on-accent); }
body.nd #basket_update_body .row-fluid > div:last-child .btn:hover { background: var(--nd-accent-deep); border-color: var(--nd-accent-deep); }
body.nd #basket_update_body .cart-empty { padding: 32px 0; font-size: 16px; color: var(--nd-muted); }
body.nd #basket_update_body > li.cart-empty { margin: auto 0; border: 0; text-align: center; }
/* plávajúci chat (.bp-load z-index 99998, #bp-widget 99997) prekrýval otvorený košík aj menu (z-index 2000) */
body.nd.nd-lock .bp-load, body.nd.nd-lock #bp-widget { visibility: hidden; }
/* ==== Vysuvny kosik: polozky (08.10.2026) ====
   Riadok li.nd-dci sklada server (template/nd/bootstrap.php nd_drawer_item cez create_header_basket): obrazok vlavo,
   nazov a kos hore, mnozstvo minus [ks] plus a cena riadku dole (podla prototypu CartDrawer). JS zmeny mnozstva a
   odobratia: blocks/nd_cart_js.php. Pole mnozstva ma 16 px - mensie pismo v poli iOS pri fokuse priblizi stranku. */
body.nd #basket_update_body.nd-drawer__body > li.nd-dci {
  display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "img name del" "img qty price";
  column-gap: 12px; row-gap: 8px; align-items: center; padding: 12px 0; transition: opacity .15s;
}
body.nd #basket_update_body > li.nd-dci > .nd-dci__img {
  grid-area: img; align-self: start; display: flex; align-items: center; justify-content: center;
  width: 64px; height: 64px; overflow: hidden; border: 1px solid var(--nd-line-2); border-radius: var(--nd-r-sm); background: #fff;
}
body.nd #basket_update_body .nd-dci__img img { display: block; width: 100%; height: 100%; object-fit: contain; }
body.nd #basket_update_body > li.nd-dci > .nd-dci__name {
  grid-area: name; align-self: start; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
  font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1.3; color: var(--nd-ink); text-decoration: none; overflow-wrap: break-word;
}
body.nd #basket_update_body > li.nd-dci > .nd-dci__name:hover { color: var(--nd-accent-ink); text-decoration: underline; }
body.nd #basket_update_body .nd-dci__del {
  grid-area: del; align-self: start; justify-self: end; display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; margin: -7px 0 0 0; padding: 0; border: 0; border-radius: var(--nd-r); background: transparent; color: var(--nd-muted); cursor: pointer;
}
body.nd #basket_update_body .nd-dci__del:hover { background: var(--nd-danger-soft); color: var(--nd-danger); }
body.nd #basket_update_body .nd-dci__qty {
  grid-area: qty; justify-self: start; display: inline-flex; align-items: stretch; height: 34px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface); overflow: hidden;
}
body.nd #basket_update_body .nd-dci__step {
  display: flex; align-items: center; justify-content: center; width: 34px; margin: 0; padding: 0;
  border: 0; border-radius: 0; background: transparent; color: var(--nd-ink-2); cursor: pointer;
}
body.nd #basket_update_body .nd-dci__step:hover:not(:disabled) { background: var(--nd-surface-2); color: var(--nd-ink); }
body.nd #basket_update_body .nd-dci__step:disabled { color: var(--nd-muted-2); opacity: .5; cursor: default; }
body.nd #basket_update_body .nd-dci__in {
  width: 44px; height: auto; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent;
  color: var(--nd-ink); font-family: var(--nd-font-body); font-size: 16px; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums;
}
body.nd #basket_update_body .nd-dci__in:focus { outline: 2px solid var(--nd-accent); outline-offset: -2px; }
body.nd #basket_update_body .nd-dci__price { grid-area: price; justify-self: end; font-size: 16px; font-weight: 700; color: var(--nd-ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
body.nd #basket_update_body .nd-dci__na { grid-column: 2 / 4; grid-row: 2; font-size: var(--nd-fs-13-5); line-height: 1.35; color: var(--nd-danger); }
body.nd #basket_update_body > li.nd-dci.is-busy .nd-dci__price { opacity: .45; }
body.nd #basket_update_body > li.nd-dci.is-removing { opacity: .4; pointer-events: none; }
/* riadok Zaokruhlenie pod polozkami (chyba #7, 15.10.2026, nd_drawer_rounding): popis ako text panela, suma v stlpci cien riadkov */
body.nd #basket_update_body.nd-drawer__body > li.nd-dcr { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 10px 0; }
body.nd #basket_update_body .nd-dcr__t { font-size: var(--nd-fs-13-5); color: var(--nd-muted); }
body.nd #basket_update_body .nd-dcr__price { font-size: 16px; font-weight: 700; color: var(--nd-ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* suhrn pod polozkami B2C aj B2B (Stefan 18.10.2026, nd_drawer_rounding li.nd-dcr--sum): Zaokruhlenie DPH, bez DPH a DPH husto bez ciar,
   Celkom k uhrade tucne s ciarou; kupon (li.nd-dcr--voucher) je riadok polozky */
body.nd #basket_update_body.nd-drawer__body > li.nd-dcr--sum { padding: 3px 0; border-bottom: 0; }
body.nd #basket_update_body.nd-drawer__body > li:not(.nd-dcr--sum) + li.nd-dcr--sum { padding-top: 10px; }
body.nd #basket_update_body.nd-drawer__body > li.nd-dcr--total { padding: 6px 0 10px; border-bottom: 1px solid var(--nd-line-2); }
body.nd #basket_update_body li.nd-dcr--sum:not(.nd-dcr--total) .nd-dcr__price { font-size: var(--nd-fs-14); font-weight: 400; }
body.nd #basket_update_body li.nd-dcr--total .nd-dcr__t { color: var(--nd-ink); font-weight: 700; }
@media (max-width: 767px) {
  body.nd #basket_update_body .nd-dci__qty { height: 38px; }
  body.nd #basket_update_body .nd-dci__step { width: 38px; }
  body.nd #basket_update_body .nd-dci__del { width: 38px; height: 38px; margin: -9px 0 0 0; }
}
@media (max-width: 359px) {
  body.nd #basket_update_body.nd-drawer__body > li.nd-dci { grid-template-columns: 52px minmax(0, 1fr) auto; column-gap: 10px; }
  body.nd #basket_update_body > li.nd-dci > .nd-dci__img { width: 52px; height: 52px; }
  body.nd #basket_update_body .nd-dci__in { width: 38px; }
}

/* ============================================================
   Spodná lišta (mobil)
   ============================================================ */
.nd-bottomnav { display: none; }

/* ============================================================
   Tablet
   ============================================================ */
@media (max-width: 1199px) {
  .nd-util__claim + .nd-util__claim { display: none; }
  .nd-search__modes button { padding: 0 9px; }
  body.nd .nd-iconbtn { padding: 8px 8px; }
}
@media (max-width: 991px) {
  .nd-util__claim { display: none; }
  .nd-iconbtn__label { display: none; }
  .nd-search__go-label { display: none; }
  html:not(.search-modal-open) body.nd #searchBox .nd-search__box .nd-search__go { padding: 0 16px; }
  .nd-iconbtn--hide-sm { display: none !important; }
}

/* minimalizovaný chat Jozef o 15 px nižšie (Štefan 14.10.2026; zdroj 20/88 px v comco.css a comco-templates.css);
   mobil má vlastné hodnoty nad spodnou lištou nižšie v bloku Mobil */
body.nd .bp-load.is-minimized .bp-button { bottom: 5px; }
body.nd .bp-load.is-minimized .bp-btn-minimizer { bottom: 73px; }

/* ============================================================
   Mobil (do 767 px): hamburger, hľadanie pod logom, menu ako výsuvný panel, spodná lišta
   ============================================================ */
@media (max-width: 767px) {
  .nd-header { --nd-util-h: 34px; }
  .nd-util { font-size: var(--nd-fs-12); }
  .nd-util__left { gap: 14px; }
  .nd-util__phone span, .nd-util__hide-sm { display: none !important; }

  .nd-main__in { flex-wrap: wrap; height: auto; padding-top: 10px; padding-bottom: 10px; gap: 8px 10px; }
  /* 13.10.2026 Stefan: menu v hlavicke doprava - logo vlavo, za nim ikony konta a kosika, hamburger uplne vpravo
     (zaporny okraj zarovna ikonu s okrajom ako predtym vlavo); menu sa preto vysuva sprava ako kosik */
  .nd-hamburger { display: block; order: 3; margin-left: 0; margin-right: -6px; }
  .nd-logo img { height: 34px; }
  .nd-icons { order: 2; }
  html:not(.search-modal-open) body.nd #searchBox.nd-search { order: 4; flex: 1 0 100%; }
  .nd-search__modes { display: none; }
  .nd-search__box { height: 44px; }

  /* menu: panel sprava (k hamburgeru) */
  body.nd .nd-nav.navbar {
    position: fixed; top: 0; right: 0; bottom: 0; left: auto; width: 320px; max-width: 88vw; z-index: 2000;
    background: var(--nd-surface); border: none; overflow-y: auto;
    transform: translateX(105%); transition: transform .25s ease; visibility: hidden;
  }
  body.nd-nav-open .nd-nav.navbar { transform: none; visibility: visible; }
  .nd-nav__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 16px; border-bottom: 1px solid var(--nd-line);
  }
  .nd-nav__title { font-family: var(--nd-font-display); font-size: 21px; font-weight: 700; }
  .nd-nav__in { display: block; height: auto; width: auto; padding: 0; }
  body.nd .nd-nav .nav-category { display: block; width: auto; max-width: none; height: auto; line-height: inherit; margin: 12px 16px 0; border-radius: var(--nd-r); }
  body.nd .nd-nav .nav-category > a.nd-nav__catbtn { height: 44px; }
  body.nd .nd-nav .nav-category > .dropdown-menu {
    display: block !important; position: static; float: none; width: auto; max-width: none; height: auto;
    margin: 0 0 4px; border: none; border-radius: 0 0 var(--nd-r) var(--nd-r); box-shadow: none; background: var(--nd-surface);
  }
  body.nd .nd-nav .nav-category .dropdown-menu li a { padding: 11px 14px; font-size: var(--nd-fs-15); line-height: 1.3; border-bottom: 1px solid var(--nd-line-2); }
  body.nd .nd-nav .navbar-collapse { display: block !important; height: auto !important; margin: 0; padding: 8px 16px 24px; }
  body.nd .nd-nav .navbar-nav > li { float: none; }
  body.nd .nd-nav .navbar-nav > li > a { color: var(--nd-ink) !important; font-size: var(--nd-fs-15); padding: 11px 6px; border-radius: 0; border-bottom: 1px solid var(--nd-line-2); }
  body.nd .nd-nav .navbar-nav > li > a:hover, body.nd .nd-nav .navbar-nav > li > a:focus { background: var(--nd-surface-2) !important; color: var(--nd-ink) !important; }

  /* spodná lišta */
  /* miesto pod spodnou lištou dáva pätička (tmavá), nie body - inak pod ňou ostane biely pás */
  .nd-bottomnav {
    display: grid; grid-template-columns: repeat(5, 1fr);
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1500;
    height: 60px; padding-bottom: env(safe-area-inset-bottom);
    background: var(--nd-surface); border-top: 1px solid var(--nd-line); box-shadow: 0 -2px 10px rgba(20,24,29,.06);
  }
  body.nd .nd-bottomnav__item {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    border: none; background: transparent; padding: 0; color: var(--nd-ink-2);
    font-size: var(--nd-fs-11); font-weight: 600; line-height: 1.1; text-decoration: none;
  }
  body.nd .nd-bottomnav__item.is-active { color: var(--nd-accent-ink); }
  .nd-bottomnav .nd-cartbtn__count { top: 4px; right: calc(50% - 22px); }
  html.search-modal-open .nd-bottomnav { display: none; }
  /* chat Jozef nad spodnú lištu (pozície .bp-* sú v comco-templates.css) */
  /* chat (layout_foot.php): tlačidlá sú position:fixed, posunúť ich nad spodnú lištu (+64 px) */
  body.nd .bp-load .bp-button { bottom: 84px; }
  body.nd .bp-load .bp-btn-minimizer { bottom: 176px; }
  /* minimalizovaný o 15 px nižšie (ako na desktope vyššie; pôvodne 84/152 px) */
  body.nd .bp-load.is-minimized .bp-button { bottom: 69px; }
  body.nd .bp-load.is-minimized .bp-btn-minimizer { bottom: 137px; }
}

/* ============================================================
   Pätička (nd/footer.php). Stĺpce menu(4) prichádzajú s triedami .col-* z adminu,
   v mriežke ich rozloží .nd-footer__menus { display: contents }.
   ============================================================ */
body.nd .nd-footer {
  margin-top: 40px; padding: 44px 0 28px;
  background: var(--nd-dark); color: rgba(255,255,255,.7); font-size: var(--nd-fs-13-5); line-height: 1.5;
  border-top: 4px solid var(--nd-accent);
}
.nd-footer__grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr 1fr 1.45fr; gap: 32px; }
.nd-footer__menus { display: contents; }
body.nd .nd-footer__menus > div { width: auto; float: none; min-height: 0; padding: 0; }
body.nd .nd-footer__menus > div:not(:has(.footerLink)) { display: none; } /* prázdny stĺpec <br/> z menu(4) */
body.nd .nd-footer .footer_menu_title {
  display: block; margin: 0 0 14px; padding: 0; border: 0;
  color: #fff; font-family: var(--nd-font-body); font-size: var(--nd-fs-11-5); font-weight: 700; line-height: 1.3;
  text-transform: uppercase; letter-spacing: .07em; text-decoration: none;
}
body.nd .nd-footer a.footer_menu_title:hover { color: var(--nd-accent); }
body.nd .nd-footer ul.list-unstyled { margin: 0; padding: 0; list-style: none; }
body.nd .nd-footer ul.list-unstyled > li { margin: 0 0 9px; padding: 0; color: rgba(255,255,255,.7); }
body.nd .nd-footer a { color: rgba(255,255,255,.72); text-decoration: none; transition: color .15s; }
body.nd .nd-footer a:hover, body.nd .nd-footer a:focus { color: #fff; }
.nd-footer__contact li, .nd-footer__contact li > a { display: flex; align-items: center; gap: 8px; }
.nd-footer__contact .nd-ico { color: var(--nd-accent); flex-shrink: 0; }

.nd-footer__logo img { display: block; width: auto; height: 40px; }
.nd-footer__about { max-width: 290px; margin: 14px 0 0; }
.nd-footer__pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.nd-pill {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
  background: rgba(255,255,255,.08); color: #fff; font-size: var(--nd-fs-12); font-weight: 600; white-space: nowrap;
}
.nd-pill .nd-ico { color: var(--nd-accent); }
.nd-footer__social { display: flex; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
body.nd .nd-footer__social a {
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,.08); color: #fff; font-size: 16px;
}
body.nd .nd-footer__social a:hover { background: var(--nd-accent); color: var(--nd-on-accent); }

/* newsletter: háčiky pre front.js ostávajú zo starej pätičky */
body.nd .nd-footer p { color: inherit; font-size: inherit; line-height: inherit; } /* style.css farbí p natvrdo */
.nd-footer__news p { margin: 0 0 12px; }
.nd-footer__nlrow { display: flex; height: 44px; border-radius: var(--nd-r); overflow: hidden; background: #fff; }
body.nd .nd-footer__nlrow #page_newsletter_email {
  flex: 1; min-width: 0; height: 100%; margin: 0; padding: 0 12px; border: 0; border-radius: 0; box-shadow: none;
  font-size: var(--nd-fs-14-5); color: var(--nd-ink); background: #fff;
}
body.nd .nd-footer__nlrow #page_newsletter_email.error-input { box-shadow: inset 0 0 0 2px #d9363e; }
.nd-footer__nlbtn {
  flex-shrink: 0; padding: 0 16px; border: 0; background: var(--nd-accent); color: var(--nd-on-accent);
  font-weight: 700; font-size: var(--nd-fs-14-5); text-transform: capitalize;
}
.nd-footer__nlbtn:hover { background: var(--nd-accent-deep); }
body.nd .nd-footer .page_newsletter_checkbox_text { margin-top: 10px; font-size: var(--nd-fs-12-5); color: rgba(255,255,255,.7); cursor: pointer; }
body.nd .nd-footer .page_newsletter_checkbox_text.error { color: #ff8a8f; }
.nd-footer__pay { display: block; height: auto; margin-top: 18px; opacity: .9; }
body.nd #myTlIframe { position: absolute; left: 0; bottom: 0; width: 1px; height: 1px; border: 0; opacity: 0; pointer-events: none; } /* toplist, nesmie robiť pás pod pätičkou */

/* config('footer') z adminu: SEO odkazy, copyright a doložka TecDoc */
.nd-footer__legal {
  margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.55); font-size: var(--nd-fs-12-5); line-height: 1.7;
}
.nd-footer__legal p { margin: 0 0 10px; }
.nd-footer__legal p:first-child > br:first-child { display: none; }
.nd-footer__legal strong { color: rgba(255,255,255,.85); font-weight: 600; }
.nd-footer__legal img { box-sizing: content-box; padding: 4px 6px; border-radius: 4px; background: #fff; } /* logo TecDoc je tmavomodré na priehľadnom */
body.nd .nd-footer__legal a { color: rgba(255,255,255,.62); }
body.nd .nd-footer__legal a:hover { color: #fff; }

@media (max-width: 1199px) {
  .nd-footer__grid { grid-template-columns: 1.2fr 1fr 1fr 1fr 1.3fr; gap: 24px; }
}
@media (max-width: 991px) {
  .nd-footer__grid { grid-template-columns: repeat(3, 1fr); }
  .nd-footer__brand { grid-column: 1 / -1; }
  .nd-footer__news { grid-column: 1 / -1; max-width: 460px; }
}
@media (max-width: 767px) {
  body.nd .nd-footer { padding: 32px 0 calc(84px + env(safe-area-inset-bottom)); margin-top: 28px; }
  .nd-footer__grid { grid-template-columns: 1fr 1fr; gap: 26px 18px; }
  .nd-footer__contact { grid-column: 1 / -1; }
  .nd-footer__news { max-width: none; }
}

/* ==== Karta produktu vo vypisoch (template/nd/products/card.php, COMCO-74 variant A) ====
   Na karte ani jej rodicoch nesmie byt transform, filter ani overflow:hidden - modal dorucenia sa
   vklada do karty (za .ad-delivery-box) a bPopup ho kladie fixed; transform by ho zviazal s kartou. */
body.nd .row:has(> .nd-pcard) { display: flex; flex-wrap: wrap; }
body.nd .row:has(> .nd-pcard)::before, body.nd .row:has(> .nd-pcard)::after { display: none; }
body.nd .row:has(> .nd-pcard) > :not(.nd-pcard) { flex: 0 0 100%; max-width: 100%; }
body.nd .nd-pcard { display: flex; flex-direction: column; float: none; margin-bottom: 24px; }
body.nd .nd-pcard__in {
  flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; position: relative;
  background: var(--nd-surface); border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  transition: border-color .15s, box-shadow .15s;
}
body.nd .nd-pcard__in:hover { border-color: var(--nd-muted-2); box-shadow: var(--nd-shadow); }
body.nd .nd-pcard__media { position: relative; padding: 14px 14px 0; }
body.nd .nd-pcard__media > a { display: block; aspect-ratio: 1; border-radius: var(--nd-r); background: #fff; }
body.nd .nd-pcard__media img { display: block; width: 100%; height: 100%; object-fit: contain; }
body.nd .nd-pcard__media .labels {
  position: absolute; top: 18px; left: 18px; right: auto; z-index: 2; margin: 0;
  display: flex; flex-direction: column; align-items: flex-start; gap: 5px; pointer-events: none;
}
body.nd .nd-pcard__media .labels .label {
  display: inline-block; margin: 0; padding: 3px 7px; border-radius: var(--nd-r-sm); color: #fff;
  font-size: var(--nd-fs-12); font-weight: 700; line-height: 1.3; letter-spacing: .05em; text-transform: uppercase;
}
body.nd .nd-pcard__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 7px; padding: 12px 14px 14px; }
body.nd .nd-pcard__brand { font-size: var(--nd-fs-12-5); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--nd-muted); }
body.nd .nd-pcard__title {
  margin: 0; font-family: var(--nd-font-body); font-size: 16px; font-weight: 600; line-height: 1.3;
  letter-spacing: 0; text-transform: none;
}
body.nd .nd-pcard__title a {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
  min-height: 2.5em; color: var(--nd-ink);
}
body.nd .nd-pcard__title a:hover, body.nd .nd-pcard__title a:focus { color: var(--nd-accent-ink); text-decoration: none; }
body.nd .nd-pcard__title .thin { font-weight: 400; color: var(--nd-ink-2); }
body.nd .nd-pcard__stock { margin-top: auto; padding-top: 4px; font-size: var(--nd-fs-13-5); }
body.nd .nd-pcard__stock .ad-delivery-box { margin: 0; font-size: var(--nd-fs-13-5); text-align: left; }
body.nd .nd-pcard__stock .ad-de-badge {
  display: inline-flex; align-items: center; gap: 4px; margin: 0 0 5px; padding: 4px 9px; border: 0;
  border-radius: var(--nd-r-pill); background: var(--nd-ok-soft); color: var(--nd-ok); font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1.1;
}
body.nd .nd-pcard__stock .ad-de-badge { max-width: 100%; white-space: normal; }
body.nd .nd-pcard__stock .ad-de-check { margin: 0; }
body.nd .nd-pcard__stock .ad-de-stock { color: var(--nd-muted); font-size: var(--nd-fs-13); }
body.nd .nd-pcard__stock a.ad-de-link { justify-content: flex-start; margin: 5px 0 0; font-size: var(--nd-fs-13); }
body.nd .nd-pcard__stock .ad-de-ltext { max-width: none; text-align: left; }
body.nd .nd-pcard__stock .ad-de-i { width: 1.5em; height: 1.5em; line-height: 1.5em; margin-right: .45em; border-radius: 50%; }
body.nd .nd-pcard__stock .ad-de-urgency { margin: 6px 0 0; padding: 5px 8px; border-radius: 0 var(--nd-r-sm) var(--nd-r-sm) 0; font-size: var(--nd-fs-13); }
body.nd .nd-pcard__stock .ad-availability-color-4 {
  display: inline-flex; padding: 4px 9px; border-radius: var(--nd-r-pill);
  background: var(--nd-surface-3); color: var(--nd-muted); font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1.1;
}
body.nd .nd-pcard__stock .nd-pcard__watchdog { float: none; display: inline-block; margin: 4px 0 0 8px; font-size: var(--nd-fs-13-5); font-weight: 600; color: var(--nd-accent-ink); text-decoration: underline; }
body.nd .nd-pcard__buy { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 6px; }
body.nd .nd-pcard__buy .ad-fit { order: -1; flex: 0 0 100%; margin: 0; }
body.nd .nd-pcard__price { display: flex; flex-direction: column; min-width: 0; }
body.nd .nd-pcard__price .price-vat, body.nd .nd-pcard__price .price-unvat { margin: 0; font-size: var(--nd-fs-13); line-height: 1.3; color: var(--nd-muted); white-space: nowrap; }
body.nd .nd-pcard__price .price-vat span {
  display: inline; font-family: var(--nd-font-display); font-size: 24px; font-weight: 700; line-height: 1.1; color: var(--nd-ink);
}
body.nd .nd-pcard__price .price-unvat span { font-weight: 600; color: var(--nd-ink-2); }
body.nd.b2b-customer .nd-pcard__price .price-unvat { order: -1; }
body.nd.b2b-customer .nd-pcard__price .price-unvat span {
  display: inline; font-family: var(--nd-font-display); font-size: 24px; font-weight: 700; line-height: 1.1; color: var(--nd-ink);
}
body.nd.b2b-customer .nd-pcard__price .price-vat span { display: inline; font-family: inherit; font-size: var(--nd-fs-13); font-weight: 600; line-height: inherit; color: var(--nd-ink-2); }
body.nd .nd-pcard__price .page_buy_more_and_save { margin-top: 3px; font-size: var(--nd-fs-13); font-weight: 600; color: var(--nd-accent-ink); }
body.nd .nd-pcard__form { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 0 0 0 auto; }
body.nd .nd-pcard__form .button.buy {
  display: inline-flex; align-items: center; justify-content: center; gap: 2px; position: relative; top: 0;
  height: 38px; margin: 0; padding: 0 11px; border-radius: var(--nd-r); font-size: var(--nd-fs-15); font-weight: 700; white-space: nowrap;
}
/* mobil: jedna karta na celu sirku (card.php necha col-xs-12) - dve vedla seba sa po zvacseni pisma
   na mobile nezmestili (stepper a Kupit pretekali z karty). Obrazok 4:3, aby karta nebola vyssia ako displej. */
@media (max-width: 767px) {
  body.nd .nd-pcard { margin-bottom: 14px; padding-left: 6px; padding-right: 6px; }
  body.nd .row:has(> .nd-pcard) { margin-left: -6px; margin-right: -6px; }
  body.nd .nd-pcard__media { padding: 10px 10px 0; }
  body.nd .nd-pcard__media > a { aspect-ratio: 4 / 3; }
  body.nd .nd-pcard__media .labels { top: 16px; left: 16px; }
  body.nd .nd-pcard__body { padding: 10px 14px 14px; gap: 6px; }
  body.nd .nd-pcard__title a { min-height: 0; }
  body.nd .nd-pcard__form { flex: 1 1 100%; gap: 10px; margin: 4px 0 0; }
  body.nd .nd-pcard__form .nd-pcard__qty { flex: 0 0 auto; }
  body.nd .nd-pcard__form .button.buy { flex: 1 1 auto; gap: 8px; height: 42px; padding: 0 16px; }
}
/* kalkulacka naplni: pod kartou riadok kombinacie balení a vnorena karta 1 L (kalkulacky_naplne_vysledok.php) */
body.nd .nd-pcard > .kalk-naplne-kombo { margin: 8px 0 0; border-radius: var(--nd-r); }
body.nd .nd-pcard > .kalk-naplne-doplnok { border-radius: var(--nd-r); }
body.nd .kalk-naplne-doplnok > .nd-pcard { margin-bottom: 6px; }
body.nd .kalk-naplne-doplnok .nd-pcard__media, body.nd .kalk-naplne-doplnok .ad-de-urgency { display: none; }

/* ==== Vypis produktov (kategoria, vyhladavanie) - variant A, krok 2 ====
   Len vzhlad: markup, odkazy, formulare aj JS ostavaju zo sablon default (page.php, filter.php,
   pagination.php, subpages_*.php) a z ntfacets/render.php a category_sort.php. */
/* drobceky: bez sivej plochy, tlmene, sipky ako v prototype */
body.nd .breadcrumb { margin: 2px 0 4px; padding: 12px 0 6px; border-radius: 0; background: none; font-size: var(--nd-fs-13-5); line-height: 1.4; color: var(--nd-muted); }
body.nd .breadcrumb .bc-item { display: inline; }
/* .mainContainer a ma v style.css underline !important - drobceky, dlazdice, cipy a strankovanie ho prebiju */
body.nd .breadcrumb a, body.nd .pagegallery a, body.nd .subpages a.title, body.nd .pagination.comco a { text-decoration: none !important; }
body.nd .breadcrumb a { color: var(--nd-muted); }
body.nd .breadcrumb a:hover, body.nd .breadcrumb a:focus { color: var(--nd-accent-ink); text-decoration: underline !important; }
body.nd .breadcrumb .bullet { margin: 0 5px; color: var(--nd-muted-2); }
body.nd .breadcrumb .bc-item > .current { color: var(--nd-ink-2); font-weight: 600; }
body.nd .breadcrumb a .current .fa { font-size: var(--nd-fs-15); color: var(--nd-muted); }
/* nadpis a kratky uvod stranky (page.php: .mainContainer > .clearfix > h1 / .shortdesc) */
body.nd .mainContainer > .clearfix > h1 {
  margin: 4px 0 8px; font-family: var(--nd-font-display); font-size: clamp(24px, 2.6vw, 32px); font-weight: 700;
  line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd .mainContainer > .clearfix > .shortdesc { max-width: 820px; margin: 0 0 16px; font-size: var(--nd-fs-15); line-height: 1.5; color: var(--nd-ink-2); }
/* .container p ma na mobile 18 px - uvod by bol vacsi ako nadpis kategorie */
body.nd .mainContainer > .clearfix > .shortdesc p { margin: 0 0 6px; font-size: inherit; line-height: inherit; }
/* dlazdice podkategorii (subpages_gallery.php): mriezka 3 / 2 stlpce, nizsie dlazdice. Ako stary dizajn (Stefan
   08.10.2026): obrazok vlavo na bielom stlpci cez celu vysku dlazdice s deliacou ciarou, nazov vpravo na svetlosivej */
body.nd .row.pagegallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 4px 0 24px; }
body.nd .row.pagegallery::before, body.nd .row.pagegallery::after { display: none; }
body.nd .pagegallery .outer_frame { float: none; width: auto; min-height: 0; margin: 0; padding: 0; }
/* biela karta s tienom: stranka je siva (--nd-surface-2) a dlazdica v rovnakej farbe s nou splyvala (13.10.2026).
   Obrazky podkategorii maju vacsinou biele pozadie - na bielej karte bez deliacej ciary vedla nazvu nevytrcaju. */
body.nd .pagegallery .frame { display: flex; align-items: stretch; height: 100%; min-height: 58px; margin: 0; border: 1px solid var(--nd-line); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm); }
body.nd .pagegallery .frame:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow); }
/* hover dlazdice je plynuly - ramik, tien aj farba nazvu a ikony za 200 ms (Stefan 13.10.2026) */
body.nd .pagegallery .frame { transition: border-color .2s ease, box-shadow .2s ease; }
/* stary comco.css ma a { transition: none !important } */
body.nd .pagegallery .frame .text_col a { transition: color .2s ease !important; }
body.nd .pagegallery .frame .picture_col {
  flex: 0 0 64px; display: flex; align-items: center; justify-content: center; width: 64px; height: auto; min-height: 56px;
  padding: 6px 0 6px 8px; border: 0; background: transparent; line-height: 1; text-align: center; float: none;
}
body.nd .pagegallery .frame .picture_col > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
/* multiply: biele (aj takmer biele) pozadie obrazka neprekryje ramik ani tien dlazdice, ani ked sa pri hoveri zvacsi */
body.nd .pagegallery .frame .picture_col img { max-width: 100%; max-height: 44px; mix-blend-mode: multiply; }
/* podkategoria bez obrazka (nd_subpage_noimg() v template/nd/subpage_icons.php): jedna siva obrysova ikona na bielom stlpci. Farba na svg,
   nie na odkaze - stary comco.css ma .mainContainer a { color:#000 !important } */
body.nd .pagegallery .nd-subimg-ico .nd-ico { width: 34px; height: 34px; color: var(--nd-muted); transition: color .2s ease; }
body.nd .pagegallery .frame:hover .nd-subimg-ico .nd-ico { color: var(--nd-accent-ink); }
/* hover dlazdice: obrazok aj ikona sa raz nadychnu - plynulo zvacsia a vratia spat (200 ms + 200 ms), nezostanu zvacsene */
@keyframes nd-tile-breath { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
/* bez vynimky pre prefers-reduced-motion - jemny nadych ma byt vidiet aj pri systemovom obmedzeni animacii (Stefan 13.10.2026) */
body.nd .pagegallery .frame:hover .picture_col img, body.nd .pagegallery .frame:hover .nd-subimg-ico .nd-ico { animation: nd-tile-breath .4s ease-in-out; }
body.nd .pagegallery .frame .text_col { flex: 1 1 auto; display: flex; align-items: center; width: auto; height: auto; min-height: 0; padding: 8px 12px; border: 0; float: none; background: transparent; }
/* stary comco.css dava odkazu height 100 % (centroval ho vlastnym flexom) - nazov by ostal hore */
body.nd .pagegallery .frame .text_col a { flex: 1 1 auto; min-width: 0; height: auto; }
body.nd .pagegallery .frame .text_col a { display: block; font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.25; color: var(--nd-ink); text-decoration: none; }
body.nd .pagegallery .frame:hover .text_col, body.nd .pagegallery .frame .text_col:hover { background: transparent; }
/* klik po celej dlazdici: odkaz nazvu ma ::after cez cely .frame (rovnaka URL ako obrazok). Stlpce
   Bootstrapu su position:relative - museli by byt static, inak by sa vrstva roztiahla len na stlpec */
body.nd .pagegallery .frame { position: relative; cursor: pointer; }
body.nd .pagegallery .frame .picture_col, body.nd .pagegallery .frame .text_col { position: static; }
body.nd .pagegallery .frame .text_col a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
body.nd .pagegallery .frame:hover .text_col a { color: var(--nd-accent-ink); }
/* vyhladavanie (search_results.php): kategorie od 7. su v #search_expand_id vnutri mriezky - po rozbaleni
   (jQuery show() zmaze inline display:none) maju polozky zapadnut do mriezky, nie byt jednou bunkou */
body.nd .row.pagegallery > #search_expand_id { display: contents; }
body.nd #search_expand_button {
  float: none; display: inline-flex; align-items: center; gap: 6px; width: auto; height: auto; margin: 12px 0 0; padding: 8px 16px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-pill); background: var(--nd-surface);
  font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1.3; color: var(--nd-ink);
}
body.nd #search_expand_button:hover { border-color: var(--nd-accent); background: var(--nd-accent-soft); text-decoration: none; }
/* podkategorie ako zoznam (subpages_columns.php): cipy */
body.nd .subpages.row { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 24px; }
body.nd .subpages.row::before, body.nd .subpages.row::after { display: none; }
body.nd .subpages .subpages-column { display: contents; }
body.nd .subpages .subpages-column li { margin: 0; padding: 0; list-style: none; background: none; }
body.nd .subpages .subpages-column li br { display: none; }
body.nd .subpages .subpages-column a.title {
  display: inline-block; padding: 7px 14px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-pill);
  background: var(--nd-surface); font-size: var(--nd-fs-14); font-weight: 600; color: var(--nd-ink); text-decoration: none;
}
body.nd .subpages .subpages-column a.title:hover { border-color: var(--nd-accent); background: var(--nd-accent-soft); }
/* zalozky triedenia (category_sort.php): lista nad vypisom, aktivna je tmava */
body.nd .sort-tabs { align-items: center; gap: 4px; margin: 6px 0 12px; padding: 6px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); }
body.nd .sort-tabs .sort-tab {
  margin: 0; padding: 8px 16px; border: 0; border-radius: var(--nd-r); background: transparent;
  font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink-2);
}
body.nd .sort-tabs .sort-tab:hover, body.nd .sort-tabs .sort-tab:focus { background: var(--nd-surface-2); color: var(--nd-ink); }
body.nd .sort-tabs .sort-tab.active, body.nd .sort-tabs .sort-tab.active:hover { padding-top: 8px; border: 0; background: var(--nd-ink); color: #fff; }
/* strankovanie (pagination.php) */
body.nd .pagination.comco { display: block; margin: 8px 0 28px; text-align: center; }
body.nd .pagination.comco ul { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; margin: 0; padding: 0; }
body.nd .pagination.comco li { float: none; display: block; margin: 0; padding: 0; border: 0; background: none; list-style: none; }
body.nd .pagination.comco li:first-child { margin-right: 4px; font-size: var(--nd-fs-14); color: var(--nd-muted); }
body.nd .pagination.comco li a, body.nd .pagination.comco li > span {
  display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 10px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); text-decoration: none;
}
body.nd .pagination.comco li a:hover { border-color: var(--nd-accent); background: var(--nd-accent-soft); }
body.nd .pagination.comco li.active { border: 0; background: none; }
body.nd .pagination.comco li.active > span { border-color: var(--nd-ink); background: var(--nd-ink); color: #fff; }
body.nd .pagination.comco li.space > span { min-width: 20px; padding: 0; border-color: transparent; background: none; color: var(--nd-muted); }
/* bocne boxy (FILTER, Znacky v ponuke): biela hlavicka namiesto zltej */
body.nd .sideBar .panel { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: none; }
body.nd .sideBar .panel > .panel-body { border: 0; }
body.nd .sideBar .panel > .panel-heading, body.nd #ntf-filter .ntf-title {
  height: auto; padding: 13px 16px; line-height: 1.25; border-bottom: 1px solid var(--nd-line-2); border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0;
  background: var(--nd-surface); font-family: var(--nd-font-display); font-size: 17px; font-weight: 700;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd .sideBar .panel > .panel-heading * { font: inherit; color: inherit; text-transform: inherit; }
/* ikony FontAwesome 6 v nadpise boxu: font: inherit im bral pismo ikon, namiesto ikony bol stvorcek (sipka ukazat vo VIN strome, 14.10.2026) */
body.nd .sideBar .panel > .panel-heading :is(.fa, .fas, .fa-solid) { font-family: var(--fa-style-family, "Font Awesome 6 Free"); font-weight: var(--fa-style, 900); line-height: 1; }
body.nd .sideBar .panel > .panel-heading :is(.far, .fa-regular) { font-family: "Font Awesome 6 Free"; font-weight: 400; line-height: 1; }
body.nd .sideBar .panel > .panel-heading :is(.fab, .fa-brands) { font-family: "Font Awesome 6 Brands"; font-weight: 400; line-height: 1; }
/* fasetovy filter (ntfacets/render.php) */
body.nd #ntf-filter { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); }
body.nd #ntf-filter .panel-body { padding: 14px 16px 16px; }
body.nd #ntf-filter .ntf-group { margin: 0; padding: 14px 0 0; border: 0; border-top: 1px solid var(--nd-line-2); }
body.nd #ntf-filter .ntf-group:first-child { padding-top: 0; border-top: 0; }
body.nd #ntf-filter .ntf-group + .ntf-group { margin-top: 14px; }
body.nd #ntf-filter .ntf-group-title { margin: 0 0 8px; font-size: var(--nd-fs-12); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--nd-muted); }
body.nd #ntf-filter .ntf-opt label { display: flex; align-items: center; gap: 9px; padding: 4px 0; font-size: var(--nd-fs-14-5); line-height: 1.3; color: var(--nd-ink-2); }
body.nd #ntf-filter .ntf-opt input { flex: 0 0 auto; width: 17px; height: 17px; margin: 0; accent-color: var(--nd-ink); }
body.nd #ntf-filter .ntf-opt .ntf-cnt {
  margin-left: auto; padding: 1px 7px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
  font-size: var(--nd-fs-11-5); font-weight: 600; line-height: 1.5; color: var(--nd-muted);
}
/* znacka s normami: v starom dizajne je policko absolutne a popis ma padding-left; tu je popis flex, policko ide do toku */
body.nd #ntf-filter .ntf-opt.ntf-has-sub > label { padding-left: 0; }
body.nd #ntf-filter .ntf-opt.ntf-has-sub > label > input { position: static; top: auto; }
body.nd #ntf-filter .ntf-sub { border-left: 0; }
body.nd #ntf-filter .ntf-sub .ntf-opt label { font-size: var(--nd-fs-13-5); }
body.nd #ntf-filter .ntf-sub-more { font-size: var(--nd-fs-12); color: var(--nd-muted); }
body.nd #ntf-filter .ntf-opts.ntf-scroll { scrollbar-width: thin; }
body.nd #ntf-filter .ntf-apply {
  display: block; width: 100%; height: 44px; margin-top: 16px; border: 0; border-radius: var(--nd-r);
  background: var(--nd-accent); font-size: var(--nd-fs-15); font-weight: 700; text-transform: none; color: var(--nd-on-accent);
}
body.nd #ntf-filter .ntf-apply:hover { background: var(--nd-accent-deep); }
/* blok Znacky v ponuke (blocks/pages.php): select */
body.nd .sideBar .pages-select select { height: 42px; border: 1px solid var(--nd-line); border-radius: var(--nd-r); font-size: var(--nd-fs-14-5); text-transform: none; color: var(--nd-ink-2); }
/* stary formular filtra je pri fazetach prazdny (filter.php ho nevyplni), na desktope len odsuval vypis o 23 px */
body.nd.ntf-on .ntf-main .category-filter { display: none; }
/* ziadne produkty po filtri */
body.nd .no-products-found { margin: 10px 0 24px; padding: 18px; border: 1px dashed var(--nd-line); border-radius: var(--nd-r-lg); text-align: center; color: var(--nd-muted); }
@media (max-width: 1199px) {
  body.nd .row.pagegallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  body.nd .breadcrumb { padding: 8px 0 2px; font-size: var(--nd-fs-13); }
  body.nd .mainContainer > .clearfix > .shortdesc { margin-bottom: 12px; font-size: var(--nd-fs-14-5); }
  body.nd .row.pagegallery { gap: 8px; margin-bottom: 18px; }
  body.nd .pagegallery .frame { min-height: 50px; }
  body.nd .pagegallery .frame .picture_col { flex-basis: 50px; width: 50px; min-height: 48px; padding: 4px 0 4px 6px; }
  body.nd .pagegallery .nd-subimg-ico .nd-ico { width: 30px; height: 30px; }
  body.nd .pagegallery .frame .picture_col img { max-height: 38px; }
  body.nd .pagegallery .frame .text_col { padding: 6px 8px 6px 10px; }
  /* 15 px: dlhe slovo (Motolekárnička) by pri 320 px vytlacilo dlazdicu za okraj - delenie slov, inak zlom kdekolvek */
  body.nd .pagegallery .frame .text_col a { font-size: var(--nd-fs-13-5); hyphens: auto; overflow-wrap: anywhere; }
  /* lista Filter / Zoradit: biele tlacidla s ramikom namiesto dvoch zltych pasov */
  /* top 33 px bol pre pevnu hornu listu stareho dizajnu; mobilna hlavicka nd neodpruzi, nad listou presvital vypis */
  body.nd.ntf-on #ntf-bar { top: 0; padding: 6px 0 4px; background: var(--nd-surface); }
  body.nd.ntf-on .ntf-bar-btn, body.nd .cst-bar-btn {
    min-height: 46px; padding: 8px 10px; border: 1px solid var(--nd-ink); border-radius: var(--nd-r);
    background: var(--nd-surface); font-size: var(--nd-fs-15); color: var(--nd-ink);
  }
  body.nd.ntf-on .ntf-bar-badge, body.nd .cst-bar-cur { background: var(--nd-ink); color: #fff; }
  body.nd #cst-bar { margin: 4px 0 12px; }
  body.nd.ntf-open #ntf-filter .ntf-title { border-radius: 0; }
  body.nd #cst-panel .cst-title { background: var(--nd-surface); border-bottom: 1px solid var(--nd-line); font-family: var(--nd-font-display); font-size: 18px; }
  body.nd #cst-panel .cst-list .cst-opt.active::after { color: var(--nd-ok); }
  body.nd .pagination.comco li a, body.nd .pagination.comco li > span { min-width: 38px; height: 38px; }
}

/* ==== TecDoc vypis dielov (/autodiely/...) - variant A, krok 3 ====
   Len CSS nad markupom modulu autodiely (show_parts.php, show_product_in_category.php).
   Karta: mriezka obrazok | nazov + parametre | cena, title a body su display: contents.
   Na .ad-product ani predkoch nesmie byt transform/filter: modal terminov dorucenia je position: fixed vnutri karty. */
body.nd #ad-column-right .breadcrumb.autodiely { margin-bottom: 14px; }
/* zalozky Osobne / Dodavky / Nakladne / Moto */
body.nd #ad-column-right .ad_top_tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
body.nd #ad-column-right .ad_top_tabs::before, body.nd #ad-column-right .ad_top_tabs::after { content: none; }
body.nd #ad-column-right .ad_top_tabs .ad-top-tab { float: none; width: auto; padding: 0; }
body.nd #ad-column-right .ad_top_tabs a {
  display: inline-flex; align-items: center; gap: 8px; height: 38px; margin: 0; padding: 0 14px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-pill); background: var(--nd-surface);
  font-family: var(--nd-font-body); font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1; text-transform: none; color: var(--nd-ink-2) !important; text-decoration: none !important;
}
body.nd #ad-column-right .ad_top_tabs a:hover { border-color: var(--nd-ink); background: var(--nd-surface); color: var(--nd-ink) !important; }
body.nd #ad-column-right .ad_top_tabs a.active { border-color: var(--nd-ink); background: var(--nd-ink); color: #fff !important; }
body.nd #ad-column-right .ad_top_tabs a img { width: auto; height: 18px; margin: 0; }
body.nd #ad-column-right .ad_top_tabs a.active img { filter: invert(1); }
/* nadpis, uvod, cesta v strome */
body.nd #ad-column-right-inner h1 {
  margin: 4px 0 8px; font-family: var(--nd-font-display); font-size: clamp(24px, 2.4vw, 30px); font-weight: 700;
  line-height: 1.15; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd #ad-column-right-inner h1 small {
  display: block; margin-top: 6px; font-family: var(--nd-font-body); font-size: var(--nd-fs-15); font-weight: 500;
  line-height: 1.35; text-transform: none; color: var(--nd-muted);
}
body.nd #ad-column-right-inner > br { display: none; }
body.nd #ad-column-right-inner > p { margin: 0 0 16px; font-size: var(--nd-fs-15); color: var(--nd-ink-2); }
body.nd #ad-column-right-inner > h3 {
  margin: 4px 0 14px; font-family: var(--nd-font-body); font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.4;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd #ad-column-right-inner > h3 a { font-weight: 500; color: var(--nd-muted) !important; text-decoration: none !important; }
body.nd #ad-column-right-inner > h3 a:hover { color: var(--nd-ink) !important; text-decoration: underline !important; }
body.nd #parts-list .parts_info_text, body.nd #ad-column-right-inner > .parts_info_text { margin: 0 0 16px; font-size: var(--nd-fs-15); line-height: 1.55; color: var(--nd-ink-2); }
body.nd #parts-list .parts_info_text a, body.nd #ad-column-right-inner > .parts_info_text a { color: var(--nd-accent-ink) !important; }
/* vyhladavanie dielov pre auto */
body.nd #search_box_car {
  margin: 0 0 18px; padding: 14px 16px 16px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  background: var(--nd-surface-2); text-align: left;
}
body.nd #search_box_car > span { display: block; margin: 0 0 8px; font-size: var(--nd-fs-15); color: var(--nd-muted); }
body.nd #search_box_car > span b { color: var(--nd-ink); }
body.nd #search_box_car .input-group { display: flex; width: 100%; }
body.nd #search_box_car .input-group .searchInput {
  flex: 1 1 auto; height: 44px; padding: 0 14px; border: 1px solid var(--nd-line); border-right: 0;
  border-radius: var(--nd-r) 0 0 var(--nd-r); background: var(--nd-surface); font-size: var(--nd-fs-15); box-shadow: none;
}
body.nd #search_box_car .input-group .searchInput:focus { border-color: var(--nd-ink); outline: 0; }
body.nd #search_box_car .input-group .search-btn {
  flex: 0 0 auto; width: auto; height: 44px; padding: 0 18px; border: 0; border-radius: 0 var(--nd-r) var(--nd-r) 0;
  background: var(--nd-accent); font-size: var(--nd-fs-14-5); font-weight: 700; letter-spacing: .02em; color: var(--nd-on-accent);
}
body.nd #search_box_car .input-group .search-btn:hover { background: var(--nd-accent-deep); }
body.nd #ad-column-right-inner > .row > [class*="col-"]:has(> #search_box_car) { width: 100%; margin-left: 0; }
body.nd #ad-column-right-inner > .row > [class*="col-"] > #search_box_car ~ br { display: none; }

/* karta dielu */
body.nd .ad-product {
  display: grid; grid-template-columns: 128px minmax(0, 1fr) 236px; grid-template-rows: auto auto auto 1fr;
  grid-template-areas: "img man price" "img title price" "img oe price" "img info price"; column-gap: 22px;
  margin: 0 0 14px !important; padding: 16px 18px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  position: relative; background: var(--nd-surface); font-size: var(--nd-fs-14); color: var(--nd-ink-2);
}
body.nd .ad-product:hover { border-color: #d3d6da; box-shadow: var(--nd-shadow-sm); }
body.nd .ad-product .ad-product-title, body.nd .ad-product .ad-product-body { display: contents; }
body.nd .ad-product::before, body.nd .ad-product::after,
body.nd .ad-product .ad-product-title::before, body.nd .ad-product .ad-product-title::after,
body.nd .ad-product .ad-product-body::before, body.nd .ad-product .ad-product-body::after { content: none; }
body.nd .ad-product .ad-product-body > .stopflow { display: none; }
body.nd .ad-product .ad-product-body > [class*="col-"] { float: none; width: auto; min-width: 0; padding: 0; }
body.nd .ad-product .ad-product-man { grid-area: man; float: none; margin: 0 0 2px; text-align: left; }
body.nd .ad-product .ad-product-man .man-text {
  font-size: var(--nd-fs-12-5); line-height: 1.3; letter-spacing: .05em; text-transform: uppercase; color: var(--nd-muted) !important; text-decoration: none !important;
}
body.nd .ad-product .ad-product-man .man-text strong { font-weight: 700; }
body.nd .ad-product .ad-product-man .man-text:hover { color: var(--nd-ink) !important; }
body.nd .ad-product .ad-product-title h2 {
  grid-area: title; margin: 0 0 10px; padding: 0; font-family: var(--nd-font-body); font-size: 17px !important;
  font-weight: 600; line-height: 1.3; letter-spacing: 0; text-align: left; text-transform: none; color: var(--nd-ink);
}
body.nd .ad-product .ad-product-title h2 a { color: var(--nd-ink) !important; text-decoration: none !important; }
body.nd .ad-product .ad-product-title h2 a:hover { color: var(--nd-accent-ink) !important; text-decoration: underline !important; }
/* obrazok, lupa, kod */
body.nd .ad-product .ad-product-image-place { grid-area: img; display: flex; flex-direction: column; align-items: center; gap: 8px; }
body.nd .ad-product .ad-product-img { float: none; width: 100%; height: auto; padding: 0; text-align: center; }
body.nd .ad-product .ad-product-img > a { display: flex; align-items: center; justify-content: center; height: 120px; }
body.nd .ad-product .ad-product-img img.ad-lupa-image { width: auto; max-width: 100%; max-height: 120px; height: auto; object-fit: contain; }
body.nd .ad-product .ad-product-img .ad-lupa {
  display: inline-flex; align-items: center; gap: 5px; width: auto; margin: 6px 0 0; padding: 0; border: 0;
  background: none; font-size: var(--nd-fs-12-5); line-height: 1.3; color: var(--nd-muted); cursor: zoom-in;
}
body.nd .ad-product .ad-product-img .ad-lupa img { opacity: .6; }
/* parametre */
body.nd .ad-product .ad-product-info { grid-area: info; position: static; float: none; font-size: var(--nd-fs-15); line-height: 1.45; color: var(--nd-ink-2); }
/* ikonka strany montaze na urovni nadpisu: float v parametroch zuzoval prve riadky tabulky */
body.nd .ad-product .ad-product-info .pf-ms { position: absolute; top: 16px; right: 276px; float: none; margin: 0; }
body.nd .ad-product .ad-product-info .pf-ms-svg { width: 28px; height: 45px; }
body.nd .ad-product:has(.pf-ms) .ad-product-man, body.nd .ad-product:has(.pf-ms) .ad-product-title h2 { padding-right: 40px; }
body.nd .ad-product .ad-product-info .ad-detail-labels { margin: 0 0 8px; }
body.nd .ad-product .ad-product-info .ad-detail-label {
  margin: 0 4px 4px 0; padding: 3px 8px; border-radius: var(--nd-r-sm); font-size: var(--nd-fs-11-5); letter-spacing: .02em; line-height: 1.3;
}
body.nd .ad-product .ad-product-info .ad-oem-lead { margin: 0 0 8px; font-size: var(--nd-fs-15); line-height: 1.45; color: var(--nd-muted); }
body.nd .ad-product .ad-product-info ul { margin: 6px 0 0; padding: 0; list-style: none; }
body.nd .ad-product .ad-product-info ul + ul { margin-top: 10px; }
body.nd .ad-product .ad-product-info ul li {
  display: flex; align-items: baseline; gap: 10px; margin: 0 !important; padding: 4px 0; border-bottom: 1px solid var(--nd-line-2);
  font-size: var(--nd-fs-15); line-height: 1.35; list-style: none;
}
body.nd .ad-product .ad-product-info ul li:last-child { border-bottom: 0; }
body.nd .ad-product .ad-product-info ul li .info-text { flex: 0 1 auto; color: var(--nd-muted); }
body.nd .ad-product .ad-product-info ul li > b, body.nd .ad-product .ad-product-info ul li > .info-value {
  margin-left: auto; font-weight: 600; text-align: right; color: var(--nd-ink);
}
body.nd .ad-product .ad-product-info a { color: var(--nd-accent-ink) !important; }
body.nd .ad-product .ad-product-info a:hover { color: var(--nd-ink) !important; }
/* cena, kosik, dorucenie */
body.nd .ad-product .ad-product-price {
  grid-area: price; display: flex; flex-direction: column; gap: 10px; padding: 0; border: 0; text-align: right;
}
body.nd .ad-product .ad-product-price > br { display: none; }
body.nd .ad-product .ad-product-price .product-price { margin: 0; padding: 0; text-align: right; }
body.nd .ad-product .ad-product-price .product-price::before, body.nd .ad-product .ad-product-price .product-price::after { content: none; }
body.nd .ad-product .ad-product-price .product-price .price-vat {
  margin: 0; font-family: var(--nd-font-display); font-size: 25px; font-weight: 700; line-height: 1.1; text-align: right; color: var(--nd-ink);
}
body.nd .ad-product .ad-product-price .product-price .price-novat { margin: 2px 0 0; font-size: var(--nd-fs-13); text-align: right; line-height: 1.3; color: var(--nd-muted); }
/* B2B (body.b2b-customer = Customer::show_b2b_prices(), layout_head.php): comco.css posunie cenu bez DPH cez order
   na prve miesto - velka ma byt ona, styl cien sa vymeni 1:1 (08.10.2026) */
body.nd.b2b-customer .ad-product .ad-product-price .product-price .price-novat {
  margin: 0; font-family: var(--nd-font-display); font-size: 25px; font-weight: 700; line-height: 1.1; color: var(--nd-ink);
}
body.nd.b2b-customer .ad-product .ad-product-price .product-price .price-vat { margin: 2px 0 0; font-family: inherit; font-size: var(--nd-fs-13); font-weight: 400; line-height: 1.3; color: var(--nd-muted); }
body.nd .ad-product .ad-product-price .ad-price-col { float: none; width: auto; padding: 0; }
body.nd .ad-product .ad-product-price form.basket { margin: 0; font-size: var(--nd-fs-14); text-align: right; }
body.nd .ad-product .ad-product-price fieldset.buy { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 0; padding: 0 !important; border: 0; font-size: var(--nd-fs-14); color: var(--nd-muted); }
body.nd .ad-product .ad-product-price .ad-qty-stepper { height: 38px; margin: 0; border-color: var(--nd-line); border-radius: var(--nd-r); }
body.nd .ad-product .ad-product-price .ad-qty-stepper .ad-qty-btn { width: 30px; color: var(--nd-ink-2); }
body.nd .ad-product .ad-product-price .ad-qty-stepper input.ad-cart-qty { width: 34px; height: 100%; padding: 0; font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }
body.nd .ad-product .ad-product-price .button.buy {
  display: inline-flex; align-items: center; justify-content: center; gap: 2px; flex: 1 1 auto; height: 38px; margin: 0 0 0 auto;
  padding: 0 12px; border-radius: var(--nd-r); font-size: var(--nd-fs-15); font-weight: 700; white-space: nowrap;
}
body.nd .ad-product .ad-delivery-box { margin: 10px 0 0; font-size: var(--nd-fs-13-5); line-height: 1.45; text-align: right; }
body.nd .ad-product .ad-delivery-box .ad-de-badge {
  display: inline-flex; align-items: center; gap: 4px; max-width: 100%; margin: 0 0 4px; padding: 4px 9px; border: 0;
  border-radius: var(--nd-r-pill); background: var(--nd-ok-soft); color: var(--nd-ok); font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1.15; white-space: normal;
}
body.nd .ad-product .ad-delivery-box .ad-de-check { margin: 0; }
body.nd .ad-product .ad-delivery-box .ad-de-stock, body.nd .ad-product .ad-delivery-box .ad-de-24h { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .ad-product .ad-delivery-box a.ad-de-link { display: block; margin: 5px 0 0; font-size: var(--nd-fs-13); text-align: right; }
body.nd .ad-product .ad-delivery-box .ad-de-ltext { max-width: none; text-align: right; }
body.nd .ad-product .ad-delivery-box .ad-de-i { width: 1.5em; height: 1.5em; line-height: 1.5em; margin-right: .45em; border-radius: 50%; vertical-align: middle; }
body.nd .ad-product .ad-delivery-box .ad-de-urgency {
  margin: 7px 0 0; padding: 6px 9px; border-left: 0; border-right: 3px solid var(--nd-accent-deep); border-radius: var(--nd-r-sm) 0 0 var(--nd-r-sm); font-size: var(--nd-fs-13);
}

/* lavy stlpec: Vozidlo, Filter, strom kategorii */
body.nd :is(#ad-column-left, #nd-veh-host) .ad-car-select.panel, body.nd #ad-column-left .ad-tree.panel {
  margin-bottom: 16px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: none;
}
body.nd #ad-column-left > br { display: none; }
body.nd :is(#ad-column-left, #nd-veh-host) .ad-car-select > .panel-body { margin: 0; padding: 14px 16px 16px; border: 0; background: var(--nd-surface); }
body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form select.form-control {
  height: 40px; margin: 0 0 8px; border: 1px solid var(--nd-line); border-radius: var(--nd-r); font-size: var(--nd-fs-14-5); color: var(--nd-ink-2); box-shadow: none;
}
body.nd #parts-filter > .panel-body { padding: 14px 16px 16px; font-size: var(--nd-fs-14-5); }
body.nd #parts-filter .pf-group { margin: 0; padding: 14px 0 0; border: 0; border-top: 1px solid var(--nd-line-2); }
body.nd #parts-filter .pf-group:first-child { padding-top: 0; border-top: 0; }
body.nd #parts-filter .pf-group + .pf-group { margin-top: 14px; }
body.nd #parts-filter .pf-title {
  margin: 0 0 8px; font-family: var(--nd-font-body); font-size: var(--nd-fs-12); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--nd-muted);
}
body.nd #parts-filter .pf-opt {
  display: flex; align-items: center; gap: 9px; margin: 0; padding: 4px 0; font-size: var(--nd-fs-14-5); font-weight: 400; line-height: 1.3; color: var(--nd-ink-2); cursor: pointer;
}
body.nd #parts-filter .pf-opt input { flex: 0 0 auto; width: 17px; height: 17px; margin: 0; accent-color: var(--nd-ink); }
body.nd #parts-filter .pf-opt .pf-count {
  margin-left: auto; padding: 1px 7px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
  font-size: var(--nd-fs-11-5); font-weight: 600; line-height: 1.5; color: var(--nd-muted);
}
body.nd #parts-filter .pf-opt.pf-zero { color: var(--nd-muted-2); }
body.nd #parts-filter .pf-opts.pf-scroll { scrollbar-width: thin; }
body.nd #ad-column-left .ad-structure-wrapper { padding: 10px 12px 14px; font-size: var(--nd-fs-14-5); }
body.nd #ad-column-left .ad-structure-wrapper .ad-fright { margin: 0 0 6px; font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd #ad-column-left .ad-structure-wrapper .ad-fright a { color: var(--nd-accent-ink) !important; }
body.nd #ad-column-left ul.ad-structure { margin: 0; padding: 0; }
body.nd #ad-column-left ul.ad-structure li { border-color: var(--nd-line-2); }
body.nd #ad-column-left ul.ad-structure li > a { display: block; padding: 6px 4px; border-radius: var(--nd-r-sm); color: var(--nd-ink-2) !important; text-decoration: none !important; }
body.nd #ad-column-left ul.ad-structure li > a:hover { background: var(--nd-surface-2); color: var(--nd-ink) !important; }
body.nd #ad-column-left ul.ad-structure li > a.ad-branch-selected { background: var(--nd-accent-soft); font-weight: 700; color: var(--nd-ink) !important; }
body.nd #ad-column-left ul.ad-structure .ad-li-inner { line-height: 1.35; }

/* 768 - 1199 px: cena pod parametrami cez celu sirku */
@media (max-width: 1199px) {
  body.nd .ad-product { grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto auto auto 1fr auto; grid-template-areas: "img man" "img title" "img oe" "img info" "price price"; }
  body.nd .ad-product .ad-product-price {
    display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 24px; margin-top: 14px; padding: 0;
  }
  body.nd .ad-product .ad-product-price .product-price { text-align: left; }
  body.nd .ad-product .ad-product-price .product-price .price-vat, body.nd .ad-product .ad-product-price .product-price .price-novat { text-align: left; }
  body.nd .ad-product .ad-product-info .pf-ms { right: 18px; }
  body.nd .ad-product .ad-product-price fieldset.buy { justify-content: flex-end; }
  body.nd .ad-product .ad-product-price .button.buy { flex: 0 0 auto; margin: 0; }
  body.nd .ad-product .ad-delivery-box { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; column-gap: 12px; }
  body.nd .ad-product .ad-delivery-box .ad-de-urgency { flex: 0 0 100%; }
}
@media (max-width: 767px) {
  /* karta dielu ako karta slidera (.nd-pcard, Stefan 13.10.2026): hore obrazok na stred, pod nim vyrobca, cely nazov,
     parametre, cena, riadok stepper + Kupit a dostupnost; kod tovaru vo vypise nie je (Stefan 22.10.2026, COMCO-98 F28).
     Markup je ten isty ako na desktope - obal obrazka (.ad-product-image-place) je display contents. */
  body.nd .ad-product {
    grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-template-areas: "img" "man" "title" "oe" "info" "price";
    column-gap: 0; margin-bottom: 12px !important; padding: 10px 14px 14px;
  }
  body.nd .ad-product .ad-product-image-place { display: contents; }
  body.nd .ad-product .ad-product-img { grid-area: img; margin: 0 0 10px; }
  /* box ako .nd-pcard__media na mobile (4:3), ale obrazok najviac 250 px - nahlad je 500 px, vacsi by bol rozmazany
     na slabsich displejoch a karta by bola vyssia ako obrazovka; comco.css dava obrazku 80 % !important */
  body.nd .ad-product .ad-product-img > a { height: auto; aspect-ratio: 4 / 3; max-height: 250px; }
  body.nd .ad-product .ad-product-img img.ad-lupa-image { width: auto !important; max-width: min(100%, 250px); max-height: min(100%, 250px); }
  body.nd .ad-product .ad-product-img .ad-lupa { display: none; }
  /* vyrobca: Bootstrap .hidden-xs ho na mobile skryva (display none !important) */
  body.nd .ad-product .ad-product-man.hidden-xs { display: block !important; margin: 0 0 4px; }
  body.nd .ad-product .ad-product-man img { max-width: 100%; height: auto; }
  body.nd .ad-product .ad-product-title h2 { margin: 0 0 8px; font-size: 16px !important; line-height: 1.3; }
  body.nd .ad-product:has(.pf-ms) .ad-product-man, body.nd .ad-product:has(.pf-ms) .ad-product-title h2 { padding-right: 0; }
  body.nd .ad-product .ad-product-info { position: static; margin-top: 2px; }
  body.nd .ad-product .ad-product-info ul li { padding: 4px 0; font-size: var(--nd-fs-14); }
  /* ikonka strany montaze v pravom hornom rohu karty vedla obrazka (obrazok je na stred, po bokoch je volno) */
  body.nd .ad-product .ad-product-info .pf-ms { top: 12px; right: 14px; left: auto; }
  body.nd .ad-product .ad-product-price { display: block; margin-top: 12px; text-align: left; }
  body.nd .ad-product .ad-product-price .product-price, body.nd .ad-product .ad-product-price .product-price .price-vat, body.nd .ad-product .ad-product-price .product-price .price-novat { text-align: left; }
  body.nd .ad-product .ad-product-price .product-price .price-vat { font-size: 24px; }
  body.nd.b2b-customer .ad-product .ad-product-price .product-price .price-novat { font-size: 24px; }
  body.nd .ad-product .ad-product-price .row-fluid.product-price { margin-top: 10px; }
  body.nd .ad-product .ad-product-price form.basket { text-align: left; }
  body.nd .ad-product .ad-product-price fieldset.buy { justify-content: flex-start; gap: 8px; }
  body.nd .ad-product .ad-product-price .ad-qty-stepper { flex: 0 0 auto; height: 42px; }
  body.nd .ad-product .ad-product-price .ad-qty-stepper .ad-qty-btn { width: 34px; }
  body.nd .ad-product .ad-product-price .ad-qty-stepper input.ad-cart-qty { width: 36px; margin: 0; }
  body.nd .ad-product .ad-product-price .button.buy { flex: 1 1 auto; gap: 8px; height: 42px; margin: 0 0 0 2px; padding: 0 16px; }
  body.nd .ad-product .ad-delivery-box { display: block; margin-top: 12px; text-align: left; }
  body.nd .ad-product .ad-delivery-box a.ad-de-link { justify-content: flex-start; text-align: left; }
  body.nd .ad-product .ad-delivery-box .ad-de-ltext { text-align: left; }
  body.nd .ad-product .ad-delivery-box .ad-de-urgency {
    padding: 5px 8px; border-left: 3px solid var(--nd-accent-deep); border-right: 0; border-radius: 0 var(--nd-r-sm) var(--nd-r-sm) 0; text-align: left;
  }
  /* lista Filtrovat / Kategorie: rovnako ako na vypise kategorie */
  body.nd #pf-bar { top: 0; padding: 6px 0 4px; background: var(--nd-surface); }
  body.nd .pf-bar-btn { min-height: 46px; padding: 8px 10px; border: 1px solid var(--nd-ink); border-radius: var(--nd-r); background: var(--nd-surface); font-size: var(--nd-fs-15); color: var(--nd-ink); }
  body.nd .pf-bar-badge { background: var(--nd-ink); color: #fff; }
  body.nd.pf-open-filter #ad-column-left #parts-filter, body.nd.pf-open-cats #ad-column-left .ad-tree.panel { margin: 0; border: 0; border-radius: 0; }
  body.nd.pf-drawer-open #ad-column-left .panel > .panel-heading { border-radius: 0; }
  /* Vozidlo az pod dielmi - na mobile je prvy dielec inak az po dvoch obrazovkach vyberu auta */
  body.nd .row:has(> #ad-column-left):has(.ad-product) { display: flex; flex-direction: column; }
  body.nd .row:has(> #ad-column-left):has(.ad-product) > #ad-column-left { order: 2; }
}

/* ==== Detail produktu (bezny produkt aj TecDoc diel) - facelift ====
   Len CSS nad existujucim markupom .singleProduct; rozlozenie stlpcov ostava. Pravy stlpec
   (#ad-detail-right-col) je na desktope zarovnany doprava, na mobile na stred - to sa nemeni. */
body.nd .singleProduct h1.name {
  font-family: var(--nd-font-display); font-size: clamp(24px, 2.4vw, 30px); font-weight: 700;
  line-height: 1.15; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd .singleProduct .product-brand-line { font-size: var(--nd-fs-14); color: var(--nd-muted); }
body.nd .singleProduct .product-brand-line a { font-weight: 600; color: var(--nd-accent-ink) !important; }
body.nd .singleProduct .ad-detail-labels .ad-detail-label {
  padding: 3px 8px; border-radius: var(--nd-r-sm); font-size: var(--nd-fs-12); letter-spacing: .02em; line-height: 1.3;
}
/* obrazok */
body.nd .singleProduct .td-product-imgs .product-img { overflow: hidden; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); }
body.nd .singleProduct .td-product-imgs img.tdimgs { border-color: var(--nd-line); border-radius: var(--nd-r-sm); transition: border-color .15s; }
body.nd .singleProduct .td-product-imgs a:hover img.tdimgs { border-color: var(--nd-ink); }
/* Detail: breadcrumb cez celu sirku, obrazok az pod nim na urovni nazvu (Stefan 12.10.2026). Markup product_respo.php:
   .singleProduct > [.td-product-imgs (col-sm-3), .col-sm-9 > .row > [pad s breadcrumbom, pad s nazvom, pravy stlpec
   col-sm-4 push-8, popis col-sm-8 pull-4]]. .col-sm-9 a jeho .row su display: contents, ich deti su polozky mriezky
   .singleProduct; stlpce 25 / 50 / 25 % = doterajsie col-sm-3 / col-sm-9 x (8 + 4). Padding stlpcov ostava (15 px).
   Clearfix ::before/::after .row by boli polozky mriezky. Push/pull (left/right) a floaty zrusene. #sbb (zdielanie)
   ma polohu z jQuery position() voci offsetParent - s relative .singleProduct ostava pri ikone. */
body.nd .row.singleProduct { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; }
body.nd .row.singleProduct::before, body.nd .row.singleProduct::after,
body.nd .singleProduct > .col-sm-9 > .row::before, body.nd .singleProduct > .col-sm-9 > .row::after { content: none; display: none; }
body.nd .singleProduct > .col-sm-9, body.nd .singleProduct > .col-sm-9 > .row { display: contents; }
body.nd .singleProduct > .td-product-imgs, body.nd .singleProduct > .col-sm-9 > .row > [class*='col-'] { float: none; width: auto; min-width: 0; left: auto; right: auto; }
/* medzera pod breadcrumbom ako nad nim (14 px od pasu auta po text; Stefan 12.10.2026): bez paddingu obalu (15 px)
   a spodneho okraja breadcrumbu (4 px), obrazok (comco.css .td-product-imgs margin-top 10 px) 6 px pod obalom */
body.nd .singleProduct > .col-sm-9 > .row > .ad-detail-pad:first-child { padding-bottom: 0; }
body.nd .singleProduct .breadcrumb.product { margin-bottom: 0; }
body.nd .singleProduct > .td-product-imgs { margin-top: 6px; }
/* mobil: breadcrumb prvy, potom obrazok, nazov, kupit, popis (poradie z HTML) */
body.nd .singleProduct > .col-sm-9 > .row > .ad-detail-pad:first-child { order: -1; }
@media (min-width: 768px) {
  body.nd .row.singleProduct { grid-template-columns: 25% 50% 25%; }
  body.nd .singleProduct > .col-sm-9 > .row > .ad-detail-pad:first-child { grid-column: 1 / -1; grid-row: 1; }
  body.nd .singleProduct > .td-product-imgs { grid-column: 1; grid-row: 2 / span 2; }
  /* nazov len nad popisom, kupna dlazdica vpravo od riadku nazvu (Stefan 12.10.2026: vrch dlazdice na urovni titulku) */
  body.nd .singleProduct > .col-sm-9 > .row > .ad-detail-pad + .ad-detail-pad { grid-column: 2; grid-row: 2; }
  body.nd .singleProduct > .col-sm-9 > .row > .col-sm-8 { grid-column: 2; grid-row: 3; }
  body.nd .singleProduct > .col-sm-9 > .row > .col-sm-4 { grid-column: 3; grid-row: 2 / span 2; }
  body.nd .singleProduct #ad-detail-right-col { margin-top: 6px; }   /* vrch v rovine s obrazkom (.td-product-imgs margin-top 6 px) */
}
/* pravy stlpec (cena, kupit, sklad, doprava) ako biela dlazdica - prototyp pages-product.jsx .pdp-buy.card (padding 18) */
body.nd .singleProduct #ad-detail-right-col {
  padding: 18px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
}
/* desktop: dlazdica sa lepi pod menu a pas auta, kym sa posuva popis (Stefan 12.10.2026; prototyp .pdp-buy sticky).
   Stlpec sa natiahne na vysku riadku s popisom (mriezka ma align-items: start - inak by sticky nemal kam ist).
   Len ked sa dlazdica (~625 px s vyberom varianty) aj s hlavickou a pasom auta (~190 px) zmesti do okna, inak by spodok
   (Mate otazku…) nebol vidiet az do konca popisu. */
@media (min-width: 992px) and (min-height: 840px) {
  body.nd .singleProduct > .col-sm-9 > .row > .col-sm-4 { align-self: stretch; }
  body.nd .singleProduct #ad-detail-right-col { position: sticky; top: calc(var(--nd-nav-bot, var(--nd-hdr-vis, 0px)) + var(--nd-car-h, 0px) + 16px); }
}
/* spodny okraj posledneho prvku popisu (tabulka .features 20 px z Bootstrapu, posledny p 10 px - aj cez prazdny <p></p>
   na konci) prepadne az do .col-sm-8, riadok mriezky je o to vyssi a natiahnuty stlpec s dlazdicou konci pod popisom
   (detail_garage_account_test.js). flow-root ho zastavi v .ad-shortdesc, posledny prvok ho nema vobec. */
body.nd .singleProduct .ad-shortdesc { display: flow-root; }
body.nd .singleProduct .ad-shortdesc :is(.ad-product-info, .features) > :last-child { margin-bottom: 0; }
/* tablet: 25 % (200 px) by v dlazdici nechalo ~165 px - cena a sklad by sa lamali; stlpec 250 px, mensi padding */
@media (min-width: 768px) and (max-width: 991px) {
  body.nd .row.singleProduct { grid-template-columns: 25% minmax(0, 1fr) 250px; }
  body.nd .singleProduct #ad-detail-right-col { padding: 14px; }
}
/* ==== Detail na tablete a zalozky v mriezke (13.10.2026) ====
   Vyska kupnej dlazdice (riadky 2 a 3) ide cela do riadku popisu - inak sa rozdelila aj do riadku nazvu a pod
   stitkom SKLADOM IHNED ostalo pri 768 a 1024 px ~150 px prazdna (kratky popis, napr. WD-40 p3032370). */
@media (min-width: 768px) {
  body.nd .row.singleProduct { grid-template-rows: auto auto 1fr; }
}
/* Zalozky (.media.col-xs-12) su v product_respo.php za .singleProduct (sablona ju zatvori uz pred nimi), teda cez celu
   sirku. Ked popis z DB necha neuzavrety div (napr. X-CHEMIE Spider Foam p5271288), parser ich vnori do .singleProduct:
   mriezka ich dala do 1. stlpca (293 px pri 1440) a style.css (min-width 480 px) zuzi .tabArea na 348 px - pas
   nahrad mal karty 65 az 95 px. Tu cez celu sirku ako pri ostatnych produktoch. */
body.nd .singleProduct > .media.col-xs-12 { grid-column: 1 / -1; }
body.nd .singleProduct .media .media-body .tabArea { width: auto; }
/* okraj 15 px = .row.singleProduct ma zaporny okraj -15 px, beznej .media v .mainContainer chyba - zalozky lícuju
   s ostatnymi produktmi; na mobile (comco.css: .media bez paddingu) inak pas so zapornym okrajom stopy pretiekol
   stranku o 6 px. width: col-xs-12 ma 100 % - s okrajom by pretiekla. */
body.nd .singleProduct > .media.col-xs-12 { width: auto; margin: 0 15px; }
/* cena a kosik */
body.nd .singleProduct .ad-detail-cart .product-price .price-vat {
  font-family: var(--nd-font-display); font-size: 30px; font-weight: 700; line-height: 1.1; color: var(--nd-ink);
}
body.nd .singleProduct .ad-detail-cart .product-price .price-novat { margin-top: 2px; font-size: var(--nd-fs-14); color: var(--nd-muted); }
/* B2B: cena bez DPH je prva (order z comco.css), preto je velka ona (08.10.2026); na mobile velkosti
   27/19 px dava !important v comco-templates.css, tu sa vymiena pismo a farba */
body.nd.b2b-customer .singleProduct .ad-detail-cart .product-price .price-novat {
  margin-top: 0; margin-bottom: 5px; font-family: var(--nd-font-display); font-size: 30px; font-weight: 700; line-height: 1.1; color: var(--nd-ink);
}
body.nd.b2b-customer .singleProduct .ad-detail-cart .product-price .price-vat { margin-top: 2px; margin-bottom: 0; font-family: inherit; font-size: var(--nd-fs-14); font-weight: 400; line-height: inherit; color: var(--nd-muted); }
body.nd .singleProduct .ad-detail-cart fieldset.buy { gap: 6px; color: var(--nd-muted); }
body.nd .singleProduct .ad-detail-cart .ad-qty-stepper { border-color: var(--nd-line); border-radius: var(--nd-r); }
body.nd .singleProduct .ad-detail-cart .ad-qty-stepper .ad-qty-btn { color: var(--nd-ink-2); }
body.nd .singleProduct .ad-detail-cart .ad-qty-stepper input.ad-cart-qty { font-weight: 600; color: var(--nd-ink); }
body.nd .singleProduct .ad-detail-cart button.buy { border-radius: var(--nd-r); }
@media (min-width: 768px) {
  body.nd .singleProduct .ad-detail-cart .ad-qty-stepper { height: 38px; }
  body.nd .singleProduct .ad-detail-cart .ad-qty-stepper .ad-qty-btn { width: 30px; }
  body.nd .singleProduct .ad-detail-cart .ad-qty-stepper input.ad-cart-qty { width: 36px; height: 100%; padding: 0; font-size: var(--nd-fs-15); }
  body.nd .singleProduct .ad-detail-cart button.buy { height: 38px; padding: 0 14px; font-size: var(--nd-fs-15); }
}
/* 768-1199 px: pravy stlpec ma len ~210 px, stepper + ks + Kupit sa musia zmestit do riadku */
@media (min-width: 768px) and (max-width: 1199px) {
  body.nd .singleProduct .ad-detail-cart .ad-qty-stepper .ad-qty-btn { width: 26px; }
  body.nd .singleProduct .ad-detail-cart .ad-qty-stepper input.ad-cart-qty { width: 34px; }
  body.nd .singleProduct .ad-detail-cart button.buy { padding: 0 10px; }
}
/* mnozstevna zlava (Nakupte viac a usetrite): zlavnena cena ostava zelena, to je jej sprava */
body.nd .singleProduct .buy_more_and_save { margin: 12px 0 14px; padding: 10px 12px 6px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); }
body.nd .singleProduct .buy_more_and_save b.title { font-family: var(--nd-font-display); font-size: 17px; font-weight: 700; color: var(--nd-ink); }
body.nd .singleProduct .buy_more_and_save td { font-size: var(--nd-fs-14); color: var(--nd-ink-2); vertical-align: middle; }
body.nd .singleProduct .buy_more_and_save .price { font-size: var(--nd-fs-15); color: var(--nd-ok); }
body.nd .singleProduct .buy_more_and_save .price2 { font-size: var(--nd-fs-13); color: var(--nd-muted); }
/* B2B: prva (order z comco.css) a zvyraznena je cena bez DPH (08.10.2026) */
body.nd.b2b-customer .singleProduct .buy_more_and_save .price2 { font-size: var(--nd-fs-15); font-weight: 700; color: var(--nd-ok); }
body.nd.b2b-customer .singleProduct .buy_more_and_save .price { font-size: var(--nd-fs-13); font-weight: 400; color: var(--nd-muted); }
/* dorucenie */
body.nd .singleProduct .ad-detail-cart .ad-delivery-box { font-size: var(--nd-fs-13-5); line-height: 1.45; }
body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-badge {
  display: inline-flex; align-items: center; gap: 4px; max-width: 100%; margin: 0 0 4px; padding: 4px 10px; border: 0;
  border-radius: var(--nd-r-pill); background: var(--nd-ok-soft); color: var(--nd-ok); font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1.15; white-space: normal;
}
body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-check { margin: 0; }
body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-stock, body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-24h { font-size: var(--nd-fs-13); color: var(--nd-muted); }
/* odkaz ako blok: pri zarovnani doprava ostane ikonka "i" pri texte, nie odtrhnuta vlavo */
body.nd .singleProduct .ad-detail-cart .ad-delivery-box a.ad-de-link { display: block; margin: 6px 0 0; font-size: var(--nd-fs-13); }
body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-ltext { max-width: none; }
body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-i { width: 1.5em; height: 1.5em; line-height: 1.5em; margin-right: .45em; border-radius: 50%; vertical-align: middle; }
body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-urgency { margin: 8px 0 0; padding: 6px 10px; font-size: var(--nd-fs-13); }
@media (min-width: 768px) {
  body.nd .singleProduct .ad-detail-cart .ad-delivery-box, body.nd .singleProduct .ad-detail-cart .ad-delivery-box a.ad-de-link, body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-ltext { text-align: right; }
  body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-urgency { border-left: 0; border-right: 3px solid var(--nd-accent-deep); border-radius: var(--nd-r-sm) 0 0 var(--nd-r-sm); }
}
@media (max-width: 767px) {
  body.nd .singleProduct .ad-detail-cart .ad-delivery-box .ad-de-urgency { border-radius: 0 var(--nd-r-sm) var(--nd-r-sm) 0; }
}
/* vypredany produkt: stitok namiesto kriku, Strazit dostupnost ako obrysove tlacidlo */
body.nd .singleProduct .ad-detail-cart .ad-out-of-offer {
  display: inline-block; margin: 10px 0 4px; padding: 5px 14px; border-radius: var(--nd-r-pill); background: var(--nd-danger-soft);
  font-size: var(--nd-fs-15); font-weight: 700; letter-spacing: .04em; line-height: 1.2; color: var(--nd-danger);
}
body.nd .singleProduct .ad-detail-cart .ad-out-of-offer2 { font-size: var(--nd-fs-14-5); line-height: 1.5; color: var(--nd-ink-2); }
body.nd .singleProduct .ad-detail-cart a.watchdog {
  padding: 9px 16px; border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink) !important; text-decoration: none !important; transition: border-color .15s;
}
body.nd .singleProduct .ad-detail-cart a.watchdog:hover { border-color: var(--nd-ink); }
body.nd .singleProduct .product-sold-out span { color: var(--nd-danger); }
/* kod tovaru, otazka k produktu */
body.nd .singleProduct .ad-detail-sku { margin: 14px 0 12px; font-family: var(--nd-font-mono); font-size: var(--nd-fs-14); line-height: 1.4; color: var(--nd-ink-2); overflow-wrap: anywhere; }
body.nd .singleProduct .ad-detail-sku .sku { font-family: var(--nd-font-body); font-size: var(--nd-fs-13); color: var(--nd-muted); }
/* prve OE cisla hned pod nazvom v strednom stlpci (COMCO-98 F28, Stefan 22.10.2026), zarovnane vlavo ako h1.name aj na mobile;
   h1 ma margin-bottom 15 px (base/comco.css), riadok sa k nemu pritiahne. Vzhlad stitkov je spolocny s vypismi (.oe-chips nizsie) */
body.nd .singleProduct .ad-detail-oe-top { justify-content: flex-start; margin: -7px 0 12px; }
/* OE cisla ako jednoduchy sivy text bez podkladu (COMCO-98 F28), JEDEN vzhlad pre detail (.ad-detail-oe-top), dlazdicu nd (.nd-pcard) aj riadok
   TecDoc dielu (.ad-product), markup z oe_card_chips_html() v core/include/oe_numbers.php; stitok ako .oe-chip v prototype.
   Farby s !important: .mainContainer a ma #000 !important (base/comco.css) */
body.nd .oe-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
body.nd .oe-chips .oe-chips__label { font-family: var(--nd-font-body); font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .oe-chip {
  display: inline; max-width: 100%; padding: 0; border: 0; background: none;
  font-family: var(--nd-font-body); font-size: var(--nd-fs-13); font-weight: 400; line-height: 1.3; color: var(--nd-muted) !important; text-decoration: none !important; overflow-wrap: anywhere;
}
body.nd .oe-chip:hover, body.nd .oe-chip:focus { color: var(--nd-ink) !important; text-decoration: underline !important; }
/* .oe-chips__item = cislo + ciarka za nim (v HTML, nie za poslednym), ciarka farbou ako cislo */
body.nd .oe-chips .oe-chips__item { font-family: var(--nd-font-body); font-size: var(--nd-fs-13); line-height: 1.3; color: var(--nd-muted); }
body.nd .oe-chips .oe-chips-more { font-size: var(--nd-fs-13); font-weight: 400; color: var(--nd-muted) !important; }
body.nd .oe-chips .oe-chips-more:hover, body.nd .oe-chips .oe-chips-more:focus { color: var(--nd-ink) !important; text-decoration: underline !important; }
/* riadok TecDoc dielu: stitky su v .ad-product-title (display contents) hned za h2, vlastny riadok mriezky "oe" */
body.nd .ad-product .ad-product-title .oe-chips { grid-area: oe; margin: -4px 0 10px; }
body.nd .singleProduct #ad-question-form-show {
  display: flex; align-items: center; justify-content: center; gap: 8px; margin: 14px 0; padding: 10px 14px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.3; color: var(--nd-ink); transition: border-color .15s;
}
body.nd .singleProduct #ad-question-form-show::before {
  content: "?"; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 20px; height: 20px;
  border-radius: 50%; background: var(--nd-accent); color: var(--nd-on-accent); font-size: var(--nd-fs-13); font-weight: 700; line-height: 1;
}
body.nd .singleProduct #ad-question-form-show:hover { border-color: var(--nd-ink); }
/* parametre TecDoc dielu: tabulka nazov | hodnota; zoznam ako blok vedla ikonky strany montaze, nech riadky nie su zubate */
/* popis produktu: comco.css .ad-shortdesc 1.1em (16,5 px) - o nieco mensie (12.10.2026) */
body.nd .singleProduct .ad-shortdesc { font-size: var(--nd-fs-15); color: var(--nd-ink-2); }
body.nd .singleProduct .ad-shortdesc .ad-product-info > p { line-height: 1.55; }
body.nd .singleProduct .ad-shortdesc .pf-ms { margin: 0 0 6px 18px; }
body.nd .singleProduct .ad-shortdesc ul.nobullet { overflow: hidden; max-width: 560px; margin: 0 0 10px; padding: 0; list-style: none; }
body.nd .singleProduct .ad-shortdesc li.product_params {
  display: flex; align-items: baseline; gap: 12px; margin: 0 !important; padding: 6px 0; border-bottom: 1px solid var(--nd-line-2);
  font-size: var(--nd-fs-15); line-height: 1.4; list-style: none;
}
body.nd .singleProduct .ad-shortdesc li.product_params:last-child { border-bottom: 0; }
body.nd .singleProduct .ad-shortdesc li.product_params .info-text { flex: 0 1 auto; color: var(--nd-muted); }
body.nd .singleProduct .ad-shortdesc li.product_params .info-value { margin-left: auto; font-weight: 600; text-align: right; color: var(--nd-ink); }
/* text o znacke pod detailom */
body.nd .mainContainer .brand-seo-box { margin: 6px 0 18px; padding: 14px 18px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2); }
body.nd .mainContainer .brand-seo-box .brand-seo-logo { padding: 0 18px 4px 0; }
body.nd .mainContainer .brand-seo-box .brand-seo-p { margin: 0; font-size: var(--nd-fs-15); line-height: 1.55; color: var(--nd-ink-2); }

/* ==== Kosik (/kosik-a2, template/default/basket.php) - facelift ====
   Len CSS. Riadky .basket-page-row su len v kosiku (krok objednavky ma .basket-products bez nej);
   #basket_items sa po zmene mnozstva prekresluje AJAXom, pravidla preto visia len na triedach.
   Poradie stlpcov riadku aj hlavicky: obrazok, nazov, cena pred zlavou, cena, mnozstvo, celkom, odstranit, dostupnost. */
/* informacny box z popisu stranky (CMS text s inline cervenym ramikom) */
body.nd .mainContainer:is(:has(#basket_form), :has(.empty-basket)) .shortdesc [style*="solid red"] {
  padding: 10px 14px !important; border: 0 !important; border-left: 3px solid var(--nd-accent-deep) !important;
  border-radius: 0 var(--nd-r-sm) var(--nd-r-sm) 0; background: var(--nd-accent-soft);
}
body.nd .mainContainer .empty-basket {
  margin: 8px 0 24px; padding: 28px 20px; border: 1px dashed var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2);
  font-family: var(--nd-font-display); font-size: 22px; font-weight: 600; text-align: center; color: var(--nd-muted);
}
/* doprava zadarmo, odstranene polozky */
body.nd #basket_form .basket_info_message {
  margin: 8px 0 2px; padding: 10px 14px; border-radius: var(--nd-r); background: var(--nd-ok-soft);
  font-size: 16px; line-height: 1.4; color: var(--nd-ok);
}
body.nd #basket_form .basket_info_message b { color: var(--nd-ink); }
/* chyba kosika (neplatny kupon, kupon po platnosti, minimalna suma) - nad kosikom, mimo #basket_form */
body.nd .mainContainer .basket-error {
  margin: 8px 0 10px; padding: 10px 14px; border-radius: var(--nd-r); background: var(--nd-danger-soft);
  font-size: 16px; line-height: 1.4; color: var(--nd-danger);
}
/* tlacidla */
body.nd #basket_form .button2.btn { height: 40px; padding: 0 16px; border-radius: var(--nd-r); font-size: var(--nd-fs-15); line-height: 38px; }
body.nd #basket_form .button2.btn-default, body.nd #basket_form #another_customers_button {
  border: 1px solid var(--nd-line); background: var(--nd-surface); color: var(--nd-ink); font-weight: 600;
}
body.nd #basket_form .button2.btn-default:hover, body.nd #basket_form #another_customers_button:hover { border-color: var(--nd-ink); background: var(--nd-surface); color: var(--nd-ink); }
body.nd #basket_form #another_customers_button { background: var(--nd-surface) !important; border-color: var(--nd-line) !important; color: var(--nd-ink) !important; }
body.nd #basket_form #another_customers_button:hover { border-color: var(--nd-ink) !important; }
body.nd #basket_form #another_customers_button .fa { color: var(--nd-ok); }
body.nd #basket_form .button2.checkout { padding: 0 22px; font-weight: 700; }
/* tabulka */
body.nd #basket_form .basket-products-title {
  border-radius: var(--nd-r) var(--nd-r) 0 0; background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent); font-size: var(--nd-fs-13-5); font-weight: 600; color: var(--nd-ink-2);
}   /* jemne zlta ako nadpisy blokov (Stefan 12.10.2026: aj mimo uctu) */
body.nd #basket_form .basket-name-col a { font-size: 16px; font-weight: 600; color: var(--nd-ink) !important; text-decoration: none !important; overflow-wrap: anywhere; }
/* dlhe slovo v nazve (napr. Sports/Cruiser/Adventure/Touring/ATV/Retro, Chromium za lomkou nezalomi) pretekalo pri 320 - 360 px stranku (chyba #50) */
body.nd #basket_form .basket-name-col a:hover { text-decoration: underline !important; }
body.nd #basket_form .basket-page-row .price-col { font-weight: 700; color: var(--nd-ink); }
body.nd #basket_form a.basket-remove { font-size: var(--nd-fs-13-5); color: var(--nd-muted) !important; text-decoration: none !important; }
body.nd #basket_form a.basket-remove:hover { color: var(--nd-danger) !important; }
body.nd #basket_form .qty-stepper { border-color: var(--nd-line); border-radius: var(--nd-r); overflow: hidden; }
body.nd #basket_form .qty-stepper .qty-btn { color: var(--nd-ink-2); }
body.nd #basket_form .qty-stepper .qty-btn:disabled { color: var(--nd-line); }
/* dostupnost pod polozkou: stitok ako na kartach */
body.nd #basket_form .ad-delivery-box .ad-de-badge {
  border: 0; border-radius: var(--nd-r-pill); background: var(--nd-ok-soft); color: var(--nd-ok); font-weight: 600;
}
body.nd #basket_form .ad-delivery-box .ad-de-i { border-radius: 50%; }
body.nd #basket_form .ad-delivery-box .ad-de-urgency { border-radius: 0 var(--nd-r-sm) var(--nd-r-sm) 0; }
/* sucty */
body.nd #basket_form .basket-page-row.gray-bg, body.nd #basket_form .basket-page-row.total { background: var(--nd-surface-2); }
body.nd #basket_form .basket-page-row.total-last { border-radius: 0 0 var(--nd-r) var(--nd-r); }
body.nd #basket_form .basket-page-row.total-last .price { font-family: var(--nd-font-display); font-size: 22px; color: var(--nd-ink); }
/* kupon */
body.nd #basket_form .voucher { border-color: var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface); }
body.nd #basket_form #voucher_title { font-family: var(--nd-font-body); font-size: var(--nd-fs-15); font-weight: 600; text-transform: none; color: var(--nd-ink); cursor: pointer; }

/* mobil: riadok ako mriezka - obrazok + nazov, pod nimi cena | mnozstvo | celkom | kos v jednom riadku
   (floaty bootstrapu tu skakali: vysoky obrazok odsunul "celkom" a kos na dalsi riadok) */
@media (max-width: 767px) {
  body.nd #basket_form .basket-products-title, body.nd #basket_form .basket-page-row:has(> .basket-img-col), body.nd #basket_form .basket-voucher-row {
    display: grid; grid-template-columns: 52px minmax(0, 1fr) 112px 78px 22px; column-gap: 8px; align-items: center;
    font-size: 16px;
  }
  body.nd #basket_form .basket-products-title::before, body.nd #basket_form .basket-products-title::after,
  body.nd #basket_form .basket-page-row:has(> .basket-img-col)::before, body.nd #basket_form .basket-page-row:has(> .basket-img-col)::after,
  body.nd #basket_form .basket-voucher-row::before, body.nd #basket_form .basket-voucher-row::after { content: none; }
  body.nd #basket_form .basket-products-title > div, body.nd #basket_form .basket-page-row:has(> .basket-img-col) > div, body.nd #basket_form .basket-voucher-row > div {
    float: none; width: auto; min-height: 0; padding-left: 0; padding-right: 0;
  }
  body.nd #basket_form .basket-products-title > :nth-child(1), body.nd #basket_form .basket-products-title > :nth-child(2) { display: none; }
  body.nd #basket_form .basket-products-title { padding: 6px 10px; }
  body.nd #basket_form .basket-products-title > div { padding-top: 0; padding-bottom: 0; font-size: var(--nd-fs-13-5); line-height: 1.3; }
  body.nd #basket_form .basket-page-row:has(> .basket-img-col) > .price, body.nd #basket_form .basket-page-row:has(> .basket-img-col) > .price-before { font-size: var(--nd-fs-14); color: var(--nd-muted); }
  body.nd #basket_form .basket-page-row:has(> .basket-img-col) > .price-col { font-size: 16px; }
  body.nd #basket_form .basket-page-row.gray-bg, body.nd #basket_form .basket-page-row.total { padding: 6px 0; }
  body.nd #basket_form .basket-page-row.gray-bg > div, body.nd #basket_form .basket-page-row.total > div { padding-top: 2px; font-size: 16px; line-height: 1.4; }
  /* prazdna bunka .remove (col-md-1 hidden-sm) je pod 768 px blok na celu sirku = prazdny riadok v suctoch */
  body.nd #basket_form .basket-page-row.gray-bg > .remove, body.nd #basket_form .basket-page-row.total > .remove { display: none; }
  body.nd #basket_form .basket-page-row.total-last > div { font-size: 17px; }
  body.nd #basket_form .basket-page-row.total-last .price { font-size: 22px; line-height: 1.2; }
  body.nd #basket_form .basket-page-row:has(> .basket-img-col) { padding: 12px 10px; }
  body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(1) { grid-column: 1; grid-row: 1; align-self: start; }
  body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(2) { grid-column: 2 / -1; grid-row: 1; margin-bottom: 8px; }
  body.nd #basket_form .basket-products-title > :nth-child(3), body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(3) { grid-column: 1 / 3; grid-row: 2; text-align: left; }
  body.nd #basket_form .basket-products-title > :nth-child(4), body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(4) { grid-column: 1 / 3; grid-row: 3; padding-top: 0; text-align: left; }
  body.nd #basket_form .basket-products-title > :nth-child(5), body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(5) { grid-column: 3; grid-row: 2 / 4; text-align: center; }
  body.nd #basket_form .basket-products-title > :nth-child(6), body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(6) { grid-column: 4; grid-row: 2 / 4; padding-top: 0; text-align: right; white-space: nowrap; }
  body.nd #basket_form .basket-products-title > :nth-child(7), body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(7) { grid-column: 5; grid-row: 2 / 4; text-align: right; }
  body.nd #basket_form .basket-page-row:has(> .basket-img-col) > :nth-child(8) { grid-column: 1 / -1; grid-row: 4; }
  /* riadok kuponu pod produktmi (suhrn 18.10.2026): popis cez stlpce 1 - 3, suma v stlpci celkom ako riadok produktu */
  body.nd #basket_form .basket-voucher-row { padding: 12px 10px; }
  body.nd #basket_form .basket-voucher-row > :nth-child(1) { grid-column: 1 / 4; margin-left: 0; }
  body.nd #basket_form .basket-voucher-row > :nth-child(2) { grid-column: 4; font-size: 16px; text-align: right; white-space: nowrap; }
  body.nd #basket_form .basket-voucher-row > :nth-child(3) { grid-column: 5; }
  body.nd #basket_form .basket-img-col { height: auto; }
  body.nd #basket_form .img_basket { width: 52px; height: auto; margin: 0; border-radius: var(--nd-r-sm); }
  body.nd #basket_form .basket-name-col { padding: 0; }
  body.nd #basket_form .basket-name-col a { font-size: 16px; line-height: 1.3; }
  /* dostupnost: kompaktne zlava namiesto stlpca na stred */
  body.nd #basket_form .basket-avail-full .ad-delivery-box {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 10px 0 0; padding: 0; font-size: var(--nd-fs-13-5); text-align: left;
  }
  body.nd #basket_form .basket-avail-full .ad-delivery-box > * { margin: 0; }
  body.nd #basket_form .basket-avail-full .ad-de-badge { padding: 4px 10px; font-size: var(--nd-fs-13-5); }
  body.nd #basket_form .basket-avail-full a.ad-de-link { flex: 0 0 100%; justify-content: flex-start; font-size: var(--nd-fs-13-5); }
  body.nd #basket_form .basket-avail-full .ad-de-ltext { text-align: left; }
  body.nd #basket_form .basket-avail-full .ad-de-urgency { flex: 0 0 100%; padding: 6px 10px; font-size: var(--nd-fs-13-5); text-align: left; }
}
@media (max-width: 359px) {
  body.nd #basket_form .basket-products-title, body.nd #basket_form .basket-page-row:has(> .basket-img-col), body.nd #basket_form .basket-voucher-row { grid-template-columns: 44px minmax(0, 1fr) 100px 66px 20px; column-gap: 6px; }
  body.nd #basket_form .qty-stepper .qty-btn { width: 30px; }
  body.nd #basket_form .qty-stepper .qty-input { width: 38px; }
  body.nd #basket_form .img_basket { width: 44px; }
}

/* ==== Krok Objednavka (/objednavka-a3, template/default/order.php) - facelift ====
   Len CSS. Panely bez zltych hlaviciek, nadpis bez verzaliek; sucty a tlacidlo dokoncenia ako v kosiku.
   Pri testoch sa formular NIKDY neodosiela (DEV posiela realne maily). */
body.nd .mainContainer:has(#order_form) h1 { font-size: clamp(24px, 2.6vw, 32px); line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--nd-ink); }
body.nd .mainContainer:has(#order_form) .shortdesc [style*="solid red"] {
  padding: 10px 14px !important; border: 0 !important; border-left: 3px solid var(--nd-accent-deep) !important;
  border-radius: 0 var(--nd-r-sm) var(--nd-r-sm) 0; background: var(--nd-accent-soft);
}
body.nd #order_form .panel, body.nd .mainContainer:has(#order_form) .logIn-flush .panel { border-color: var(--nd-line); border-radius: var(--nd-r-lg); box-shadow: none; }
body.nd #order_form .panel-heading, body.nd .mainContainer:has(#order_form) .logIn-flush .panel-heading {
  padding: 0 20px; border-bottom: 1px solid var(--nd-line); border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0; background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent);
}
body.nd #order_form .panel-heading h3, body.nd .mainContainer:has(#order_form) .logIn-flush .panel-heading h3 {
  height: auto; margin: 0; padding: 14px 0; font-family: var(--nd-font-display); font-size: 19px; line-height: 1.2;
  letter-spacing: 0; text-align: left; text-transform: none; color: var(--nd-ink);
}
body.nd #order_form .panel-body { padding: 16px 20px; }
body.nd #order_form .panel-body label { font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink-2); }
body.nd #order_form .delivery label, body.nd #order_form .payment label { font-size: var(--nd-fs-15); }
/* suhrn objednavky (kosik v kroku objednavky) */
body.nd #order_form .basket .basket-products-title {
  border-radius: var(--nd-r) var(--nd-r) 0 0; background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent); font-size: var(--nd-fs-13-5); font-weight: 600; color: var(--nd-ink-2);
}
body.nd #order_form .basket .basket-products a { font-weight: 600; color: var(--nd-ink) !important; text-decoration: none !important; overflow-wrap: anywhere; } /* dlhe slovo v nazve, ako v kosiku */
body.nd #order_form .basket .basket-products a:hover { text-decoration: underline !important; }
body.nd #order_form .basket .basket-products.gray-bg, body.nd #order_form .basket .basket-products.total { background: var(--nd-surface-2); }
body.nd #order_form .basket .basket-products.total-last { border-radius: 0 0 var(--nd-r) var(--nd-r); }
body.nd #order_form .basket .basket-products.total-last .price { font-family: var(--nd-font-display); font-size: 22px; color: var(--nd-ink); }
/* suhlasy a dokoncenie */
body.nd #order_form label.order-confirm { font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }
body.nd #order_form a.order_privacy { font-size: var(--nd-fs-13-5); color: var(--nd-muted) !important; }
body.nd #order_form button[name=submit_order] { border: 1px solid var(--nd-accent) !important; border-radius: var(--nd-r); }
/* mobil: suhrn ako mriezka (rovnaky problem s floatmi ako v kosiku - "celkom" padal na dalsi riadok vlavo).
   Riadok: obrazok, nazov, [cena pred zlavou], cena, mnozstvo, celkom - stlpce sa beru od konca. */
@media (max-width: 767px) {
  body.nd #order_form .basket .basket-products-title, body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) {
    display: grid; grid-template-columns: 52px minmax(0, 1fr) 64px 84px; column-gap: 8px; align-items: center; font-size: 16px;
  }
  body.nd #order_form .basket .basket-products-title::before, body.nd #order_form .basket .basket-products-title::after,
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total)::before, body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total)::after { content: none; }
  body.nd #order_form .basket .basket-products-title > div, body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > div {
    float: none; width: auto; min-height: 0; padding-left: 0; padding-right: 0;
  }
  body.nd #order_form .basket .basket-products-title { padding: 6px 10px; }
  body.nd #order_form .basket .basket-products-title > div { padding-top: 0; padding-bottom: 0; font-size: var(--nd-fs-13-5); line-height: 1.3; }
  body.nd #order_form .basket .basket-products-title > :nth-last-child(n+4) { display: none; }
  body.nd #order_form .basket .basket-products-title > :nth-last-child(3) { grid-column: 1 / 3; text-align: left; }
  body.nd #order_form .basket .basket-products-title > :nth-last-child(2) { grid-column: 3; text-align: center; }
  body.nd #order_form .basket .basket-products-title > :last-child { grid-column: 4; text-align: right; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) { padding: 10px; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > :nth-child(1) { grid-column: 1; grid-row: 1; padding-top: 0; text-align: left; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > :nth-child(2) { grid-column: 2 / -1; grid-row: 1; padding-top: 0; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > :nth-child(3):nth-last-child(4) { grid-column: 1 / 3; grid-row: 2; text-align: left; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > :nth-last-child(3) { grid-column: 1 / 3; grid-row: 3; padding-top: 0; font-size: var(--nd-fs-14); color: var(--nd-muted); text-align: left; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > :nth-last-child(2) { grid-column: 3; grid-row: 2 / 4; padding-top: 0; text-align: center; }
  body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) > :last-child { grid-column: 4; grid-row: 2 / 4; padding-top: 0; font-weight: 700; color: var(--nd-ink); text-align: right; white-space: nowrap; }
  body.nd #order_form .basket .img_basket { width: 52px; height: auto; border-radius: var(--nd-r-sm); }
  body.nd #order_form .basket .basket-products.gray-bg > div, body.nd #order_form .basket .basket-products.total > div { font-size: 16px; line-height: 1.4; }
}
/* ---- Kosik a objednavka na tablete (template/default/basket.php, order.php, 14.10.2026) ----
   Stlpce col-sm-1 maju na 768 px 60 px (z toho 30 px padding) a respo/css/comco.css v max-width 991px dava hlavicke
   white-space inherit a text-align center, posuva Celkom (.total, .price-col) o left 20px a .price-col nema pravy
   padding: hlavicka Cena s DPH na 3 riadky, Mnozstvo a Celkom zliate, Celkom bez okraja a mimo stlpca hlavicky.
   Kosik 768-1199 (col-sm plati aj na md, na 1024 px tiez Cena s DPH mimo bunky): prazdny 3. stlpec sa skryje
   (cena pred zlavou pri zlave ostava), sirky obrazok 8.333 / nazov 37.5 (so zlavou 25 + 12.5) / cena 14.583 /
   mnozstvo 16.667 / celkom 14.583 / kos 8.333 %, hlavicka nowrap a vpravo ako hodnoty, bez posunov left.
   Objednavka 768-991 (na md sedi): prazdny 3. stlpec hlavicky sa skryje (riadky ho nemaju), od konca celkom 14.583 /
   mnozstvo 12.5 / cena 14.583 %, nazov 41.667 % (so zlavou obrazok 12.5, nazov 31.25, cena pred zlavou 14.583 %).
   Sucty 768-991 pod stlpcom Celkom. Tlacidla kosika 768-991: Dalsi zakaznici odporucaju (228 px nowrap) sa do
   col-sm-3 (180 px) nezmesti a narazal do Prepocitat - ide vpravo vedla kuponu, Prepocitat a Objednat pod neho.
   Test: claude_notes/novy_dizajn_overenie/tablet_cart_order_test.js */
@media (min-width: 768px) and (max-width: 1199px) {
  body.nd #basket_form .basket-products-title .nowrap { white-space: nowrap; }
  body.nd #basket_form .basket-products-title > .text-right { text-align: right; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row) > div { left: 0; }
  body.nd #basket_form .basket-page-row > .price-col { padding-right: 15px; }
  body.nd #basket_form:not(:has(.basket-page-row > .price-before)) :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(3) { display: none; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(1) { width: 8.333%; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(2) { width: 37.5%; }
  body.nd #basket_form:has(.basket-page-row > .price-before) :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(2) { width: 25%; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(3) { width: 12.5%; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :is(:nth-child(4), :nth-child(6)) { width: 14.583%; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(5) { width: 16.667%; }
  body.nd #basket_form :is(.basket-products-title, .basket-page-row:has(> .basket-img-col)) > :nth-child(7) { width: 8.333%; }
}
@media (min-width: 768px) and (max-width: 991px) {
  body.nd #basket_form .basket-page-row:is(.gray-bg, .total) > :first-child { width: 77.083%; }
  body.nd #basket_form .basket-page-row:is(.gray-bg, .total) > .price { width: 14.583%; }
  body.nd #basket_form .col-sm-3:has(> .buttons-down > #another_customers_button) { width: 66.667%; text-align: right; }
  body.nd #basket_form .col-sm-3:has(> .buttons-down > #another_customers_button) + .col-sm-5 { width: 100%; margin-top: 10px; }

  body.nd #order_form:not(:has(.basket-products > .price-before)) .basket .basket-products-title > div { white-space: nowrap; }
  body.nd #order_form .basket .basket-products-title > .text-right { text-align: right; }
  body.nd #order_form .basket :is(.basket-products-title, .basket-products) > div { left: 0; }
  body.nd #order_form:not(:has(.basket-products > .price-before)) .basket .basket-products-title > :nth-child(3) { display: none; }
  body.nd #order_form .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :nth-child(2) { width: 41.667%; }
  body.nd #order_form .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :is(:last-child, :nth-last-child(3)) { width: 14.583%; }
  body.nd #order_form .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :nth-last-child(2) { width: 12.5%; }
  body.nd #order_form:has(.basket-products > .price-before) .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :nth-child(1) { width: 12.5%; }
  body.nd #order_form:has(.basket-products > .price-before) .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :nth-child(2) { width: 31.25%; }
  body.nd #order_form:has(.basket-products > .price-before) .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :nth-child(3) { width: 14.583%; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > :first-child { width: 85.417%; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > .price { width: 14.583%; }
}

/* ==== Obsahove stranky (CMS clanky, prihlasenie, registracia, kontakt, doprava, caste otazky) - facelift ====
   Len CSS. Nadpisy obsahu mali zo style.css verzalky - v nd ako v kategorii (display, bez verzaliek).
   Farbu a velkost h2-h5 nemenime (21/18 px), nadpisy s vlastnou triedou si upravuju bloky stranok nizsie. */
body.nd .mainContainer :is(h1, h2, h3, h4, h5) { letter-spacing: 0; text-transform: none; }
/* h1 mimo page.php (registracia, novinky, sledovanie objednavky, VIN katalog, kalkulacky) - ako .clearfix > h1 */
body.nd .mainContainer > h1 {
  margin: 4px 0 12px; font-family: var(--nd-font-display); font-size: clamp(24px, 2.6vw, 32px); font-weight: 700;
  line-height: 1.1; color: var(--nd-ink);
}
/* odkazy v texte clanku: .mainContainer a ma z comco.css cierne tucne podciarknutie - podciarknutie v akcente */
body.nd .mainContainer :is(p, li, td) > a:not(.btn):not([class*="button"]) { text-decoration-color: var(--nd-accent-deep); text-underline-offset: 3px; }
/* dlha adresa ako text odkazu (VOP: http://ec.europa.eu/consumers/odr/) na 320 px pretiekla stranku */
body.nd .mainContainer :is(p, li, td) a { overflow-wrap: anywhere; }

/* panely formularov (prihlasenie, registracia, zabudnute heslo): hlavicka ako v kroku Objednavka
   namiesto plnej zltej (paleta nd: .logIn/.signUp/.lostPassword/.form-body .panel .panel-heading) */
body.nd :is(.logIn, .signUp, .lostPassword, .form-body) .panel { border-color: var(--nd-line); border-radius: var(--nd-r-lg); box-shadow: none; }
body.nd :is(.logIn, .signUp, .lostPassword, .form-body) .panel .panel-heading {
  height: auto; padding: 0 20px; border-bottom: 1px solid var(--nd-line); border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0; background-color: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent);
}
body.nd :is(.logIn, .signUp, .lostPassword, .form-body) .panel .panel-heading :is(h2, h3, h4) {
  height: auto; margin: 0; padding: 14px 0; font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2;
  letter-spacing: 0; text-align: left; text-transform: none; color: var(--nd-ink);
}
body.nd :is(.logIn, .signUp, .lostPassword, .form-body) .panel .form-group label { font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink-2); }
body.nd :is(.signUp, .form-body) .panel :is(.checkbox, .checkboxArea) label { font-weight: 400; }
body.nd :is(.logIn, .signUp, .lostPassword, .form-body) input[type=checkbox] { accent-color: var(--nd-ink); }

/* kontakt (CMS clanok): boxy .contact-box maju pevnu vysku 410 px a obsah z nich pretekal -
   riadok ako flex, box na vysku stlpca */
body.nd .mainContainer .row:has(> [class*="col-"] > .contact-box) { display: flex; flex-wrap: wrap; row-gap: 20px; }
body.nd .mainContainer .row:has(> [class*="col-"] > .contact-box)::before,
body.nd .mainContainer .row:has(> [class*="col-"] > .contact-box)::after { display: none; }
body.nd .mainContainer .gray-bordered-box.contact-box { height: 100%; margin-bottom: 0; }
body.nd .mainContainer .gray-bordered-box { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); overflow: hidden; }
body.nd .mainContainer .gray-bordered-box-title {
  padding: 12px 16px; border-bottom: 1px solid var(--nd-line); background: var(--nd-surface-2);
  font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2; color: var(--nd-ink);
}
body.nd .mainContainer .gray-bordered-box-body img { border-radius: var(--nd-r); }

/* tabulky v clankoch (table.bordertable - doprava a platba, VOP ...) */
body.nd .mainContainer table.bordertable { border: 1px solid var(--nd-line); border-collapse: separate; border-spacing: 0; border-radius: var(--nd-r-lg); overflow: hidden; }
body.nd .mainContainer table.bordertable :is(th, td) { padding: 9px 12px; border: 0; border-bottom: 1px solid var(--nd-line-2); }
body.nd .mainContainer table.bordertable tr:last-child > :is(th, td) { border-bottom: 0; }
body.nd .mainContainer table.bordertable th { background: var(--nd-surface-2); font-weight: 600; color: var(--nd-ink); border-bottom-color: var(--nd-line); }
body.nd .mainContainer .deliveries-table__limit { color: var(--nd-muted); }
@media (max-width: 767px) {
  /* doprava a platba na 320 px: 3 stlpce s okrajom 12 px pretiekli o 9 px */
  body.nd .mainContainer table.bordertable :is(th, td) { padding: 7px 8px; }
  body.nd .mainContainer .deliveries-table__free { padding: 1px 7px; }
}
body.nd .mainContainer .deliveries-table__free {
  display: inline-block; padding: 1px 10px; border-radius: var(--nd-r-pill); background: var(--nd-ok-soft);
  font-size: var(--nd-fs-13); font-weight: 700; letter-spacing: .02em; color: var(--nd-ok) !important; /* inline <span style> v CMS */
}

/* caste otazky (.faq_question, comco.css): zoznam ako karta so zaoblenymi rohmi, otvorena otazka jemne zlta */
body.nd .faq_question { border-color: var(--nd-line); font-size: 16px; text-align: left; overflow: hidden; }
body.nd .faq_question.first { border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0; }
body.nd .faq_question:not(:has(+ .faq_question)) { border-radius: 0 0 var(--nd-r-lg) var(--nd-r-lg); }
body.nd .faq_question.first:not(:has(+ .faq_question)) { border-radius: var(--nd-r-lg); }
body.nd .faq_question .question { display: flex; align-items: center; gap: 12px; padding: 12px 16px; font-weight: 600; color: var(--nd-ink); }
body.nd .faq_question .question .changer { order: 2; margin-left: auto; float: none; top: 0; color: var(--nd-muted); }
body.nd .faq_question .question .changer .fa-2x { font-size: 22px; }
body.nd .faq_question .question.selected { background-color: var(--nd-accent-soft); }
body.nd .faq_question .answer { padding: 4px 16px 16px; font-size: var(--nd-fs-15); color: var(--nd-ink-2); }
/* zakaznicke stranky: "PROFIL" (.container.page > .row > .nd-content > h3, mimo .mainContainer) nad h1 ako mensi popis sekcie */
body.nd .container.page > .row > :is(.col-sm-9, .nd-content) > h3 {
  margin: 8px 0 0; font-family: var(--nd-font-body); font-size: var(--nd-fs-13); font-weight: 600; letter-spacing: .08em; color: var(--nd-muted);
}

/* ==== Vyber vozidla TecDoc (/autodiely/, znacka, model, motorizacia) - facelift ====
   Len CSS nad markupom modulu autodiely (show_parts.php) a formularom vyberu auta na stranke znacky tovaru (/bosch-a296).
   Lavy panel Vozidlo, zalozky, nadpis, #search_box_car a strom kategorii uz styluje blok "TecDoc vypis dielov" -
   tu len doplnky. Formular vyberu auta na /autodiely/ je karta z titulky (nd_home_vsel, blok Titulka - hero). */

/* znacky aut: float mriezka sa pri roznej vyske poloziek rozbijala (MALAGUTI, SUZUKI na /motodiely/) */
body.nd ul.ad-brand-ul {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; margin: 8px 0 24px; padding: 0; list-style: none;
}
/* clearfix .row by bol v mriezke prazdnou bunkou */
body.nd ul.ad-brand-ul::before, body.nd ul.ad-brand-ul::after,
body.nd ul.ad-brand-other-ul::before, body.nd ul.ad-brand-other-ul::after { content: none; }
body.nd ul.ad-brand-ul > li { float: none; width: auto; min-height: 0; margin: 0; padding: 0; }
body.nd ul.ad-brand-ul a.ad_brands_logos {
  display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; padding: 14px 8px 12px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-size: var(--nd-fs-13); font-weight: 700; line-height: 1.25; letter-spacing: .02em; text-align: center; overflow-wrap: anywhere;
  color: var(--nd-ink); transition: border-color .15s, box-shadow .15s;
}
body.nd ul.ad-brand-ul a.ad_brands_logos:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow-sm); color: var(--nd-accent-ink); }
body.nd ul.ad-brand-ul a.ad_brands_logos br { display: none; }
/* jednotny box na logo - nazov znacky je vo vsetkych kartach na rovnakej vyske */
body.nd ul.ad-brand-ul a.ad_brands_logos img, body.nd ul.ad-brand-ul a.ad_brands_logos .ad_brands_nologo {
  position: relative; display: block; width: 100%; height: 60px; margin: 0; object-fit: contain;
  font-size: var(--nd-fs-11); color: transparent;
}
/* chybajuce logo (404): pseudoprvok sa na img vykresli len pri nenacitanom obrazku - neutralna ikonka namiesto
   rozbiteho obrazka a alt textu (biele pozadie prekryje ikonku prehliadaca v rohu). Znacka bez gifu na disku ma
   namiesto img prazdny span.ad_brands_nologo (show_brands.php, 15.10.2026 - bez 404 v konzole), ikonka rovnaka */
body.nd ul.ad-brand-ul a.ad_brands_logos img::after, body.nd ul.ad-brand-ul a.ad_brands_logos .ad_brands_nologo::after {
  content: "\f1b9"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: var(--nd-surface); font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 28px; color: var(--nd-muted-2);
}
body.nd ul.ad-brand-ul a.ad_brands_logos[href^="/motodiely/"] img::after,
body.nd ul.ad-brand-ul a.ad_brands_logos[href^="/motodiely/"] .ad_brands_nologo::after { content: "\f21c"; }

/* ostatne znacky (textovy zoznam) ako karty vyberu z katalogu - modely a motorizacie nizsie (COMCO-74, 12.10.2026, Stefan:
   zoznam znaciek spravit tak, ako je inde na webe): ramik, zaoblenie, tien, cely odkaz, vpravo len sipka (bunka je uzka
   na slovo Vybrat). Mriezka namiesto floatov, dlhe nazvy sa zalomia; na mobile dva stlpce (nizsie). */
body.nd ul.ad-brand-other-ul {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; margin: 0 0 28px; padding: 0; list-style: none;
}
body.nd ul.ad-brand-other-ul > li {
  float: none; width: auto; min-width: 0; min-height: 0; margin: 0; padding: 0;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
  transition: border-color .2s ease, box-shadow .2s ease;
}
/* zlaty ramik pri hoveri ako na dlazdiciach kategorii (Stefan 13.10.2026) */
body.nd ul.ad-brand-other-ul > li:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow); }
body.nd ul.ad-brand-other-ul > li > a,
body.nd ul.ad-brand-other-ul > li > a:hover {
  display: flex; align-items: center; gap: 8px 14px; height: 100%; padding: 15px 20px; border: 0; border-radius: inherit; background: transparent;
  font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.3; white-space: normal; overflow: visible; overflow-wrap: anywhere; color: var(--nd-ink);
}
body.nd ul.ad-brand-other-ul > li > a::after {
  content: ""; flex: 0 0 16px; width: 16px; height: 16px; margin-left: auto; background: currentColor; color: var(--nd-accent-ink);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
body.nd ul.ad-brand-other-ul > li:hover > a::after { color: var(--nd-ink); }

/* odkaz "Vyberte si aj ..." (/motodiely/, /autodiely-dodavky/): zelena plocha je inline style v obsahu stranky - preto !important */
body.nd #ad-column-right-inner > p[style*="dae6d0"] {
  margin-bottom: 24px; padding: 12px 16px !important; border-radius: var(--nd-r); background-color: var(--nd-info-soft) !important; color: var(--nd-ink-2);
}

/* zoznam modelov a motorizacii: hlavicka + riadky */
body.nd ul.ad-model-ul, body.nd ul.ad-type-ul { margin: 0 0 28px; padding: 0; list-style: none; }
body.nd ul.ad-model-ul > li, body.nd ul.ad-type-ul > li { margin: 0; border-bottom: 1px solid var(--nd-line-2); color: var(--nd-ink-2); }
body.nd ul.ad-model-ul > li:hover, body.nd ul.ad-type-ul > li:hover { background: var(--nd-accent-soft); }
/* comco.css: .ad-ul-title:hover ma #ddd !important */
body.nd ul.ad-model-ul > li.ad-ul-title, body.nd ul.ad-type-ul > li.ad-ul-title,
body.nd ul.ad-model-ul > li.ad-ul-title:hover, body.nd ul.ad-type-ul > li.ad-ul-title:hover {
  border-bottom: 0; border-radius: var(--nd-r); background: var(--nd-surface-2) !important;
  font-size: var(--nd-fs-13); font-weight: 600; line-height: 1.3; color: var(--nd-muted);
}
/* font-size: comco.css na mobile .ad-model-ul li span 1.15em - hlavicka bola vacsia ako riadky */
body.nd ul.ad-model-ul > li.ad-ul-title span, body.nd ul.ad-type-ul > li.ad-ul-title span { padding: 9px 5px; font-size: inherit; line-height: inherit; }
body.nd ul.ad-model-ul > li > a, body.nd ul.ad-type-ul > li a { padding: 8px 5px; font-size: var(--nd-fs-15); line-height: 1.35; color: var(--nd-ink-2); font-variant-numeric: tabular-nums; }
body.nd ul.ad-model-ul > li > a:hover { background: transparent; color: var(--nd-ink); }
body.nd ul.ad-model-ul .ad-model-name, body.nd ul.ad-type-ul .ad-type-name { font-weight: 600; color: var(--nd-ink); }
body.nd ul.ad-model-ul > li:not(.ad-ul-title) .ad-model-year, body.nd ul.ad-type-ul > li:not(.ad-ul-title) .ad-type-code { color: var(--nd-muted); }
body.nd ul.ad-model-ul > li.ad-ul-title [class*="ad-model-"], body.nd ul.ad-type-ul > li.ad-ul-title [class*="ad-type-"] { font-weight: 600; color: var(--nd-muted); }

/* vyber z katalogu ako karty: podkategorie stromu TecDoc (show_parts.php, ul.ad-subcats), modely (show_models.php,
   ul.ad-model-ul bez .big-font) a motorizacie (show_types.php, ul.ad-type-ul). Karta = cely odkaz, vpravo "Vybrat ->"
   (na mobile len sipka). Hlavicka tabuliek modelov a motorizacii je skryta, jednotky dopisuje CSS. */
body.nd ul.ad-model-ul.ad-subcats, body.nd ul.ad-model-ul:not(.big-font), body.nd ul.ad-type-ul { display: flex; flex-direction: column; gap: 10px; margin: 0 0 28px; }
body.nd ul.ad-model-ul:not(.big-font) > li.ad-ul-title, body.nd ul.ad-type-ul > li.ad-ul-title { display: none; }
body.nd ul.ad-model-ul.ad-subcats > li, body.nd ul.ad-model-ul:not(.big-font) > li, body.nd ul.ad-type-ul > li {
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
  transition: border-color .2s ease, box-shadow .2s ease;
}
/* zlaty ramik pri hoveri ako na ostatnych dlazdiciach kategorii (.pagegallery, .ad-catbox) - Stefan 13.10.2026 */
body.nd ul.ad-model-ul.ad-subcats > li:hover, body.nd ul.ad-model-ul:not(.big-font) > li:hover, body.nd ul.ad-type-ul > li:hover {
  border-color: var(--nd-accent); background: var(--nd-surface); box-shadow: var(--nd-shadow);
}
body.nd ul.ad-model-ul.ad-subcats > li > a, body.nd ul.ad-model-ul:not(.big-font) > li > a, body.nd ul.ad-type-ul > li > .row > a {
  display: flex; align-items: center; gap: 8px 14px; width: 100%; padding: 15px 20px;
  font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.3; color: var(--nd-ink);
}
body.nd ul.ad-model-ul > li > a:hover, body.nd ul.ad-type-ul > li > .row > a:hover { background: transparent; color: var(--nd-ink); }
body.nd ul.ad-model-ul.ad-subcats > li > a::after, body.nd ul.ad-model-ul:not(.big-font) > li > a::after, body.nd ul.ad-type-ul > li > .row > a::after {
  content: "Vybrať"; flex: 0 0 auto; padding-right: 22px; font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-accent-ink);
  background: linear-gradient(currentColor, currentColor) right center / 16px 16px no-repeat;
  -webkit-mask: linear-gradient(#000, #000) left / calc(100% - 22px) 100% no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right center / 16px 16px no-repeat;
  mask: linear-gradient(#000, #000) left / calc(100% - 22px) 100% no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right center / 16px 16px no-repeat;
}
body.nd ul.ad-model-ul.ad-subcats > li:hover > a::after, body.nd ul.ad-model-ul:not(.big-font) > li:hover > a::after,
body.nd ul.ad-type-ul > li:hover > .row > a::after { color: var(--nd-ink); }

/* podkategorie: pocet je <data value data-label="50 dielov">(50)</data> - text "(50)" sa schova (font-size 0), stitok kresli ::after.
   .big-font z comco.css (1.2em !important) by zvacsil cely zoznam. */
body.nd ul.ad-model-ul.ad-subcats { font-size: var(--nd-fs-15) !important; }
/* gif + (uzol ma dalsie podkategorie) - v karte nema zmysel, klik vedie na tu istu stranku */
body.nd ul.ad-model-ul.ad-subcats > li > a > img, body.nd ul.ad-model-ul.ad-subcats > li > a > .ad-pd-small { display: none; }
body.nd ul.ad-model-ul.ad-subcats data { margin-left: auto; font-size: 0; line-height: 0; white-space: nowrap; }
body.nd ul.ad-model-ul.ad-subcats data::after {
  content: attr(data-label); display: inline-block; padding: 4px 10px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
  font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.2; color: var(--nd-muted); font-variant-numeric: tabular-nums;
}
/* VIN katalog (laximo_comco.php, ul.ad-subcats--vin od nd_vin_subcats_class): karty bez stitku s poctom, Vybrat doprava samo */
body.nd ul.ad-model-ul.ad-subcats--vin > li > a::after { margin-left: auto; }

/* modely: nazov (40 %) a roky ako v starej tabulke, na mobile roky pod nazvom. .row je z bootstrapu (zaporne okraje,
   clearfix ::before/::after). */
body.nd ul.ad-model-ul:not(.big-font) > li > a > .row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; flex: 1 1 auto; min-width: 0; margin: 0; }
body.nd ul.ad-model-ul:not(.big-font) > li > a > .row::before, body.nd ul.ad-model-ul:not(.big-font) > li > a > .row::after { display: none; }
body.nd ul.ad-model-ul:not(.big-font) > li > a > .row > div {
  float: none; width: auto; height: auto; min-height: 0; padding: 0; overflow: visible; font-size: inherit; line-height: inherit;
}
body.nd ul.ad-model-ul:not(.big-font) > li > a .ad-model-name { flex: 0 0 40%; min-width: 0; font-weight: 600; color: var(--nd-ink); }
body.nd ul.ad-model-ul:not(.big-font) > li:not(.ad-ul-title) > a .ad-model-year {
  flex: 1 1 0; min-width: 0; font-size: var(--nd-fs-14); font-weight: 500; color: var(--nd-muted); font-variant-numeric: tabular-nums;
}

/* motorizacie: "116 d · 85 kW / 116 HP" vlavo, roky / ccm / kod motora v stlpcoch vpravo, od 992 px v jednom riadku.
   Poradie v HTML je nazov, roky, kW, HP, ccm, kod - flex order ho preusporiada. Prazdne bunky (bez rokov...) sa skryju. */
body.nd ul.ad-type-ul > li > .row { margin: 0; }
body.nd ul.ad-type-ul > li > .row::before, body.nd ul.ad-type-ul > li > .row::after { display: none; }
body.nd ul.ad-type-ul > li > .row > a { --g: 14px; flex-wrap: wrap; column-gap: var(--g); }
body.nd ul.ad-type-ul > li > .row > a > div {
  float: none; width: auto; height: auto; min-height: 0; padding: 0; overflow: visible; flex: 0 0 auto;
  font-size: var(--nd-fs-14); font-weight: 500; line-height: inherit; color: var(--nd-muted); font-variant-numeric: tabular-nums;
}
body.nd ul.ad-type-ul > li > .row > a > div:empty { display: none; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-name { order: 1; flex: 0 1 auto; min-width: 0; font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-kw { order: 2; margin-left: calc(6px - var(--g)); }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-kw::before { content: "· "; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-kw::after { content: " kW"; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-hp { order: 3; margin-left: calc(4px - var(--g)); }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-hp::before { content: "/ "; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-hp::after { content: " HP"; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-year { order: 5; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-year::before, body.nd ul.ad-type-ul > li > .row > a > .ad-type-year::after { display: none; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-ccm { order: 6; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-ccm::after { content: " ccm"; }
body.nd ul.ad-type-ul > li > .row > a > .ad-type-code { order: 7; }
body.nd ul.ad-type-ul > li > .row > a::after { order: 8; }
@media (min-width: 992px) {
  body.nd ul.ad-type-ul > li > .row > a { flex-wrap: nowrap; }
  body.nd ul.ad-type-ul > li > .row > a > .ad-type-year { width: 150px; margin-left: auto; }
  body.nd ul.ad-type-ul > li > .row > a > .ad-type-ccm { width: 80px; }
  body.nd ul.ad-type-ul > li > .row > a > .ad-type-code { flex: 0 1 220px; width: 220px; min-width: 0; }
}
/* do 991 px dva riadky: nazov s vykonom a sipka, pod tym roky, ccm a kod (::before = zlom riadku) */
@media (max-width: 991px) {
  body.nd ul.ad-type-ul > li > .row > a { row-gap: 2px; }
  body.nd ul.ad-type-ul > li > .row > a::before { content: ""; order: 4; flex: 0 0 100%; height: 0; }
  body.nd ul.ad-type-ul > li > .row > a::after { order: 3; margin-left: auto; }
  body.nd ul.ad-type-ul > li > .row > a > div:not(.ad-type-name):not(.ad-type-kw):not(.ad-type-hp) { font-size: var(--nd-fs-13); }
  body.nd ul.ad-type-ul > li > .row > a > .ad-type-code { flex: 0 1 auto; min-width: 0; }
}
/* mobil: bez slova Vybrat, len sipka */
@media (max-width: 767px) {
  body.nd ul.ad-model-ul.ad-subcats, body.nd ul.ad-type-ul, body.nd ul.ad-model-ul:not(.big-font) { gap: 8px; }
  body.nd ul.ad-model-ul.ad-subcats > li > a, body.nd ul.ad-type-ul > li > .row > a, body.nd ul.ad-model-ul:not(.big-font) > li > a { gap: 8px 10px; padding: 13px 14px; }
  body.nd ul.ad-type-ul > li > .row > a { --g: 10px; row-gap: 2px; }
  body.nd ul.ad-model-ul:not(.big-font) > li > a .ad-model-name { flex-basis: 100%; }
  body.nd ul.ad-model-ul:not(.big-font) > li:not(.ad-ul-title) > a .ad-model-year { flex-basis: 100%; font-size: var(--nd-fs-13); }
  body.nd ul.ad-model-ul.ad-subcats > li > a::after, body.nd ul.ad-model-ul:not(.big-font) > li > a::after, body.nd ul.ad-type-ul > li > .row > a::after {
    width: 16px; height: 16px; padding: 0; font-size: 0; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  }
}

/* najcastejsie hladane diely pre model */
body.nd .model-cats li a {
  padding: 10px 12px; border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-size: var(--nd-fs-15); color: var(--nd-ink); transition: border-color .15s, box-shadow .15s;
}
body.nd .model-cats li a:hover { border-color: var(--nd-accent); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm); color: var(--nd-accent-ink); }
body.nd .model-cats .model-cats-n {
  padding: 1px 7px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2); font-size: var(--nd-fs-12); font-weight: 600; line-height: 1.5; color: var(--nd-muted);
}

/* dlazdice kategorii pri motorizacii: ako dlazdice podkategorii, bez zlteho prechodu */
body.nd .ad-catbox { margin: 0 0 24px; }
body.nd .ad-catbox > ul.row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 4px 0 0; padding: 0; list-style: none; }
body.nd .ad-catbox > ul.row::before, body.nd .ad-catbox > ul.row::after { content: none; }
/* comco.css do 991 px: .ad-catbox li { height: 99.5px !important; overflow: hidden } - orezavalo dlhsi popis */
body.nd .ad-catbox > ul > li { display: flex; float: none; width: auto; height: auto !important; margin: 0; padding: 0; overflow: visible; }
/* .mainContainer a ma v style.css underline !important */
body.nd .ad-catbox ul li a { display: flex; flex: 1 1 auto; height: auto; margin: 0; text-decoration: none !important; }
body.nd .ad-catbox .ad-catbox-inner, body.nd .ad-catbox .ad-catbox-inner:hover {
  flex: 1 1 auto; height: auto; min-height: 96px; padding: 12px 12px 12px 16px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  background: var(--nd-surface); filter: none; transition: border-color .2s ease, box-shadow .2s ease;
}
body.nd .ad-catbox a:hover .ad-catbox-inner { border-color: var(--nd-accent); box-shadow: var(--nd-shadow-sm); }
body.nd .ad-catbox .ad-catbox-inner > .row { display: flex; align-items: center; gap: 12px; height: 100%; margin: 0; }
body.nd .ad-catbox .ad-catbox-inner > .row::before, body.nd .ad-catbox .ad-catbox-inner > .row::after { content: none; }
body.nd .ad-catbox .ad-catbox-inner > .row > [class*="col-"] { float: none; min-height: 0; margin: 0; padding: 0; }
body.nd .ad-catbox .ad-catbox-inner > .row > :first-child { flex: 1 1 auto; width: auto; min-width: 0; }
body.nd .ad-catbox .ad-catbox-inner > .row > .image { flex: 0 0 104px; width: 104px; max-height: none; text-align: center; }
/* obrazok bol posunuty position: relative (left -50px, top -13px) a presahoval dlazdicu */
body.nd .ad-catbox .image img { position: static; display: block; width: auto; max-width: 100%; height: auto; max-height: 76px; margin: 0 auto; object-fit: contain; }
body.nd .ad-catbox ul li a span { display: block; float: none; margin: 0; font-size: var(--nd-fs-13-5); line-height: 1.4; color: var(--nd-muted); }
body.nd .ad-catbox ul li a span.cathead {
  width: auto; margin: 0 0 4px; font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.15; color: var(--nd-ink);
}
body.nd .ad-catbox ul li a:hover span.cathead { color: var(--nd-accent-ink); }
body.nd .ad-select-parts-info { margin: 0 0 20px; font-size: var(--nd-fs-15); line-height: 1.45; color: var(--nd-muted); }
body.nd .ad-select-parts-info b { font-weight: 600; color: var(--nd-muted-2); }

/* panel Vozidlo: biele panel-body s ostrymi rohmi prekryvalo zaoblene spodne rohy ramika panela */
body.nd :is(#ad-column-left, #nd-veh-host) .ad-car-select > .panel-body:last-child { border-radius: 0 0 calc(var(--nd-r-lg) - 1px) calc(var(--nd-r-lg) - 1px); }

/* strom kategorii: gif +/- nahradeny sipkou. Obsah img ma vdaka paddingu nulovu sirku (gif sa nevykresli),
   sipku kresli maska nad pozadim. Klik ostava na img - JS (show_parts.php) prepina src icon-plus/icon-minus.
   Margin -5px: text vetvy zacina ako pri gife (11 px), podpolozky (.ad-pad2, 15 px) ostanu zarovnane pod nim.
   Ikona je v strome motorizacie aj VIN katalogu trieda .icon_click (od 15.10.2026, predtym duplicitne id #icon_click). */
body.nd #ad-column-left ul.ad-structure img.icon_click {
  box-sizing: border-box; width: 16px; height: 16px; padding: 0 0 0 16px; margin: 0 0 0 -5px; top: 0; vertical-align: -3px;
  background: var(--nd-muted);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5 10.5 8 6 12.5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  cursor: pointer; transition: transform .15s;
}
body.nd #ad-column-left ul.ad-structure img.icon_click[src*="icon-minus"] { transform: rotate(90deg); }
body.nd #ad-column-left ul.ad-structure img.icon_click:hover { background: var(--nd-ink); }
/* comco.css: .ad-li-inner:hover #ddd - hover uz riesi cely riadok (li > a) */
body.nd #ad-column-left ul.ad-structure .ad-li-inner:hover { background: transparent; }

/* formular vyberu auta na stranke znacky tovaru (/bosch-a296) */
body.nd #td_select_car_form .landing-page-form-box.gray-box {
  margin: 0 0 24px; padding: 16px 20px 20px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2);
}
body.nd #td_select_car_form .landing-page-form-box > br { display: none; }
/* emoji sipky ako obrazok (➡️ / ⬇️) aj ich stlpec */
body.nd #td_select_car_form .landing-page-form-box > .row > [class*="col-"]:has(> .lp-arrow), body.nd #td_select_car_form .lp-arrow { display: none; }
body.nd #td_select_car_form .landing-page-form-box label {
  display: block; position: static; margin: 10px 0 6px; font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1.3; color: var(--nd-ink-2);
}
body.nd #td_select_car_form #ad-frm-button {
  height: 44px; margin: 0; padding: 0 20px; border: 1px solid var(--nd-accent); border-radius: var(--nd-r); background: var(--nd-accent);
  font-size: var(--nd-fs-15); font-weight: 700; line-height: 1; color: var(--nd-on-accent); box-shadow: none;
}
body.nd #td_select_car_form #ad-frm-button:hover:not(:disabled), body.nd #td_select_car_form #ad-frm-button:focus-visible { border-color: var(--nd-accent-deep); background: var(--nd-accent-deep); }
body.nd #td_select_car_form #ad-frm-button:disabled { opacity: .5; }
/* <br> a .lp-spacer zarovnavali tlacidlo k selectom v starom riadku */
body.nd #td_select_car_form .landing-page-form-box > .row > [class*="col-"]:has(> #ad-frm-button) > :not(#ad-frm-button) { display: none; }
@media (max-width: 991px) {
  body.nd #td_select_car_form #ad-frm-button { margin-top: 16px; }
}
@media (min-width: 992px) {
  /* 4 polia v jednom riadku mali ~150 px a select2 skracoval aj "Osobne auto" - mriezka 2 x 2, tlacidlo pod pravym stlpcom */
  body.nd #td_select_car_form .landing-page-form-box > .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin: 0; }
  body.nd #td_select_car_form .landing-page-form-box > .row::before, body.nd #td_select_car_form .landing-page-form-box > .row::after { content: none; }
  body.nd #td_select_car_form .landing-page-form-box > .row > [class*="col-"] { float: none; width: auto; min-height: 0; margin: 0; padding: 0; }
  body.nd #td_select_car_form .landing-page-form-box > .row > [class*="col-"]:has(> #ad-frm-button) { grid-column: 2; }
  body.nd #td_select_car_form .landing-page-form-box label { margin-top: 0; }
}

@media (max-width: 767px) {
  body.nd ul.ad-brand-ul { grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
  body.nd ul.ad-brand-ul a.ad_brands_logos { gap: 6px; padding: 10px 5px; font-size: var(--nd-fs-12); }
  body.nd ul.ad-brand-ul a.ad_brands_logos img, body.nd ul.ad-brand-ul a.ad_brands_logos .ad_brands_nologo { height: 44px; }
  body.nd ul.ad-brand-ul a.ad_brands_logos img::after, body.nd ul.ad-brand-ul a.ad_brands_logos .ad_brands_nologo::after { font-size: 24px; }
  body.nd ul.ad-brand-other-ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  body.nd ul.ad-brand-other-ul > li > a, body.nd ul.ad-brand-other-ul > li > a:hover { gap: 8px 10px; padding: 13px 14px; }
  body.nd .model-cats li a { padding: 8px 10px; font-size: var(--nd-fs-14); }
  body.nd .ad-catbox > ul.row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  body.nd .ad-catbox .ad-catbox-inner, body.nd .ad-catbox .ad-catbox-inner:hover { min-height: 84px; padding: 10px 10px 10px 14px; }
  body.nd .ad-catbox .ad-catbox-inner > .row > .image { flex-basis: 84px; width: 84px; }
  body.nd .ad-catbox .image img { max-height: 64px; }
  body.nd .ad-catbox ul li a span.cathead { font-size: 18px; }
  body.nd #td_select_car_form .landing-page-form-box.gray-box { padding: 6px 14px 16px; }
}

/* ==== Kalkulacky, novinky, vyhladavanie bez vysledku, VIN, zabudnute heslo - facelift ==== */

/* ---- Kalkulacky: zoznam a detail (kalkulacky_list.php, kalkulacky_detail.php, kalkulacky_naplne.php)
   Farby su v template/respo/css/kalkulacky.css (vlastny subor, nd_palette.py ho nepokryva) - preto rucne. */
body.nd .kalk-lead, body.nd .kalk-lead p { font-size: var(--nd-fs-15); line-height: 1.6; color: var(--nd-ink-2); }
body.nd .kalk-disclaimer { font-size: var(--nd-fs-13-5); line-height: 1.5; color: var(--nd-muted); }
/* dlazdice */
body.nd .kalk-tile { border-color: var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); color: var(--nd-ink); }
body.nd .kalk-tile:hover, body.nd .kalk-tile:focus { border-color: var(--nd-accent); box-shadow: var(--nd-shadow-sm); color: var(--nd-ink); }
body.nd .kalk-tile-icon { background: var(--nd-accent); color: var(--nd-on-accent); }
body.nd .kalk-tile-title { font-size: var(--nd-fs-15); color: var(--nd-ink); }
body.nd .kalk-tile-text { font-size: var(--nd-fs-15); line-height: 1.45; color: var(--nd-muted); }
body.nd .kalk-tiles-small .kalk-tile-title { font-size: var(--nd-fs-14); }
/* formular */
body.nd .kalk-box-form { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2); }
body.nd .kalk-form label { font-size: var(--nd-fs-14); font-weight: 600; color: var(--nd-ink); }
body.nd .kalk-fieldset { border-color: var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface); }
body.nd .kalk-fieldset legend { font-size: var(--nd-fs-14); font-weight: 700; color: var(--nd-ink); }
/* jednotka za polom: Bootstrap .input-group-addon (#eee, roh 4 px) */
body.nd .kalk-form .input-group-addon {
  min-width: 64px; border-color: var(--nd-line); background: var(--nd-surface-2); color: var(--nd-muted); font-size: var(--nd-fs-13);
}
body.nd .kalk-form .input-group-addon:last-child { border-radius: 0 var(--nd-r) var(--nd-r) 0; }
body.nd .kalk-hint { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .kalk-error { font-size: var(--nd-fs-13); color: var(--nd-danger); }
body.nd .kalk-field.has-error .form-control { border-color: var(--nd-danger); }
/* tlacidla ako btn-primary v nd */
body.nd .kalk-submit {
  height: 40px; padding: 0 22px; border: 0; border-radius: var(--nd-r); background: var(--nd-accent); color: var(--nd-on-accent);
  font-size: var(--nd-fs-15); font-weight: 700;
}
body.nd .kalk-submit:hover, body.nd .kalk-submit:focus { background: var(--nd-accent-deep); color: var(--nd-on-accent); }
body.nd .mainContainer a.kalk-all-btn {
  padding: 12px 26px; border-radius: var(--nd-r); background: var(--nd-accent); box-shadow: none;
  color: var(--nd-on-accent) !important; /* kalkulacky.css ma farbu s !important */
}
body.nd .mainContainer a.kalk-all-btn:hover, body.nd .mainContainer a.kalk-all-btn:focus { background: var(--nd-accent-deep); box-shadow: none; }
/* vysledok: biely panel s jemnym ramikom namiesto 2px zltej */
body.nd .kalk-box-out { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); box-shadow: var(--nd-shadow-sm); }
body.nd .kalk .kalk-out-title {
  font-family: var(--nd-font-display); font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd .kalk-figure { border-radius: var(--nd-r); background: var(--nd-surface-2); }
body.nd .kalk-figure.is-main { background: var(--nd-accent-soft); }
body.nd .kalk-figure-label { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .kalk-figure-value { font-family: var(--nd-font-display); color: var(--nd-ink); }
body.nd .kalk-figure-value small { color: var(--nd-muted); }
body.nd .kalk-table { font-size: var(--nd-fs-14); }
body.nd .kalk-table caption { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .kalk-table > thead > tr > th { border-bottom-color: var(--nd-line); font-size: var(--nd-fs-13); font-weight: 600; color: var(--nd-muted); }
body.nd .kalk-table > tbody > tr > td { border-top-color: var(--nd-line); }
body.nd .kalk-table tr.is-highlight td { background: var(--nd-accent-soft); color: var(--nd-ink); }
/* poznamky pod vysledkom */
body.nd .kalk-notes li { border-radius: var(--nd-r); font-size: var(--nd-fs-14); color: var(--nd-ink-2); }
body.nd .kalk-note-info { background: var(--nd-info-soft); }
body.nd .kalk-note-info::before { color: var(--nd-info); }
body.nd .kalk-note-warn { background: var(--nd-warn-soft); }
body.nd .kalk-note-warn::before { color: var(--nd-warn); }
body.nd .kalk-note-ok { background: var(--nd-ok-soft); }
body.nd .kalk-note-ok::before { color: var(--nd-ok); }
body.nd .kalk-results-empty p { font-size: var(--nd-fs-15); color: var(--nd-muted); }
/* texty pod kalkulackou */
body.nd .kalk-section p, body.nd .kalk-section li { font-size: var(--nd-fs-15); color: var(--nd-ink-2); }
body.nd .kalk-faq details { border-bottom-color: var(--nd-line); }
body.nd .kalk-faq summary { font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }
body.nd .kalk-faq details > div, body.nd .kalk-faq details > div p { font-size: var(--nd-fs-15); }
body.nd .kalk-related a { border-color: var(--nd-line); border-radius: var(--nd-r-pill); color: var(--nd-ink); font-size: var(--nd-fs-14); }
body.nd .kalk-related a:hover { border-color: var(--nd-accent); background: var(--nd-accent-soft); }
/* naplne do auta: obal vyberu auta, garaz, karty objemov (samotne selecty nechavame vyberu auta) */
body.nd .kalk-naplne-form { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2); }
body.nd .kalk-naplne-form label { font-size: var(--nd-fs-14); font-weight: 600; color: var(--nd-ink); }
body.nd .kalk-naplne-garaz-label { font-size: var(--nd-fs-14); }
body.nd .kalk-naplne-garaz-auto { border-color: var(--nd-line); border-radius: var(--nd-r-pill); font-size: var(--nd-fs-14); }
body.nd .kalk-naplne-garaz-auto:hover, body.nd .kalk-naplne-garaz-auto.is-active { border-color: var(--nd-accent); background: var(--nd-accent-soft); }
body.nd .kalk .kalk-naplne-auto { font-size: 22px; text-transform: none; color: var(--nd-ink); }
body.nd .kalk-naplne-auto small { font-size: var(--nd-fs-14); color: var(--nd-muted); }
body.nd .kalk-naplne-karta { border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); box-shadow: var(--nd-shadow-sm); }
body.nd .kalk-naplne-karta-nazov { font-size: var(--nd-fs-14); font-weight: 600; color: var(--nd-muted); }
body.nd .kalk-naplne-karta-objem { font-family: var(--nd-font-display); color: var(--nd-ink); }
body.nd .kalk-naplne-karta-rozsah { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .kalk-naplne-karta-normy { border-radius: var(--nd-r-sm); background: var(--nd-surface-2); font-size: var(--nd-fs-13); }
body.nd .kalk-naplne-pozn { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .kalk-naplne-prazdne { border-radius: var(--nd-r); background: var(--nd-warn-soft); font-size: var(--nd-fs-15); }
body.nd .kalk-naplne-prazdne p { margin: 0; font-size: inherit; }
body.nd .kalk-naplne-tovar-pozn { font-size: var(--nd-fs-14); color: var(--nd-muted); }
body.nd .kalk-naplne-tovar-pozn .fa-circle-check { color: var(--nd-ok); }
body.nd .kalk-naplne-tovar-pozn .fa-circle-info { color: var(--nd-info); }
body.nd .kalk-naplne-kombo { background: var(--nd-accent-soft); font-size: var(--nd-fs-14); color: var(--nd-ink); }
body.nd .kalk-naplne-kombo .fa-calculator { color: var(--nd-muted); }
body.nd .kalk-naplne-doplnok { border-color: var(--nd-accent); }
body.nd .kalk-naplne-doplnok-text { font-size: var(--nd-fs-13); color: var(--nd-muted); }
/* panel vysledku je do 1199 px uzky (pri stlpci formulara, na mobile cela sirka): tesnejsi panel a bunky, hlavicka tabulky
   sa smie zalomit (Bootstrap .table-responsive ju na mobile drzi v riadku); siroke tabulky sa dalej posuvaju vo vnutri */
@media (max-width: 1199px) {
  body.nd .kalk-box-out { padding: 14px 12px; }
  body.nd .kalk-box-out .table-responsive > .kalk-table > thead > tr > th { white-space: normal; vertical-align: bottom; }
  body.nd .kalk-table > thead > tr > th, body.nd .kalk-table > tbody > tr > td { padding: 7px 6px; font-size: var(--nd-fs-13); }
  /* posledny stlpec (podiel, rozdiel) v jednom riadku - inak sa "37,0 %" lame na dva */
  body.nd .kalk-table > tbody > tr > td:last-child { white-space: nowrap; }
}
/* tablet: vedla bocneho menu ostava na dva stlpce ~260 px a tabulky sa posuvali o 50-110 px - vysledok pod formular ako na mobile */
@media (min-width: 768px) and (max-width: 991px) {
  body.nd .kalk-box { grid-template-columns: minmax(0, 1fr); }
  body.nd .kalk-box-out { position: static; }
}
@media (max-width: 767px) {
  body.nd .kalk-box-out .table-responsive { border-color: var(--nd-line); border-radius: var(--nd-r); }
}

/* ---- Novinky: zoznam (template/default/page_news.php; povodne styly .latestArticlesB v comco.css a comco-templates.css)
   Karta: obrazok hore (poradie cez flex order, markup ma nadpis a datum nad obrazkom), nadpis bez verzaliek. */
/* riadok ako flex: karty v jednom riadku rovnako vysoke bez pevnych vysok (stare min-height 336 px a vyska nadpisu 36 px
   by dlhsi nadpis alebo popis orezali); ::before/::after clearfixu by boli flex polozky */
body.nd .latestArticlesB { display: flex; flex-wrap: wrap; }
body.nd .latestArticlesB::before, body.nd .latestArticlesB::after { content: none; }
body.nd .latestArticlesB > [class*="col-"] { display: flex; float: none; }
body.nd .latestArticlesB > ul { flex: 0 0 calc(100% - 30px); margin: 14px 15px 0; padding: 0; }
body.nd .latestArticlesB .thumbnail.news-card {
  display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; min-height: 0; margin-bottom: 20px; padding: 0 0 16px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); overflow: hidden;
  transition: border-color .15s, box-shadow .15s;
}
body.nd .latestArticlesB .thumbnail.news-card:hover { border-color: var(--nd-muted-2); box-shadow: var(--nd-shadow); }
body.nd .latestArticlesB .news-card > br { display: none; }
/* odkaz s obrazkom (alebo prazdny .news-img-empty) je jediny priamy <a> karty */
body.nd .latestArticlesB .news-card > a { display: block; order: -1; margin: 0 0 14px; }
body.nd .latestArticlesB .thumbnail img.news-img { display: block; width: 100%; height: 180px; max-height: none; border-radius: 0; }
body.nd .latestArticlesB .thumbnail a.news-img-empty { background: var(--nd-surface-2); }
body.nd .latestArticlesB .thumbnail h5.news-title {
  height: auto; overflow: visible; margin: 0 16px 4px;
  font-family: var(--nd-font-display); font-size: 18px; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-transform: none;
}
body.nd .latestArticlesB .thumbnail h5.news-title a { color: var(--nd-ink); text-transform: none; }
body.nd .latestArticlesB .thumbnail h5.news-title a:hover { color: var(--nd-accent-ink); }
body.nd .latestArticlesB .thumbnail span.meta.news-date { margin: 0 16px 8px; font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .latestArticlesB .thumbnail .caption.news-caption { height: auto; margin: 0; padding: 0 16px; }
body.nd .latestArticlesB .news-caption p { font-size: var(--nd-fs-15); line-height: 1.45; color: var(--nd-ink-2); }
/* tablet: tri stlpce po ~155 px - nizsi obrazok a mensi nadpis */
@media (min-width: 768px) and (max-width: 991px) {
  body.nd .latestArticlesB .thumbnail img.news-img, body.nd .latestArticlesB .thumbnail a.news-img-empty { height: 120px; }
  body.nd .latestArticlesB .thumbnail h5.news-title { margin: 0 12px 4px; font-size: 16px; }
  body.nd .latestArticlesB .thumbnail span.meta.news-date { margin: 0 12px 6px; }
  body.nd .latestArticlesB .thumbnail .caption.news-caption { padding: 0 12px; }
}
/* starsie novinky pod kartami (az 100 clankov, len nadpis a perex): karty v dvoch stlpcoch, na mobile v jednom.
   Cela karta je odkaz (::after nadpisu cez celu polozku), sipka vpravo ako vo vybere z katalogu, perex na dva riadky.
   Markup: <li><a><strong>nadpis</strong></a> <p class='news-p'>perex</p></p> - zatulane </p> robi prazdny <p>. */
body.nd .latestArticlesB > ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; }
body.nd .latestArticlesB > ul::before {
  content: "Staršie novinky"; grid-column: 1 / -1; margin: 10px 0 4px;
  font-family: var(--nd-font-display); font-size: 22px; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; color: var(--nd-ink);
}
body.nd .latestArticlesB > ul > li {
  position: relative; display: flex; flex-direction: column; justify-content: center; gap: 4px; min-width: 0; margin: 0;
  padding: 14px 48px 14px 18px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
  box-shadow: var(--nd-shadow-sm); list-style: none; transition: border-color .15s, box-shadow .15s;
}
body.nd .latestArticlesB > ul > li:hover { border-color: var(--nd-muted-2); box-shadow: var(--nd-shadow); }
body.nd .latestArticlesB > ul > li::after {
  content: ""; position: absolute; top: 50%; right: 18px; width: 16px; height: 16px; margin-top: -8px;
  background: var(--nd-accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
body.nd .latestArticlesB > ul > li > a { text-decoration: none !important; }
body.nd .latestArticlesB > ul > li > a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
body.nd .latestArticlesB > ul > li > a strong {
  font-family: var(--nd-font-display); font-size: 17px; font-weight: 700; line-height: 1.25; color: var(--nd-ink); transition: color .15s;
}
body.nd .latestArticlesB > ul > li:hover > a strong { color: var(--nd-accent-ink); }
body.nd .latestArticlesB li p.news-p {
  display: -webkit-box; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  font-size: var(--nd-fs-15); line-height: 1.45; color: var(--nd-muted);
}
body.nd .latestArticlesB > ul > li > p:empty { display: none; }
@media (max-width: 767px) {
  body.nd .latestArticlesB > ul { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  body.nd .latestArticlesB > ul > li { padding: 12px 40px 12px 14px; }
  body.nd .latestArticlesB > ul > li::after { right: 14px; }
  body.nd .latestArticlesB > ul > li > a strong { font-size: 16px; }
}

/* ---- Rozcestnik podstranok (template/default/subpages_list.php: Vsetko o nakupe a33, Zakaznicky servis a692 - na DEV
   jedine dve stranky so subpages = list, 12.10.2026). Dlazdice ako zoznam noviniek: cela dlazdica je odkaz (a.title::after),
   odkazy v kratkom popise (napr. Zaregistrujte sa) su nad nim. Markup: <li>&raquo; <a class=title> <br> <div class=shortdesc>
   - holy text &raquo; schova font-size 0 na li, deti maju velkost vlastnu. li.photo (subpages_list_photo/news) sem nepatri. */
body.nd ul.subpages:has(> li:not(.photo)) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; margin: 10px 0 32px; padding: 0; }
body.nd ul.subpages > li:not(.photo) {
  position: relative; display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0 !important;
  padding: 18px 64px 18px 20px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
  box-shadow: var(--nd-shadow-sm); font-size: 0; list-style: none; transition: border-color .15s, box-shadow .15s, transform .15s;
}
body.nd ul.subpages > li:not(.photo):hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow); transform: translateY(-1px); }
body.nd ul.subpages > li:not(.photo) > br { display: none; }
/* sipka v zltom kruzku vpravo */
body.nd ul.subpages > li:not(.photo)::before {
  content: ""; position: absolute; top: 50%; right: 18px; width: 32px; height: 32px; margin-top: -16px; border-radius: 50%;
  background: var(--nd-accent-soft); transition: background-color .15s;
}
body.nd ul.subpages > li:not(.photo)::after {
  content: ""; position: absolute; top: 50%; right: 26px; width: 16px; height: 16px; margin-top: -8px;
  background: var(--nd-accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
body.nd ul.subpages > li:not(.photo):hover::before { background: var(--nd-accent); }
body.nd ul.subpages > li:not(.photo):hover::after { background: var(--nd-ink); }
body.nd ul.subpages > li:not(.photo) > a.title {
  font-family: var(--nd-font-display); font-size: 18px; font-weight: 700; line-height: 1.25; color: var(--nd-ink) !important; transition: color .15s;
}
body.nd ul.subpages > li:not(.photo) > a.title::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
body.nd ul.subpages > li:not(.photo) > .shortdesc {
  display: -webkit-box; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
  font-size: var(--nd-fs-14-5); line-height: 1.5; color: var(--nd-muted);
}
body.nd ul.subpages > li:not(.photo) > .shortdesc p { display: inline; margin: 0; padding: 0; font-size: inherit; line-height: inherit; color: inherit; }
body.nd ul.subpages > li:not(.photo) > .shortdesc b, body.nd ul.subpages > li:not(.photo) > .shortdesc strong { font-weight: 600; color: var(--nd-ink-2); }
body.nd ul.subpages > li:not(.photo) > .shortdesc a {
  position: relative; z-index: 2; font-size: inherit; font-weight: 600; color: var(--nd-accent-ink) !important;
}
@media (max-width: 767px) {
  body.nd ul.subpages:has(> li:not(.photo)) { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  body.nd ul.subpages > li:not(.photo) { padding: 14px 56px 14px 16px; }
  body.nd ul.subpages > li:not(.photo)::before { right: 14px; }
  body.nd ul.subpages > li:not(.photo)::after { right: 22px; }
  body.nd ul.subpages > li:not(.photo) > a.title { font-size: 17px; }
}

/* ---- Clanok noviniek: Precitajte si tiez (template/default/page.php, triedy read-next* len pre nd, 12.10.2026) ----
   Dlazdice ako zoznam noviniek, 3 / 2 / 1 stlpce; cela dlazdica je odkaz. Pod plavajucim obrazkom clanku (clear). */
body.nd .mainContainer > br:has(+ .read-next-head) { display: none; }
body.nd .read-next-head { clear: both; margin: 32px 0 14px; padding-top: 24px; border-top: 1px solid var(--nd-line); }
body.nd .read-next-head h4 {
  margin: 0; font-family: var(--nd-font-display); font-size: 22px; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em;
  text-transform: none; color: var(--nd-ink);
}
body.nd ul.read-next { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 14px; margin: 0 0 32px; padding: 0; }
body.nd ul.read-next > li {
  position: relative; display: flex; align-items: center; min-width: 0; min-height: 60px; margin: 0; padding: 10px 44px 10px 16px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
  list-style: none; transition: border-color .15s, box-shadow .15s, transform .15s;
}
body.nd ul.read-next > li:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow); transform: translateY(-1px); }
body.nd ul.read-next > li::after {
  content: ""; position: absolute; top: 50%; right: 16px; width: 16px; height: 16px; margin-top: -8px;
  background: var(--nd-accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
body.nd ul.read-next > li > a {
  display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--nd-ink) !important; text-decoration: none !important; transition: color .15s;
}
body.nd ul.read-next > li > a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
body.nd ul.read-next > li:hover > a { color: var(--nd-accent-ink) !important; }
@media (max-width: 991px) {
  body.nd ul.read-next { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  body.nd .read-next-head { margin-top: 24px; padding-top: 18px; }
  body.nd .read-next-head h4 { font-size: 20px; }
  body.nd ul.read-next { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  body.nd ul.read-next > li { min-height: 0; padding: 12px 40px 12px 14px; }
  body.nd ul.read-next > li::after { right: 14px; }
}

/* ---- Vyhladavanie: hlavicka s hladanym vyrazom a hlaska bez vysledku (template/default/search_results.php;
   povodne styly v comco-templates.css, zlty pruh vlavo z palety nd.css) */
body.nd .search-results, body.nd .search-categories {
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2);
}
body.nd .search-box-label { font-size: var(--nd-fs-13); font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--nd-muted); }
/* h1 s vlastnou triedou: verzalky z .mainContainer h1 tu nechceme - je to presne to, co zakaznik napisal */
body.nd .search-results h1.search-term, body.nd .search-results h1.search-term strong {
  font-family: var(--nd-font-display); font-size: 26px; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
  overflow-wrap: anywhere;
}
body.nd .search-note-loosened { font-size: var(--nd-fs-14); color: var(--nd-warn); }
body.nd .search-note-narrowed { font-size: var(--nd-fs-14); color: var(--nd-info); }
body.nd .search-categories .frame { border-color: var(--nd-line); border-radius: var(--nd-r); overflow: hidden; }
body.nd .search-cat-toggle { font-size: var(--nd-fs-13-5); color: var(--nd-ink); }
/* hlaska musi ostat vyrazna (pod nou moze byt skupina cudzich cisel) - ako info box v kosiku, pismo ako prazdny kosik */
body.nd .search-nothing {
  padding: 16px 18px; border: 0; border-left: 3px solid var(--nd-accent-deep); border-radius: 0 var(--nd-r) var(--nd-r) 0;
  background: var(--nd-accent-soft); font-family: var(--nd-font-display); font-size: 22px; font-weight: 600; line-height: 1.3; color: var(--nd-ink);
}

/* ---- Chranena stranka (VIN katalog): hlaska nad prihlasenim (template/default/page_login.php; .page-protected v comco.css)
   Sirka ako panel prihlasenia pod nou (.logIn: col-md-6 offset-3, col-sm-8 offset-2). */
body.nd .page-protected {
  max-width: calc(50% - 15px); margin: 14px auto 18px; padding: 12px 16px; border-radius: var(--nd-r);
  background: var(--nd-warn-soft); color: var(--nd-ink); font-size: 16px; font-weight: 600; line-height: 1.4; text-align: center;
}
body.nd .page-protected::before {
  content: "\f023"; margin-right: 8px; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--nd-warn);
}
@media (min-width: 768px) and (max-width: 991px) { body.nd .page-protected { max-width: calc(66.6667% - 10px); } }
@media (max-width: 767px) { body.nd .page-protected { max-width: none; } }

/* ---- Zabudnute heslo /customer/lost_password (template/default/customer_lost_password.php - bez stylov v teme respo)
   Panel ako prihlasenie na /customer/login (.logIn .panel): rovnaka sirka, svetlosiva hlavicka, polia a tlacidlo;
   odstup od hlavicky stranky 24 px ako <br> pred .logIn (bez neho panel lepi na listu menu). */
body.nd form.customerpassword .customer-login fieldset {
  max-width: calc(50% - 15px); margin: 24px auto 20px; padding: 0 30px 15px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  background: var(--nd-surface); overflow: hidden;
}
@media (min-width: 768px) and (max-width: 991px) { body.nd form.customerpassword .customer-login fieldset { max-width: calc(66.6667% - 10px); } }
@media (max-width: 767px) { body.nd form.customerpassword .customer-login fieldset { max-width: none; } }
/* float: legenda sa potom kresli vo vnutri fieldsetu ako hlavicka panelu, nie v jeho hornom ramiku */
body.nd form.customerpassword .customer-login legend {
  float: left; box-sizing: content-box; width: 100%; margin: 0 -30px 20px; padding: 14px 30px; border: 0; border-bottom: 1px solid var(--nd-line);
  background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent); font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2; text-align: left;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd form.customerpassword .customer-login legend + * { clear: both; }
body.nd form.customerpassword .customer-login .input { margin-bottom: 18px; }
body.nd form.customerpassword .customer-login .input label { display: block; margin: 0 0 5px; font-size: var(--nd-fs-13); font-weight: 700; color: var(--nd-ink); }
/* input[type=password]: nastavenie hesla z odkazu v maile, template/default/customer_set_password.php (COMCO-98) */
body.nd form.customerpassword .customer-login :is(input#customer_email_reset, input[type="password"]) {
  display: block; width: 100%; height: 50px; padding: 6px 12px; border: 1px solid var(--nd-line); border-radius: var(--nd-r);
  background: var(--nd-surface); font-size: 16px; color: var(--nd-ink); box-shadow: none; outline: 0;
}
body.nd form.customerpassword .customer-login :is(input#customer_email_reset, input[type="password"]):focus { border-color: var(--nd-accent); box-shadow: 0 0 0 3px var(--nd-accent-soft); }
body.nd form.customerpassword .customer-login .buttons { margin: 0 0 16px; }
body.nd form.customerpassword .customer-login .buttons > button.button {
  display: block; width: 100%; height: 50px; padding: 0 16px; border: 1px solid var(--nd-accent); border-radius: var(--nd-r);
  background: var(--nd-accent); font-size: var(--nd-fs-15); font-weight: 700; color: var(--nd-on-accent); cursor: pointer;
}
body.nd form.customerpassword .customer-login .buttons > button.button:hover,
body.nd form.customerpassword .customer-login .buttons > button.button:focus { border-color: var(--nd-accent-deep); background: var(--nd-accent-deep); }
body.nd form.customerpassword .customer-login fieldset > p { margin: 0; font-size: var(--nd-fs-14); line-height: 1.5; color: var(--nd-muted); }
body.nd form.customerpassword .customer-login fieldset > p.customer-set-password__account { margin: 0 0 18px; color: var(--nd-ink); }
/* hlasky po odoslani (chyba / e-mail odoslany) */
body.nd form.customerpassword .customer-login :is(.error, .msg) { margin: 0 0 16px; padding: 10px 14px; border-radius: var(--nd-r); font-size: var(--nd-fs-14); }
body.nd form.customerpassword .customer-login :is(.error, .msg) p { margin: 0; font-size: inherit; }
body.nd form.customerpassword .customer-login .error { background: var(--nd-danger-soft); color: var(--nd-danger); }
body.nd form.customerpassword .customer-login .msg { background: var(--nd-ok-soft); color: var(--nd-ok); }

/* ==== Titulka (/, template/default/page_home.php) - facelift ====
   Len CSS nad starym markupom. Stary slider (slider.php) ani stary formular vyberu auta (.main_page_form) nd
   nevykresluje - titulka aj stranky typov maju kartu nd_home_vsel (blok Titulka - hero); ich pravidla zmazane
   15.10.2026. Select2 (vyber znacky, modelu, ...) je stylovany pre cele nd.
   Vseobecne nadpisy h1-h4 v .mainContainer (aj h2.underlined „Odporucame“) riesi spolocny blok nadpisov. */

/* nadpis stranky (COMCO-60: jediny H1) */
body.nd .mainContainer h1.hp-h1 {
  margin: 4px 0 12px; font-family: var(--nd-font-display); font-size: 28px; font-weight: 700; line-height: 1.15;
  letter-spacing: -0.01em; text-transform: none; text-align: left; color: var(--nd-ink);
}

/* --- pas s ikonami (render_icon_strip) --- */
/* !important: pozadie a farbu ma pas v inline style z adminu */
body.nd .icon-strip { border-radius: var(--nd-r-lg); background: var(--nd-surface-2) !important; color: var(--nd-ink) !important; }
body.nd .icon-strip__text { color: var(--nd-muted); opacity: 1; }

/* --- Novinky na titulke (page_home.php .latestArticles; povodne styly v comco.css) - karty podla prototypu
   (pages-blog.jsx BlogCard): obrazok hore 16:10, nadpis, perex, dole datum so sipkou. a.hp-news-link obaluje celu kartu.
   Nahlad _250x250 je 500 x 500 so stvorcovym okrajom okolo fotky - object-fit: cover ho oreze. Na mobile karta na sirku. */
body.nd .latestArticles .page-header { margin: 0 0 14px; padding: 0; border: 0; }
body.nd .latestArticles .hp-news-title { margin: 0; }
body.nd .latestArticles .hp-news-title, body.nd .latestArticles .hp-news-title a {
  font-family: var(--nd-font-display); font-size: 22px; font-weight: 700; line-height: 1.2; text-transform: none; letter-spacing: -0.01em; color: var(--nd-ink);
}
body.nd .latestArticles .thumbnail {
  display: flex; flex-direction: column; height: 100%; margin: 0; padding: 0; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  background: var(--nd-surface); box-shadow: var(--nd-shadow-sm); overflow: hidden; transition: border-color .15s, box-shadow .15s;
}
body.nd .latestArticles .thumbnail:hover { border-color: var(--nd-muted-2); box-shadow: var(--nd-shadow); }
body.nd .latestArticles .thumbnail > .stopflow, body.nd .latestArticles .thumbnail > hr { display: none; }
body.nd .latestArticles .hp-news-link { display: flex; flex-direction: column; flex: 1 1 auto; padding: 0 16px 14px; color: var(--nd-ink); text-decoration: none !important; }
body.nd .latestArticles .hp-news-link img {
  order: -1; display: block; float: none; position: static; width: calc(100% + 32px); max-width: none; height: auto; max-height: none;
  margin: 0 -16px 14px; padding: 0; aspect-ratio: 16 / 10; object-fit: cover; background: var(--nd-surface-2);
}
body.nd .latestArticles .hp-news-link h5 {
  margin: 0 0 6px; font-family: var(--nd-font-display); font-size: 17px; font-weight: 700; line-height: 1.25;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink); transition: color .15s;
}
body.nd .latestArticles .thumbnail:hover .hp-news-link h5 { color: var(--nd-accent-ink); }
body.nd .latestArticles .hp-news-link .caption { flex: 1 1 auto; margin: 0 0 12px; padding: 0; }
body.nd .latestArticles .hp-news-link .caption p { margin: 0; font-size: var(--nd-fs-15); line-height: 1.5; color: var(--nd-muted); }
body.nd .latestArticles .hp-news-date { order: 3; display: flex; align-items: center; margin: 0; font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd .latestArticles .hp-news-date::after {
  content: ""; width: 16px; height: 16px; margin-left: auto; background: var(--nd-accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
body.nd .latestArticles .hp-news-more { margin-top: 12px; text-align: right; }
body.nd .latestArticles .hp-news-more a { font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink) !important; text-decoration: none !important; }  /* !important proti .mainContainer a z comco.css */
body.nd .latestArticles .hp-news-more a:hover { color: var(--nd-accent-ink) !important; }
body.nd .latestArticles .hp-news-more a::after {
  content: ""; display: inline-block; width: 16px; height: 16px; margin-left: 6px; vertical-align: -3px;
  background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
/* mobil: obrazok vlavo, text vpravo (tri karty pod sebou s obrazkom 16:10 by boli pres celu obrazovku) */
@media (max-width: 767px) {
  body.nd .latestArticles .thumbnail { height: auto; margin-bottom: 10px; }
  body.nd .latestArticles .hp-news-link { display: grid; grid-template-columns: 104px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 14px; padding: 12px; }
  body.nd .latestArticles .hp-news-link img { grid-column: 1; grid-row: 1 / span 3; width: 104px; margin: 0; aspect-ratio: 4 / 3; border-radius: var(--nd-r); }
  body.nd .latestArticles .hp-news-link h5 { grid-column: 2; grid-row: 1; margin-bottom: 4px; font-size: 16px; }
  body.nd .latestArticles .hp-news-link .caption { grid-column: 2; grid-row: 2; margin-bottom: 6px; }
  body.nd .latestArticles .hp-news-date { grid-column: 2; grid-row: 3; align-self: end; }
  body.nd .latestArticles .hp-news-more { margin-top: 2px; }
}

/* ==== Titulka - hero podla prototypu (12.10.2026, template/nd/home_hero.php; pages-home.jsx HomePage, VehicleSelector,
   SkyscraperCarousel) ====
   Pas na celu sirku okna pod hlavickou (layout.php nad .container): svetle pozadie s fotkou auta vpravo (ta ista ako pod
   starym formularom), prechod zlava a jemny sikmy vzor. Vo vnutri .container: vlavo H1 a vyber auta (biela karta so
   zalozkami Podla vozidla / Podla VIN / Hladat diely), vpravo bannery skupiny 10. Slider nad obsahom v nd nie je.
   Formular ma triedy .ad-main-page-form a .car_select2_form kvoli spolocnemu JS - comco.css im dava biele odkazy
   s tienom; keby hero skoncil v obsahu (page_home.php), .mainContainer a ma color #000 !important - preto !important
   na farbach odkazov. */
body.nd .nd-hero {
  position: relative; margin: 0 0 22px; padding: 36px 0 38px; border-bottom: 1px solid var(--nd-line);
  background:
    repeating-linear-gradient(135deg, transparent 0 22px, rgba(242,183,30,.07) 22px 23px),
    linear-gradient(90deg, rgba(246,247,248,.96) 0%, rgba(246,247,248,.88) 45%, rgba(246,247,248,.45) 72%, rgba(246,247,248,.08) 100%),
    url('/files/vyhladavanie/comco_auto2.webp') right center / cover no-repeat,
    var(--nd-surface-3);
  text-align: left;
}
body.nd .nd-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: stretch; }
body.nd .nd-hero__inner::before, body.nd .nd-hero__inner::after { content: none; display: none; }  /* clearfix .container by bol polozkou gridu */
body.nd .nd-hero--no-ads .nd-hero__inner { grid-template-columns: minmax(0, 1fr); }
body.nd .nd-hero__main { min-width: 0; }
body.nd .nd-hero h1.hp-h1 {
  margin: 0 0 20px; font-family: var(--nd-font-display); font-size: 36px; font-weight: 700; line-height: 1.05;
  letter-spacing: -0.02em; text-transform: none; text-align: left; color: var(--nd-ink);
}

/* ikonovy pas „Homepage“ pod vyberom auta (render_icon_strip(1)) ako trust riadok prototypu: ikona v bielom stvorci,
   styri polozky v rade. !important: pas ma pozadie, odsadenie, velkost ikony aj pisma v inline style z adminu */
body.nd .nd-hero .icon-strip { margin: 22px 0 0; padding: 0 !important; border-radius: 0; background: none !important; }
body.nd .nd-hero .icon-strip__inner {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 16px; width: auto; max-width: none; margin: 0; padding: 0;
}
body.nd .nd-hero .icon-strip__item { gap: 10px; min-width: 0; }
body.nd .nd-hero .icon-strip__icon {
  display: grid !important; place-items: center; width: 40px !important; height: 40px !important; font-size: 22px !important;
  border-radius: var(--nd-r); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
}
body.nd .nd-hero .icon-strip__txt { min-width: 0; line-height: 1.25; }
body.nd .nd-hero .icon-strip__title { font-size: var(--nd-fs-14) !important; color: var(--nd-ink); }
body.nd .nd-hero .icon-strip__text { margin-top: 1px; font-size: var(--nd-fs-13) !important; }

/* --- karta vyberu auta --- */
body.nd .nd-vsel { position: relative; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-lg); }
body.nd .nd-vsel__tabs { display: flex; border-bottom: 1px solid var(--nd-line); border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0; overflow: hidden; }
body.nd .nd-vsel__tab {
  display: flex; flex: 1 1 0; align-items: center; justify-content: center; gap: 8px; min-width: 0; margin: 0; padding: 14px 10px 12px;
  border: 0; border-bottom: 3px solid transparent; background: var(--nd-surface-2);
  font-family: var(--nd-font-body); font-size: 15px; font-weight: 700; line-height: 1.2; color: var(--nd-muted); cursor: pointer;
  transition: background-color .15s, color .15s;
}
body.nd .nd-vsel__tab:hover { color: var(--nd-ink); }
body.nd .nd-vsel__tab.is-active { border-bottom-color: var(--nd-accent); background: var(--nd-surface); color: var(--nd-ink); }
body.nd .nd-vsel__tab .nd-ico { flex: none; color: var(--nd-muted-2); }
body.nd .nd-vsel__tab.is-active .nd-ico { color: var(--nd-accent); }
body.nd .nd-vsel__tab:focus-visible { outline: 2px solid var(--nd-accent); outline-offset: -4px; }
body.nd .nd-vsel__pane { padding: 18px 22px 18px; }
body.nd .nd-vsel__pane[hidden] { display: none; }
/* od tabletu su zalozky v jednej bunke: prepnutie na kratsiu VIN / Hladat nezmensi kartu (ani stlpec bannerov vedla) */
@media (min-width: 768px) {
  body.nd .nd-vsel__panes { display: grid; }
  body.nd .nd-vsel__pane { grid-area: 1 / 1; min-width: 0; }
  /* opacity: tlacidla maju transition na all, zdedena visibility by ich pri prepnuti este chvilu ukazala */
  body.nd .nd-vsel__pane[hidden] { display: block; visibility: hidden; opacity: 0; pointer-events: none; }
}

/* typ vozidla: dlazdice v jednom rade, dlhy nazov („Nakladne auta a autobusy“) sa zalomi vo vnutri dlazdice */
body.nd .nd-vsel__types { display: flex; gap: 8px; margin: 0 0 16px; }
body.nd .nd-vsel__types > .mpf-tab { display: flex; flex: 1 1 auto; min-width: 0; }
body.nd a.nd-vsel__type {
  display: flex; flex: 1 1 auto; align-items: center; gap: 9px; min-width: 0; min-height: 46px; margin: 0; padding: 7px 12px;
  border: 1.5px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-family: var(--nd-font-body); font-size: var(--nd-fs-14); font-weight: 600; line-height: 1.2; text-decoration: none !important;
  color: var(--nd-ink-2) !important; text-shadow: none; transition: border-color .15s, background-color .15s;
}
body.nd a.nd-vsel__type:hover { border-color: var(--nd-muted-2); }
/* text aktivnej tmavy: --nd-accent-ink na --nd-accent-soft ma kontrast len 4,4:1; zlata ostava v ramiku a ikone */
body.nd a.nd-vsel__type.active { border-color: var(--nd-accent); background: var(--nd-accent-soft); color: var(--nd-on-accent) !important; }
body.nd .nd-vsel__type .nd-ico { flex: none; color: var(--nd-muted); }
body.nd .nd-vsel__type.active .nd-ico { color: var(--nd-accent); }

/* znacka - model - motorizacia v rade, pod nimi hladany diel a tlacidlo (poradie ako v DOM, placeholdre „Krok 1 - Vyberte
   znacku“ sa zmestia; tie pise aj JS do AJAX odpovedi, preto ostavaju) */
body.nd .nd-vsel__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 10px; align-items: end; }
body.nd .nd-vsel__field { min-width: 0; }
body.nd .nd-vsel__q { grid-column: 1 / 3; }
body.nd .nd-vsel__label { display: block; margin: 0 0 6px; font-size: var(--nd-fs-13); font-weight: 700; line-height: 1.2; color: var(--nd-ink-2); }
body.nd .nd-vsel__label span { font-weight: 400; color: var(--nd-muted); }
body.nd .nd-vsel .form-control { height: 46px; margin: 0; border-color: var(--nd-line); border-radius: var(--nd-r); box-shadow: none; font-size: var(--nd-fs-15); }
body.nd .nd-vsel .form-control:focus { border-color: var(--nd-accent); box-shadow: 0 0 0 3px var(--nd-accent-soft); }
body.nd .nd-vsel .car_select2_form .select2-container--default .select2-selection--single { height: 46px; }
body.nd .nd-vsel .car_select2_form .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 44px; padding-left: 12px; font-size: var(--nd-fs-15); }
body.nd .nd-vsel .car_select2_form .select2-container--default .select2-selection--single .select2-selection__arrow { height: 44px; right: 6px; }
body.nd .nd-vsel .nd-vsel__go {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; margin: 0; padding: 0 20px;
  border-radius: var(--nd-r); font-size: 16px; font-weight: 700; line-height: 1; white-space: nowrap; color: var(--nd-on-accent);
}
/* kym nie je vybrate auto, je tlacidlo disabled (_check_frm_button) - zlte, len bledsie */
body.nd .nd-vsel .nd-vsel__go:disabled { opacity: .45; cursor: not-allowed; }

/* ajax loader (comco.css: 237 x 89 biely obdlznik vlavo hore) - cez celu kartu, koliecko v strede */
body.nd .nd-vsel .ad-frm-big-ajax-loader { inset: 0; width: auto; height: auto; margin: 0; border-radius: var(--nd-r-lg); background: rgba(255,255,255,.6); opacity: 1; }
body.nd .nd-vsel .ad-frm-big-ajax-loader img { position: absolute; top: 50%; left: 50%; margin: -32px 0 0 -32px; }

/* zalozky Podla VIN a Hladat diely: policko a tlacidlo v rade */
body.nd .nd-vsel__vinrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
body.nd .nd-vsel__vin .form-control { font-family: var(--nd-font-mono); letter-spacing: .06em; text-transform: uppercase; }
body.nd .nd-vsel__vin .form-control[aria-invalid=true] { border-color: var(--nd-danger); }
body.nd .nd-vsel__hint { margin: 10px 0 0; font-size: var(--nd-fs-13-5); line-height: 1.5; color: var(--nd-muted); }
body.nd .nd-vsel__msg { margin: 12px 0 0; padding: 10px 12px; border-radius: var(--nd-r); font-size: var(--nd-fs-14); line-height: 1.45; }
body.nd .nd-vsel__msg[hidden] { display: none; }
body.nd .nd-vsel__msg--busy, body.nd .nd-vsel__msg--info { background: var(--nd-info-soft); color: var(--nd-ink); }
body.nd .nd-vsel__msg--warn { background: var(--nd-warn-soft); color: var(--nd-ink); }
body.nd .nd-vsel__msg--error { background: var(--nd-danger-soft); color: var(--nd-danger); }
body.nd .nd-vsel__msg a { color: inherit !important; font-weight: 600; text-decoration: underline !important; }
body.nd .nd-vsel__popular { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; }
body.nd .nd-vsel__popular > span { font-size: var(--nd-fs-13); color: var(--nd-muted); }
body.nd a.nd-vsel__chip {
  display: inline-flex; align-items: center; min-height: 32px; padding: 4px 12px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
  font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1.2; color: var(--nd-ink-2) !important; text-decoration: none !important;
  transition: background-color .15s;
}
body.nd a.nd-vsel__chip:hover { background: var(--nd-accent-soft); color: var(--nd-ink) !important; }

/* ta ista karta na strankach typov vozidiel /autodiely/, /autodiely-dodavky/, … bez znacky (nd_type_page_vsel() v home_hero.php):
   v stlpci obsahu medzi popisom a dlazdicami znaciek, bez bannerov a pasu ikon */
body.nd #ad-column-right-inner .nd-vsel { margin: 6px 0 28px; }
/* karta v uvodnom texte CMS stranky (/nahradne-diely-a753): .shortdesc ma kvoli citatelnosti max 820 px - karta na celu
   sirku ako na strankach typov (Stefan 13.10.2026), text ostava 820 px; posuvne pasy Popularnych dielov (.nd-tp, token
   [[top-products]]) tiez na celu sirku - 4 karty v 820 px boli uzke a vysoke */
body.nd .mainContainer > .clearfix > .shortdesc:has(> #nd-vsel) { max-width: none; }
body.nd .mainContainer > .clearfix > .shortdesc:has(> #nd-vsel) > :not(#nd-vsel, .nd-tp) { max-width: 820px; }
body.nd .shortdesc > #nd-vsel { margin: 18px 0 28px; }

/* --- bannery vedla vyberu auta: karta na vysku stlpca, obrazok 3 : 1 cely, text a tlacidlo pod nim --- */
body.nd .nd-hero-ads {
  position: relative; display: flex; flex-direction: column; min-width: 0; border-radius: var(--nd-r-lg);
  background: var(--nd-surface); box-shadow: var(--nd-shadow-lg); overflow: hidden;
}
body.nd .nd-hero-ads__track { display: grid; flex: 1 1 auto; }
body.nd .nd-hero-ad {
  display: flex; grid-area: 1 / 1; flex-direction: column; min-width: 0; color: var(--nd-ink) !important; text-decoration: none !important;
  opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility 0s linear .5s;
}
body.nd .nd-hero-ad.is-active { opacity: 1; visibility: visible; transition: opacity .5s ease; }
body.nd .nd-hero-ad__img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 1; object-fit: cover; background: var(--nd-surface-2); }
body.nd .nd-hero-ad__body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; padding: 16px 20px 46px; }
body.nd .nd-hero-ad__title { font-family: var(--nd-font-display); font-size: 21px; font-weight: 700; line-height: 1.15; letter-spacing: -0.01em; }
body.nd .nd-hero-ad__sub { margin-top: 8px; font-size: var(--nd-fs-14); line-height: 1.45; color: var(--nd-muted); }
body.nd .nd-hero-ad__cta {
  display: inline-flex; align-items: center; gap: 7px; margin-top: auto; padding: 10px 16px; border-radius: var(--nd-r);
  background: var(--nd-dark); font-size: var(--nd-fs-14-5); font-weight: 700; line-height: 1; color: #fff; transition: background-color .15s;
}
body.nd .nd-hero-ad__body > :has(+ .nd-hero-ad__cta) { margin-bottom: 16px; }  /* tlacidlo dole, ale aspon 16 px pod textom */
body.nd .nd-hero-ad:hover .nd-hero-ad__cta { background: var(--nd-ink); }
body.nd .nd-hero-ads__dots { position: absolute; bottom: 16px; left: 20px; display: flex; gap: 7px; }
/* neaktivna bodka --nd-muted-2 (2,6 : 1 na bielej karte); do 15.10.2026 --nd-line-2 mala 1,14 : 1 a nebolo ju vidno */
body.nd .nd-hero-ads__dot {
  width: 8px; height: 8px; margin: 0; padding: 0; border: 0; border-radius: 999px; background: var(--nd-muted-2); cursor: pointer;
  transition: width .3s, background-color .3s;
}
body.nd .nd-hero-ads__dot.is-active { width: 22px; background: var(--nd-accent); }
body.nd .nd-hero-ads__dot:focus-visible { outline: 2px solid var(--nd-accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  body.nd .nd-hero-ad, body.nd .nd-hero-ad.is-active, body.nd .nd-hero-ads__dot { transition: none; }
}

/* 992-1199: uzsi stlpec bannerov, znacka/model a motorizacia/hladany diel po dvoch */
@media (max-width: 1199px) {
  body.nd .nd-hero__inner { grid-template-columns: minmax(0, 1fr) 260px; gap: 22px; }
  body.nd .nd-vsel__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.nd .nd-vsel__q { grid-column: auto; }
  body.nd .nd-vsel__grid .nd-vsel__go { grid-column: 2; justify-self: end; }
  body.nd .nd-vsel__types { gap: 6px; }
  body.nd a.nd-vsel__type { gap: 7px; padding: 7px 10px; font-size: var(--nd-fs-13-5); }
  body.nd .nd-hero .icon-strip__inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* tablet: bannery pod vyberom auta na celu sirku, od 576 px obrazok vlavo a text vpravo (na vysku by bol banner 700 x 230) */
@media (max-width: 991px) {
  body.nd .nd-hero { padding: 28px 0 30px; }
  body.nd .nd-hero__inner { grid-template-columns: minmax(0, 1fr); }
  /* jeden stlpec: vpravo uz nie su bannery, pas ikon by bol nad tmavym autom - prechod svetlejsi po celej sirke */
  body.nd .nd-hero {
    background:
      repeating-linear-gradient(135deg, transparent 0 22px, rgba(242,183,30,.07) 22px 23px),
      linear-gradient(90deg, rgba(246,247,248,.95) 0%, rgba(246,247,248,.85) 55%, rgba(246,247,248,.62) 100%),
      url('/files/vyhladavanie/comco_auto2.webp') right center / cover no-repeat,
      var(--nd-surface-3);
  }
}
@media (min-width: 576px) and (max-width: 991px) {
  body.nd .nd-hero-ad { flex-direction: row; }
  body.nd .nd-hero-ad__img { flex: none; width: 56%; align-self: center; }
  body.nd .nd-hero-ads__dots { left: calc(56% + 20px); }
}
/* mobil: vsetko pod sebou, typy vozidla 2 x 2, zalozky mozu mat dva riadky */
@media (max-width: 767px) {
  body.nd .nd-hero { margin-bottom: 16px; padding: 20px 0 22px; }
  body.nd .nd-hero__inner { gap: 16px; }
  body.nd .nd-hero h1.hp-h1 { margin-bottom: 14px; font-size: 26px; }
  body.nd .nd-vsel__tab { flex-direction: column; gap: 4px; padding: 10px 6px 8px; font-size: var(--nd-fs-13-5); text-align: center; }
  body.nd .nd-vsel__pane { padding: 16px; }
  body.nd .nd-vsel__types { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.nd .nd-hero .icon-strip { margin-top: 16px; }
  body.nd .nd-vsel__grid { grid-template-columns: minmax(0, 1fr); }
  body.nd .nd-vsel__grid .nd-vsel__go { grid-column: auto; width: 100%; }
  body.nd .nd-vsel__vin .nd-vsel__vinrow { grid-template-columns: minmax(0, 1fr); }
  body.nd .nd-hero-ad__body { padding: 14px 16px 42px; }
  body.nd .nd-hero-ad__title { font-size: 19px; }
  body.nd .nd-hero-ads__dots { left: 16px; bottom: 14px; }
}

/* --- Select2 (vyber znacky/modelu/motorizacie, aj inde v nd) --- */
body.nd .select2-container--default .select2-selection--single { border-color: var(--nd-line); border-radius: var(--nd-r); }
body.nd .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--nd-ink); }
body.nd .select2-container--default.select2-container--focus .select2-selection--single,
body.nd .select2-container--default.select2-container--open .select2-selection--single { border-color: var(--nd-accent); }
body.nd .select2-container--default .select2-selection--single .select2-selection__arrow b { border-top-color: var(--nd-muted); }
body.nd .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-bottom-color: var(--nd-muted); }
body.nd .select2-dropdown { border-color: var(--nd-accent); box-shadow: var(--nd-shadow); }
body.nd .select2-container--open .select2-dropdown--below { border-radius: 0 0 var(--nd-r) var(--nd-r); }
body.nd .select2-container--open .select2-dropdown--above { border-radius: var(--nd-r) var(--nd-r) 0 0; }
body.nd .select2-container--default .select2-search--dropdown .select2-search__field {
  border-color: var(--nd-line); border-radius: var(--nd-r-sm); font-size: var(--nd-fs-15); outline: 0;
}
body.nd .select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: var(--nd-accent); }
body.nd .select2-container--default .select2-results__option[aria-selected=true] { background-color: var(--nd-surface-3); color: var(--nd-ink); }
body.nd .select2-container--default .select2-results__option--highlighted[aria-selected],
body.nd .select2-container--default .select2-results__option--highlighted { background-color: var(--nd-accent-soft); color: var(--nd-ink); }
/* nadpis skupiny v zozname („--- Popularne znacky ---“) */
body.nd .select2-container--default .select2-results__option[aria-disabled=true] {
  border-color: var(--nd-line); background: var(--nd-surface-2); font-size: var(--nd-fs-12-5); letter-spacing: 0; text-transform: none; color: var(--nd-muted);
}

/* --- Oblubene: dlazdice kategorii (obsah stranky, page.description_short) --- */
/* .container v obsahu ma pevnu sirku Bootstrapu (1170/970/750) v uzsom rodicovi: vytrca o 30 px a odsadzuje o 15 px;
   !important: style.css ma .container { width: 1170px !important } (od 992 px 970px !important) */
body.nd .shortdesc > .container:has(> .home-popular) { width: auto !important; margin: 0; padding: 0; }
body.nd .home-popular .popular-category h3, body.nd .home-popular .popular-category h3 a {
  font-family: var(--nd-font-display); font-size: 18px; font-weight: 700; line-height: 1.1; letter-spacing: -0.01em; text-transform: none;
}
body.nd .home-popular .popular-category p { font-size: var(--nd-fs-15); line-height: 1.25; color: var(--nd-ink-2); }   /* 1.4 bolo pririedke (Stefan 12.10.2026) */

/* tlacidlo „Vsetky autodiely“ a veta pod nim */
body.nd .shortdesc .slider-button a.btn { padding: 12px 26px; border-radius: var(--nd-r); font-size: 16px; font-weight: 700; letter-spacing: 0; text-transform: none; }
body.nd .shortdesc .slider-button + .slider-button { font-size: var(--nd-fs-15); color: var(--nd-muted); }
/* SEO text titulky je v editore cely v <small>; stare CSS mu dava 14 px a prvemu odseku (nadpis) 16 px */
body.nd .shortdesc ~ .features.version2 ~ p small { font-size: inherit; }
body.nd .shortdesc ~ .features.version2 + p small { font-size: 16px; }

/* --- tri dlazdice vyhod (.features.version2, aj 2 bratislavske landingy) --- */
body.nd .features.version2 .box, body.nd .features.version2 .box:hover {
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); box-shadow: none;
}
body.nd .features.version2 .box i { color: var(--nd-on-accent); }
body.nd .mainContainer .features.version2 .tile_title {
  font-family: var(--nd-font-display); font-size: 20px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
/* !important: comco.css prebija inline #777 cez #555 !important */
body.nd .features.version2 .box > span { font-size: var(--nd-fs-15); color: var(--nd-muted) !important; }

@media (max-width: 767px) {
  body.nd .mainContainer h1.hp-h1 { font-size: 24px; }
  /* Oblubene: 2 stlpce namiesto 18 dlazdic pod sebou; mriezka, aby riadok mal vysku najvyssej dlazdice */
  body.nd .home-popular { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; }
  body.nd .home-popular::before, body.nd .home-popular::after { display: none; }
  body.nd .home-popular > [class*="col-"] { width: auto; padding: 0; float: none; }
  body.nd .home-popular .popular-category { height: 100%; margin: 0; padding: 0 8px 10px; }
  body.nd .home-popular .popular-category img { max-width: 100%; height: auto; }
  body.nd .home-popular .popular-category p { margin-top: 8px; }
  body.nd .mainContainer .features.version2 .tile_title { font-size: 18px; }
}

/* ==== Okno "Pridane do kosika" (.ad-cs-modal, core/include/crosssell.php; styl v comco.css) - facelift ====
   Len CSS. Zaoblene okno, tlacidla bez verzaliek, ceny v ink ako na kartach (nie zelene), sekcia bez zltej ciary.
   Stepper a pridanie ostavaju (ajaxbasket.js, .ad-cs-add / .ad-cs-done). */
body.nd .ad-cs-overlay { background: rgba(20, 22, 26, .55); }
body.nd .ad-cs-modal { border-top: 0; border-radius: var(--nd-r-lg); overflow: hidden; box-shadow: var(--nd-shadow-lg); font-size: var(--nd-fs-14-5); }
body.nd .ad-cs-modal .ad-cs-head { background: var(--nd-dark); font-family: var(--nd-font-display); font-size: 18px; font-weight: 700; letter-spacing: 0; }
body.nd .ad-cs-modal .ad-cs-body { padding: 16px; }
body.nd .ad-cs-modal .ad-cs-added { border-bottom-color: var(--nd-line-2); }
body.nd .ad-cs-modal :is(.ad-cs-added-img, .ad-cs-item-img) img { border-color: var(--nd-line); border-radius: var(--nd-r-sm); }
body.nd .ad-cs-modal .ad-cs-added-name { font-weight: 600; color: var(--nd-ink); }
body.nd .ad-cs-modal :is(.ad-cs-added-meta, .ad-cs-item-price) b { color: var(--nd-ink); }
body.nd .ad-cs-modal .ad-cs-added-qty { color: var(--nd-ink); }
body.nd .ad-cs-modal :is(.ad-cs-added-lbl, .ad-cs-item-lbl) { font-size: var(--nd-fs-12); color: var(--nd-muted); }
/* tlacidla: Prejst do kosika ako primarne v nd, Pokracovat ako obrysove */
body.nd .ad-cs-modal .ad-cs-basket {
  display: flex; align-items: center; justify-content: center; border-radius: var(--nd-r); font-size: 16px; font-weight: 700;
  letter-spacing: 0; text-transform: none; color: var(--nd-on-accent) !important; /* comco.css: color #000 !important */
}
body.nd .ad-cs-modal .ad-cs-basket:hover { background: var(--nd-accent-deep); }
body.nd .ad-cs-modal .ad-cs-continue { border-color: var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface); font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink-2); }
body.nd .ad-cs-modal .ad-cs-continue:hover { background: var(--nd-surface-2); }
/* suvisiaci tovar */
body.nd .ad-cs-modal .ad-cs-sec {
  margin: 24px 0 4px; padding-bottom: 8px; border-bottom: 1px solid var(--nd-line); font-family: var(--nd-font-display);
  font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd .ad-cs-modal .ad-cs-item { padding: 10px 0; border-bottom-color: var(--nd-line-2); }
body.nd .ad-cs-modal .ad-cs-item:last-child { border-bottom: 0; }
body.nd .ad-cs-modal .ad-cs-item-name { font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink) !important; } /* comco.css: #222 !important */
body.nd .ad-cs-modal .ad-cs-item-cat { font-size: var(--nd-fs-12-5); color: var(--nd-muted) !important; } /* comco.css: #777 !important */
body.nd .ad-cs-modal .ad-cs-item-cat:hover { color: var(--nd-ink) !important; }
body.nd .ad-cs-modal .ad-qty-stepper { height: 40px; border-color: var(--nd-line); border-radius: var(--nd-r); }
body.nd .ad-cs-modal .ad-qty-stepper .ad-qty-btn { color: var(--nd-ink-2); }
body.nd .ad-cs-modal .ad-qty-stepper input.ad-cart-qty { height: 100%; padding: 0; font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }
body.nd .ad-cs-modal .ad-cs-ks { font-size: var(--nd-fs-13-5); color: var(--nd-muted); }
body.nd .ad-cs-modal .ad-cs-add { border-radius: var(--nd-r); color: var(--nd-on-accent); }
body.nd .ad-cs-modal .ad-cs-add:hover { border-color: var(--nd-accent-deep); background: var(--nd-accent-deep); }
body.nd .ad-cs-modal .ad-cs-add.ad-cs-done { border-color: var(--nd-ok-soft); background: var(--nd-ok-soft); color: var(--nd-ok); }
@media (max-width: 767px) {
  body.nd .ad-cs-modal { font-size: var(--nd-fs-14-5); }
  body.nd .ad-cs-modal .ad-cs-head { font-size: 17px; }
  body.nd .ad-cs-modal .ad-cs-body { padding: 14px; }
}

/* ==== Cookies, nasepkavac, zdielanie, sledovanie objednavky - facelift ==== */

/* ---- Cookie lista a nastavenia (orestbida cookieconsent v2: core/vendor/cookieconsent, konfiguracia
   template/default/layout_head.php; povodne upravy v comco-templates.css cookie lista).
   #cc--main je v body, takze premenne --cc-* staci prestavit na body.nd (kniznica ich ma na :root,
   comco-templates.css tam drzi prepinace s !important - na body.nd ich to neprebije, dedi sa z blizsieho predka).
   Predvolene zapnutie kategorii a spravanie sa nemeni - len farby, pismo, rohy. */
body.nd {
  --cc-text: var(--nd-ink);
  --cc-btn-primary-bg: var(--nd-accent);
  --cc-btn-primary-text: var(--nd-on-accent);
  --cc-btn-primary-hover-bg: var(--nd-accent-deep);
  --cc-btn-secondary-bg: var(--nd-surface);
  --cc-btn-secondary-text: var(--nd-ink-2);
  --cc-btn-secondary-hover-bg: var(--nd-surface-2);
  --cc-toggle-bg-on: var(--nd-ok);
  --cc-toggle-bg-off: var(--nd-muted-2);
  --cc-cookie-category-block-bg: var(--nd-surface-2);
  --cc-cookie-category-block-bg-hover: var(--nd-surface-3);
  --cc-section-border: var(--nd-line-2);
  --cc-overlay-bg: rgba(20, 22, 26, .55);
}
/* pismo: .cc_div (vnutri #cc--main) ma vlastny systemovy font, #cm a ostatne ho dedia */
body.nd #cc--main .cc_div { font-family: var(--nd-font-body); }
body.nd #cc--main #cm { box-shadow: var(--nd-shadow-lg); }
body.nd #cc--main :is(#c-ttl, #s-ttl) { font-family: var(--nd-font-display); font-size: 20px; font-weight: 700; color: var(--nd-ink); }
body.nd #cc--main #c-txt { font-size: var(--nd-fs-14-5); line-height: 1.5; color: var(--nd-ink-2); }
/* odkazy v texte: kniznica im dava farbu tlacidla (--cc-btn-primary-bg), zlta na bielom by bola necitatelna */
body.nd #cc--main .cc-link { color: var(--nd-ink); border-bottom-color: var(--nd-accent); }
body.nd #cc--main .cc-link:hover { color: var(--nd-accent-ink); }
/* tlacidla: velkost a farby drzi comco-templates.css s !important, preto !important aj tu */
body.nd #cc--main :is(#c-p-bn, #c-s-bn, #s-all-bn, #s-sv-bn) {
  border-radius: var(--nd-r); font-size: 16px !important; font-weight: 700; line-height: 1.2;
}
body.nd #cc--main :is(#c-p-bn, #s-all-bn) { border: 1px solid transparent; background: var(--nd-accent); color: var(--nd-on-accent); }
/* hover: kniznica ma natvrdo tmavomodru #1d2e38 (#c-bns button:first-child:hover) */
body.nd #cc--main :is(#c-p-bn, #s-all-bn):is(:hover, :focus-visible) { background: var(--nd-accent-deep); color: var(--nd-on-accent); }
body.nd #cc--main :is(#c-s-bn, #s-sv-bn) {
  background: var(--nd-surface) !important; color: var(--nd-ink-2) !important; border: 1px solid var(--nd-line) !important;  /* comco-templates.css: #fff/#555/#b0b0b0 !important */
}
body.nd #cc--main :is(#c-s-bn, #s-sv-bn):is(:hover, :focus-visible) { background: var(--nd-surface-2) !important; color: var(--nd-ink) !important; }
/* okno nastaveni */
body.nd #cc--main #s-inr { border-radius: var(--nd-r-lg); box-shadow: var(--nd-shadow-lg); overflow: hidden; }
/* do 688 px je okno nastaveni cez celu obrazovku (zlom kniznice, nie nd) - bez zaoblenia */
@media (max-width: 688px) {
  body.nd #cc--main #s-inr { border-radius: 0; }
}
body.nd #cc--main #s-hdr { border-bottom-color: var(--nd-line-2); }
body.nd #cc--main #s-c-bn { border-radius: var(--nd-r); background: var(--nd-surface-2); }
body.nd #cc--main #s-c-bn:hover { background: var(--nd-surface-3); }
body.nd #cc--main #s-bl :is(.p, .desc) { font-size: var(--nd-fs-14-5); line-height: 1.5; color: var(--nd-ink-2); }
body.nd #cc--main #s-bl .c-bl { border-radius: var(--nd-r); }
body.nd #cc--main #s-bl .title .b-tl { font-family: var(--nd-font-display); font-size: 17px; font-weight: 700; color: var(--nd-ink); }
/* rozbalovacie kategorie (button.b-tl v .b-bn) */
body.nd #cc--main #s-cnt .b-bn .b-tl { border-radius: var(--nd-r); font-family: var(--nd-font-body); font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }

/* ---- Nasepkavac vyhladavania (#search-suggest v template/nd/header.php, JS template/default/blocks/search_suggest_js.php,
   povodny styl comco-templates.css nasepkavac vyhladavania). Mobilne vyhladavanie na celu obrazovku
   (html.search-modal-open) uz ma styl nd - pravidla okna su preto len pre otvoreny zoznam mimo modalu
   (body.nd:not(.search-modal-open *)); obsah poloziek (cena, sklad) plati v oboch. */

/* obsah polozky - desktop aj mobilny modal */
body.nd #search-suggest .search-suggest__price-vat { color: var(--nd-ink); }
body.nd #search-suggest .search-suggest__price-novat { color: var(--nd-muted); }
/* B2B: hlavna je cena bez DPH (poradie prehadzuje comco-templates.css), farba ostava ink */
body.nd.b2b-customer #search-suggest .search-suggest__price-novat { color: var(--nd-ink); }
body.nd.b2b-customer #search-suggest .search-suggest__price-vat { color: var(--nd-muted); }
body.nd #search-suggest .search-suggest__sold-out { color: var(--nd-danger); }
body.nd #search-suggest .search-suggest__brand .label { border-radius: var(--nd-r-sm); }
/* sklad bol trikrat: stitok Skladom ihned (labels_html, tabulka label - poznat ho len podla farby #21a05a),
   zelena visacka a riadok pobociek. Ostava jedna pill + pobocky/lehota odoslania vedla nej.
   Stitok sa skryva len vizualne (v DOM ostava); ine stitky (Akcia, Overena kvalita...) ostavaju. */
body.nd #search-suggest .search-suggest__brand .label[style*="21a05a" i] { display: none; }
body.nd #search-suggest .search-suggest__availability { margin-top: 5px; }
body.nd #search-suggest .search-suggest__availability .ad-delivery-box {
  display: flex; flex-wrap: wrap; align-items: center; gap: 3px 8px; margin: 0; text-align: left;
}
/* velkost a hrubku pisma v dostupnosti drzi comco-templates.css s !important */
body.nd #search-suggest .search-suggest__availability .ad-delivery-box .ad-de-badge {
  display: inline-flex; align-items: center; gap: 4px; margin: 0; padding: 2px 8px; border: 0;
  border-radius: var(--nd-r-pill); background: var(--nd-ok-soft); color: var(--nd-ok);
  font-size: var(--nd-fs-12) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
body.nd #search-suggest .search-suggest__availability .ad-delivery-box .ad-de-check { margin: 0; font-weight: 600 !important; }
body.nd #search-suggest .search-suggest__availability .ad-delivery-box :is(.ad-de-stock, .ad-de-24h) {
  color: var(--nd-muted); font-size: var(--nd-fs-12) !important; line-height: 1.3 !important;
}
body.nd #search-suggest .search-suggest__availability .ad-delivery-box .ad-de-stock b { color: var(--nd-ink-2); font-size: inherit !important; }
body.nd #search-suggest .search-suggest__availability .search-suggest__av-info { color: var(--nd-info); }

/* okno zoznamu na desktope: JS (positionDropdown) ho dava position:fixed s inline top/left/width podla
   inputu - v nd je input len cast pola (vlavo su prepinace Diel/VIN/OE), zoznam bol uzky (432 px pri 1440).
   Tu sa ukotvi na cely #searchBox (position:relative v nd.css, ziadny overflow ani transform po #nd-header),
   preto !important proti inline stylu. Rolovanie, klavesnica a zatvaranie ostavaju v JS. */
@media (min-width: 768px) {
  body.nd:not(.search-modal-open *) #search-suggest {
    position: absolute !important; top: calc(100% + 6px) !important; left: 0 !important; right: auto !important;
    width: 100% !important; min-width: 560px; max-width: calc(100vw - 32px);
    border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
    box-shadow: var(--nd-shadow-lg); font-family: var(--nd-font-body);
    scroll-padding-bottom: 52px;   /* sipkami vybrana polozka nezajde pod prilepene Zobrazit vsetky */
  }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__item { gap: 12px; padding: 10px 14px; border-bottom-color: var(--nd-line-2); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__item:is(:hover, .is-active) { background: var(--nd-surface-2); box-shadow: inset 3px 0 0 var(--nd-accent); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__img { flex-basis: 52px; width: 52px; height: 52px; border-color: var(--nd-line-2); border-radius: var(--nd-r-sm); background: #fff; }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__name { font-size: var(--nd-fs-14); line-height: 1.3; color: var(--nd-ink); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__brand { margin-top: 3px; font-size: var(--nd-fs-11-5); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--nd-muted); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__brand .label { padding: 1px 6px; font-size: var(--nd-fs-10-5); letter-spacing: .03em; }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__price { gap: 2px; padding-left: 6px; }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__price-vat { font-size: var(--nd-fs-15); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__price-novat { font-size: var(--nd-fs-12); }
  body.nd.b2b-customer:not(.search-modal-open *) #search-suggest .search-suggest__price-novat { font-size: var(--nd-fs-15); }
  body.nd.b2b-customer:not(.search-modal-open *) #search-suggest .search-suggest__price-vat { font-size: var(--nd-fs-12); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__sold-out { font-size: var(--nd-fs-13); }
  /* kategorie/stranky nad produktmi: kapsuly */
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__pages { gap: 6px; padding: 10px 14px; border-bottom-color: var(--nd-line-2); background: var(--nd-surface-2); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__page {
    gap: 6px; padding: 4px 11px; border-color: var(--nd-line); border-radius: var(--nd-r-pill);
    background: var(--nd-surface); font-size: var(--nd-fs-13); color: var(--nd-ink-2);
  }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__page:is(:hover, .is-active) { border-color: var(--nd-accent); background: var(--nd-accent-soft); color: var(--nd-ink); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__page .fa { color: var(--nd-muted-2); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__section-title { padding: 7px 14px; border-color: var(--nd-line-2); background: var(--nd-surface-2); font-size: var(--nd-fs-11); color: var(--nd-muted); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__loosened-note { padding: 8px 14px; border-bottom-color: var(--nd-line-2); background: var(--nd-accent-soft); font-size: var(--nd-fs-13); color: var(--nd-ink-2); }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__empty { padding: 16px 14px; font-size: var(--nd-fs-14); color: var(--nd-muted); }
  /* Zobrazit vsetky vysledky: zlty pas pri spodku ako tlacidlo na mobile (comco-templates.css: modry text, vsetko s !important) */
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__more {
    padding: 12px 14px; border-top: 0; background: var(--nd-accent) !important; color: var(--nd-on-accent) !important;
    font-size: var(--nd-fs-14-5) !important; font-weight: 700 !important;
  }
  body.nd:not(.search-modal-open *) #search-suggest .search-suggest__more:is(:hover, :focus, :active) { background: var(--nd-accent-deep) !important; color: var(--nd-on-accent) !important; text-decoration: none !important; }
}
/* 768-991 px: pole ma len 387 px a zacina pri 221-333 px - zoznam so 560 px by vybehol z okna vpravo,
   preto sa ukotvi na pravy okraj pola (tlacidlo Hladat) a rastie dolava */
@media (min-width: 768px) and (max-width: 991px) {
  body.nd:not(.search-modal-open *) #search-suggest { left: auto !important; right: 0 !important; }
}

/* ---- Zdielanie (#sbi -> #sbb, template/system/share_buttons.php; povodny styl comco-templates.css share_buttons).
   Polohu pocita JS z $(#sbb).width() - vodorovny padding/sirka sa nemenia, inak by panel ujiel od ikony. */
body.nd #sbb {
  padding: 6px 0; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
  box-shadow: var(--nd-shadow); overflow: hidden;
}
body.nd #sbb .sbb_b { display: flex; align-items: center; padding: 8px 12px 8px 4px; color: var(--nd-ink-2); }
body.nd #sbb .sbb_b:hover { background: var(--nd-surface-2); color: var(--nd-ink); }
body.nd #sbb .sbb_b span { font-size: var(--nd-fs-14-5) !important; }   /* comco-templates.css: 16px !important */
body.nd #sbb .sbb_b .icon { flex: 0 0 40px; color: var(--nd-ink); }
body.nd #sbb .sbb_b .name { font-weight: 500; }
body.nd #sbbi { padding: 8px 0; border-radius: var(--nd-r); background: var(--nd-dark); font-size: var(--nd-fs-14); }

/* ---- Sledovanie objednavky (/sledovanie-objednavky, template/default/order_track.php): polia a tlacidlo
   ako pri prihlaseni na /customer/login (.logIn .panel), povodne 34 px vysoke polia Bootstrapu */
body.nd .order-track .panel { border-color: var(--nd-line); border-radius: var(--nd-r-lg); box-shadow: none; }
body.nd .order-track .panel .panel-body { padding: 22px 24px; }
body.nd .order-track .form-group { margin-bottom: 18px; }
body.nd .order-track .form-group label { margin-bottom: 6px; font-family: var(--nd-font-body); font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink-2); }
body.nd .order-track .form-group .form-control { height: 50px; padding: 6px 14px; border: 1px solid var(--nd-line); border-radius: var(--nd-r); background-color: var(--nd-surface); color: var(--nd-ink); }
body.nd .order-track .form-group .form-control::placeholder { color: var(--nd-muted-2); }
body.nd .order-track .btn-primary { height: 50px; margin-top: 4px; border-radius: var(--nd-r); font-size: var(--nd-fs-15); font-weight: 700; text-transform: none; }
body.nd .order-track .btn-primary:hover { background-color: var(--nd-accent-deep); }
@media (max-width: 767px) {
  body.nd .order-track .panel .panel-body { padding: 16px; }
}

/* ==== Okna bPopup (dorucenie, Strazny pes, otazka, newsletter) - facelift ====
   Len CSS, vzor je okno Pridane do kosika (.ad-cs-modal) vyssie. bPopup (template/default/jquery.bpopup.min.js) okno
   presunie do body, da mu position:fixed a stred pocita z outerWidth(true) este SKRYTEHO prvku - sirka preto nesmie
   zavisiet od rodica (percenta), inak okno sadne mimo stredu. Overlay .b-modal ma farbu a opacity inline (bPopup), ostava.
   Okna: Dostupnost a dorucenie (.ad-delivery-modal, JS adDmHtml() v core/include/helpers.php, styl comco-templates.css),
   Strazny pes (#watchdog-form, autodiely/watchdog_form.php), newsletter (#newsletter-form, blocks/footer_tail.php),
   upozornenie na zmenu kosika (#basket-info-modal, footer_tail.php, otvaranie je zakomentovane), VIN (#vinbox-form),
   Mate otazku k produktu (#ad-question-form, autodiely/show_question_form.php). Styl formularov je v comco.css. */

/* --- Dostupnost a dorucenie --- */
body.nd .ad-delivery-modal {
  border-top: 0; border-radius: var(--nd-r-lg); overflow: hidden auto; box-shadow: var(--nd-shadow-lg);
  max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); /* vysoke okno na nizkom mobile sa da posunut */
  font-size: var(--nd-fs-14-5); color: var(--nd-ink-2);
}
body.nd .ad-delivery-modal .ad-dm-head {
  padding: 14px 52px 14px 16px; background: var(--nd-dark); font-family: var(--nd-font-display); font-size: 18px; font-weight: 700;
  letter-spacing: 0; line-height: 1.25;
}
body.nd .ad-delivery-modal .ad-dm-head-ic { color: var(--nd-accent); }
body.nd .ad-delivery-modal .ad-delivery-modal-x { display: flex; align-items: center; justify-content: center; width: 50px; line-height: 1; }
body.nd .ad-delivery-modal .ad-dm-body { padding: 16px; }
body.nd .ad-delivery-modal .ad-dm-prod { border-bottom-color: var(--nd-line-2); }
body.nd .ad-delivery-modal .ad-dm-prod-img img { border-color: var(--nd-line); border-radius: var(--nd-r-sm); }
body.nd .ad-delivery-modal .ad-dm-prod-name { font-weight: 600; color: var(--nd-ink); }
body.nd .ad-delivery-modal .ad-dm-prod-sub { font-family: var(--nd-font-mono); font-size: var(--nd-fs-12); color: var(--nd-muted); }
/* uzavierka: ako box urgentnosti na detaile (ziadny ram, lavy pruh) */
body.nd .ad-delivery-modal .ad-dm-alert {
  padding: 10px 12px; border: 0; border-left: 3px solid var(--nd-accent-deep); border-radius: 0 var(--nd-r) var(--nd-r) 0;
  background: var(--nd-accent-soft);
}
body.nd .ad-delivery-modal .ad-dm-alert-ic { color: var(--nd-accent-ink); }
body.nd .ad-delivery-modal .ad-dm-alert-t { font-weight: 600; color: var(--nd-ink); }
body.nd .ad-delivery-modal .ad-dm-alert-s { font-size: var(--nd-fs-12-5); color: var(--nd-on-accent); } /* --nd-accent-ink na jemne zltej ma len 4,4:1 */
body.nd .ad-delivery-modal .ad-dm-alert-s b { color: var(--nd-ink); }
body.nd .ad-delivery-modal .ad-dm-alert-passed { border-left-color: var(--nd-muted-2); background: var(--nd-surface-2); }
body.nd .ad-delivery-modal .ad-dm-alert-passed .ad-dm-alert-s { color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-dm-row { border-bottom-color: var(--nd-line-2); }
body.nd .ad-delivery-modal .ad-dm-row-ic { color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-dm-row-t { font-weight: 600; color: var(--nd-ink); }
body.nd .ad-delivery-modal .ad-dm-row-s { font-size: var(--nd-fs-12-5); color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-dm-instock { font-weight: 600; color: var(--nd-ok); }
body.nd .ad-delivery-modal .ad-dm-row-when b { font-weight: 700; color: var(--nd-ok); } /* nd.css tokeny: #1a7a1a */
body.nd .ad-delivery-modal .ad-dm-row-when small { font-size: var(--nd-fs-12); color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-dm-sec {
  margin: 16px 0 0; font-family: var(--nd-font-display); font-size: var(--nd-fs-15); font-weight: 700; letter-spacing: 0;
  text-transform: none; color: var(--nd-ink);
}
body.nd .ad-delivery-modal .ad-dm-note { font-size: var(--nd-fs-12-5); color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-dm-i { border-radius: 50%; background: var(--nd-surface-3); color: var(--nd-muted); }
/* paticka: cena v ink, stepper 40 px, Kupit bez verzaliek */
body.nd .ad-delivery-modal .ad-dm-foot { border-top-color: var(--nd-line); }
body.nd .ad-delivery-modal .ad-dm-price-val { color: var(--nd-ink); }
body.nd .ad-delivery-modal .ad-dm-price-lbl { font-size: var(--nd-fs-12); color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-qty-stepper { height: 40px; margin-right: 0; border-color: var(--nd-line); border-radius: var(--nd-r); }
body.nd .ad-delivery-modal .ad-qty-stepper .ad-qty-btn { width: 32px; color: var(--nd-ink-2); }
body.nd .ad-delivery-modal .ad-qty-stepper :is(.ad-qty-minus, .ad-qty-plus) { border-color: var(--nd-line-2); }
body.nd .ad-delivery-modal .ad-qty-stepper input.ad-dm-qty { width: 40px; height: 100%; padding: 0; font-size: var(--nd-fs-15); font-weight: 600; color: var(--nd-ink); }
body.nd .ad-delivery-modal .ad-dm-ks { font-size: var(--nd-fs-14-5); color: var(--nd-muted); }
body.nd .ad-delivery-modal .ad-dm-addcart {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 14px; border-color: var(--nd-accent);
  border-radius: var(--nd-r); font-size: var(--nd-fs-15); font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--nd-on-accent);
}
body.nd .ad-delivery-modal .ad-dm-addcart:hover { border-color: var(--nd-accent-deep); background: var(--nd-accent-deep); }
body.nd .ad-delivery-modal .ad-dm-addcart i { font-size: 18px; }

/* --- Formularove okna: Strazny pes, newsletter, zmena kosika, VIN, otazka k produktu --- */
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form, #ad-question-form) {
  padding: 20px; border: 0; border-radius: var(--nd-r-lg); box-shadow: var(--nd-shadow-lg); background: var(--nd-surface);
  max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); overflow-y: auto;
  font-size: var(--nd-fs-14-5); line-height: 1.45; color: var(--nd-ink-2);
}
/* sirka bez percent (bPopup meria skryty prvok); vyska podla obsahu (comco.css: pevnych 370/390/360 px) */
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal) { width: min(400px, calc(100vw - 32px)); max-width: none; height: auto; }
/* vysku nastavuje vin_ajax.php a vin_comco_car_form_js.php inline podla obsahu + 100/250 px pocitanych pre stare pismo -
   v nd je text vacsi a okno malo zvisly posuvnik; vyska podla obsahu (!important proti inline stylu), vysoke okno
   (vyber z viac vozidiel) ostava obmedzene max-height a posuva sa (08.10.2026) */
body.nd #vinbox-form { width: min(500px, calc(100vw - 32px)); max-width: none; height: auto !important; }
/* otazka: comco.css width 100% + max-width 600px -> skryty prvok mal sirku rodica a okno bolo mimo stredu;
   comco-templates.css height 800px + max-height 570px -> obsah pretekal */
body.nd #ad-question-form { width: min(600px, calc(100vw - 32px)); max-width: none; height: auto; }
/* <br> medzi blokmi nahradzaju okraje */
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal) > br,
body.nd :is(#watchdog-form-id, #newsletter-form-id, #ad-question-form-id) > br,
body.nd :is(#watchdog-form, #newsletter-form, #ad-question-form) .row br { display: none; }
/* krizik: sivy stvorcek s x -> ikonove tlacidlo ako .ad-cs-x (pismeno x skryte, znak cez ::before) */
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form, #ad-question-form) > :is(.watchdog-form-x, .newsletter-form-x, .vinbox-form-x, .ad-question-form-x) {
  position: absolute; top: 12px; right: 12px; left: auto; z-index: 1; float: none; display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border: 0; border-radius: var(--nd-r); background: transparent; color: var(--nd-muted); font-size: 0; /* skryje pismeno x */ line-height: 1;
  transition: background-color .15s, color .15s;
}
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form, #ad-question-form) > :is(.watchdog-form-x, .newsletter-form-x, .vinbox-form-x, .ad-question-form-x)::before {
  content: "\00D7"; font-size: 26px; font-weight: 400; line-height: 1;
}
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form, #ad-question-form) > :is(.watchdog-form-x, .newsletter-form-x, .vinbox-form-x, .ad-question-form-x):hover {
  background: var(--nd-surface-2); color: var(--nd-ink);
}
/* titulok */
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form) h4,
body.nd #ad-question-form .ad-question-product {
  margin: 0 36px 12px 0; padding: 0; border: 0; font-family: var(--nd-font-display); font-size: 20px; font-weight: 700; line-height: 1.2;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd :is(#watchdog-form, #basket-info-modal) .watchdog-title { margin: 0 0 8px; font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.35; color: var(--nd-ink); }
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #ad-question-form) p { margin: 0 0 14px; font-size: inherit; line-height: 1.45; }
/* e-mail: stitok nad polom, pole biele 44 px (comco.css: stitok vlavo 100 px, pole sive 265 px) */
body.nd :is(#watchdog-form, #newsletter-form) .row { margin: 0; }
body.nd :is(#watchdog-form, #newsletter-form) .row > [class*="col-"] { float: none; width: auto; padding: 0; }
body.nd :is(#watchdog-form, #newsletter-form) label:not(.watchdog-checkbox-label, .newsletter-checkbox-label) {
  display: block; width: auto; margin: 0 0 6px; position: static; text-align: left; font-size: var(--nd-fs-13-5); font-weight: 600; color: var(--nd-ink);
}
body.nd :is(#watchdog-form-email, #newsletter-form-email),
body.nd #ad-question-form .form-control {
  width: 100%; height: 44px; margin: 0 0 12px; padding: 0 12px; border: 1px solid var(--nd-line); border-radius: var(--nd-r);
  background: var(--nd-surface); box-shadow: none; font-size: 16px; color: var(--nd-ink);
}
body.nd :is(#watchdog-form-email, #newsletter-form-email):focus,
body.nd #ad-question-form .form-control:focus { border-color: var(--nd-accent-deep); outline: 0; box-shadow: 0 0 0 3px var(--nd-accent-soft); }
body.nd :is(#watchdog-form, #newsletter-form, #ad-question-form) .error { border-color: var(--nd-danger); }
body.nd #ad-question-form .form-control::placeholder { color: var(--nd-muted-2); }
/* suhlas: zaskrtavatko vedla textu (comco.css: !important sirky a posuny) */
body.nd :is(#watchdog-form, #newsletter-form) .row > .col-xs-12 { display: flex; align-items: flex-start; gap: 10px; margin: 2px 0 14px; text-align: left; }
body.nd :is(.watchdog-checkbox, .newsletter-checkbox) {
  flex: 0 0 auto; width: 18px !important; height: 18px; margin: 1px 0 0 !important; /* comco.css: width 20px + margin-left 18px !important */
  position: static; accent-color: var(--nd-ink);
}
body.nd :is(.watchdog-checkbox-label, .newsletter-checkbox-label) {
  width: auto !important; /* comco.css: 300 px, mobil 240 px !important */
  margin: 0; padding: 0; border: 0; font-size: var(--nd-fs-13-5); line-height: 1.4; color: var(--nd-ink-2);
}
body.nd :is(.watchdog-checkbox-label, .newsletter-checkbox-label).error { color: var(--nd-danger); }
body.nd #newsletter-form .g-recaptcha { margin: 0 0 16px; }
/* tlacidla a hlasky */
body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #ad-question-form) .btn-block {
  min-height: 46px; border-radius: var(--nd-r); font-size: 16px; font-weight: 700; letter-spacing: 0; text-transform: none;
}
body.nd :is(#watchdog-form .watchdog-error-text, #newsletter-form .newsletter-error-text, #ad-question-form .ad-question-error-text) {
  margin: 10px 0 0; padding: 8px 12px; border-radius: var(--nd-r); background: var(--nd-danger-soft); color: var(--nd-danger); font-size: var(--nd-fs-14);
}
body.nd :is(#watchdog-form .watchdog-confirm, #newsletter-form .newsletter-confirm, #ad-question-form .ad-question-confirm) {
  margin: 10px 0 0; padding: 8px 12px; border-radius: var(--nd-r); background: var(--nd-ok-soft); color: var(--nd-ok); font-size: var(--nd-fs-14); font-weight: 700;
}
/* otazka k produktu: na desktope stitky vlavo v strede 44 px pola, na mobile (stitky hidden-xs) len Vasa otazka nad polom */
body.nd #ad-question-form-id .row { margin-bottom: 0; }
body.nd #ad-question-form label { margin: 0; line-height: 44px; position: static; left: auto; top: auto; font-weight: 600; color: var(--nd-ink); }
body.nd #ad-question-form .textarea-label { top: auto; } /* comco.css: top 20px - na mobile stitok sadol do pola */
body.nd #ad-question-form textarea.form-control { height: 110px; padding: 10px 12px; margin-bottom: 12px; line-height: 1.4; resize: vertical; }
body.nd #ad-question-form .g-recaptcha { margin: 0 0 16px; }
@media (min-width: 768px) {
  body.nd #ad-question-form .row > .col-sm-8 { width: 75%; } /* pole po pravy okraj tlacidla */
}
@media (max-width: 767px) {
  body.nd .ad-delivery-modal .ad-dm-head { padding-left: 14px; font-size: 17px; }
  body.nd .ad-delivery-modal .ad-dm-body { padding: 14px; }
  body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form, #ad-question-form) { padding: 16px; }
  body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form, #ad-question-form) > :is(.watchdog-form-x, .newsletter-form-x, .vinbox-form-x, .ad-question-form-x) { top: 10px; right: 10px; }
  body.nd :is(#watchdog-form, #newsletter-form, #basket-info-modal, #vinbox-form) h4,
  body.nd #ad-question-form .ad-question-product { font-size: 19px; }
  body.nd #ad-question-form label { line-height: 1.4; margin: 0 0 6px; }
  body.nd #ad-question-form .row:has(.g-recaptcha) > label { display: none; } /* prazdny stitok (&nbsp;) nad reCAPTCHA */
}
/* reCAPTCHA ma pevnych 304 px, na 320 px displeji sa do okna nezmesti -> zmensit */
@media (max-width: 359px) {
  body.nd :is(#newsletter-form, #ad-question-form) .g-recaptcha { transform: scale(.84); transform-origin: 0 0; margin-bottom: 0; }
}

/* ==== Konto zakaznika (/customer, objednavky, garaz, pridanie auta, profil, kupony, kancelaria) - facelift ====
   Len CSS nad customer_account.php a sablonami customer_*. Stranka konta ma v .nd-content (obsah na celu sirku, nd/default_2columns.php)
   najprv section.userProfile (lista zaloziek), za nou obsah sablony - rozpoznanie preto cez .nd-content:has(> .userProfile).
   Lista zaloziek a sekcie prehladu su v .mainContainer: odkazy potrebuju !important proti farbe
   a podciarknutiu z .mainContainer a (style.css). Panely ako prihlasenie a profil: svetlosiva hlavicka. */

/* lista zaloziek: ako zalozky triedenia (biela lista, aktivna tmava) */
body.nd .userProfile > .mainContainer { margin-bottom: 0; }
body.nd .userProfile > .mainContainer > br { display: none; }
body.nd .userProfile .cust-nav-col { padding: 0; }
body.nd .userProfile .cust-nav-col .btn-group {
  display: flex; flex-wrap: wrap; gap: 4px; margin: 16px 0 0; padding: 6px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
}
body.nd .userProfile .cust-nav-col .btn-group > .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; float: none; height: 40px; margin: 0; padding: 0 16px;
  border: 0; border-radius: var(--nd-r); background: transparent; box-shadow: none;
  font-family: var(--nd-font-body); font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1.1; letter-spacing: 0; text-transform: none;
  color: var(--nd-ink-2) !important; text-decoration: none !important; /* .mainContainer a */
  transition: background-color .15s, color .15s;
}
body.nd .userProfile .cust-nav-col .btn-group > .btn i { margin: 0; font-size: var(--nd-fs-14); color: var(--nd-muted); }
body.nd .userProfile .cust-nav-col .btn-group > .btn:hover { background: var(--nd-surface-2); color: var(--nd-ink) !important; } /* .mainContainer a */
body.nd .userProfile .cust-nav-col .btn-group > .btn:focus-visible { box-shadow: inset 0 0 0 2px var(--nd-accent); }
body.nd .userProfile .cust-nav-col .btn-group > .btn.active,
body.nd .userProfile .cust-nav-col .btn-group > .btn.active:hover { background: var(--nd-ink); color: var(--nd-surface) !important; } /* .mainContainer a */
body.nd .userProfile .cust-nav-col .btn-group > .btn.active i { color: var(--nd-accent); }

/* nadpis stranky (h3 sablony priamo v stlpci): na strankach konta niet h1, popis PROFIL z bloku
   Obsahove stranky (male verzalky) tu preto robi nadpis. Za nim nasleduje br - medzeru dava margin. */
body.nd .container.page > .row > .nd-content:has(> .userProfile) > h3,
body.nd .nd-content:has(> .userProfile) .garrage-head h3 {
  margin: 24px 0 16px; font-family: var(--nd-font-display); font-size: clamp(24px, 2.4vw, 30px); font-weight: 700; line-height: 1.15;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
body.nd .nd-content:has(> .userProfile) .garrage-head { margin: 24px 0 16px; }
body.nd .nd-content:has(> .userProfile) .garrage-head h3 { margin: 0; }
body.nd .container.page > .row > .nd-content:has(> .userProfile) > h3 small {
  display: block; margin-top: 4px; font-family: var(--nd-font-body); font-size: var(--nd-fs-14-5); font-weight: 400;
  letter-spacing: 0; text-transform: none; color: var(--nd-muted); overflow-wrap: anywhere;
}
body.nd .nd-content:has(> .userProfile) > :is(h3, .garrage-head) + br,
body.nd .nd-content:has(> .userProfile) > div > .garrage-head + br { display: none; }
/* profil: prvy panel formulara ma margin-top 20 px (blok formularov) - pod nadpisom staci jeho spodny okraj */
body.nd .nd-content:has(> .userProfile) > .mainContainer .cust-form-flush > .row > :first-child > .panel:first-child { margin-top: 0; }
/* uvodny text pod nadpisom (pridanie auta) */
body.nd .nd-content:has(> .userProfile) > h3 + p { margin: -6px 0 18px; font-size: 16px; line-height: 1.5; color: var(--nd-ink-2); }
/* tlacidlo + v garazi: farbu textu drzi comco-templates.css s !important */
body.nd .garrage-add-btn { width: 44px; height: 44px; border-radius: var(--nd-r); font-size: 22px; color: var(--nd-on-accent) !important; }
body.nd .garrage-add-btn:hover { background: var(--nd-accent-deep); }

/* prehlad: sekcie Garaz, Kupony, Objednavky ako panely so svetlosivou hlavickou */
body.nd .nd-content:has(> .userProfile) > .mainContainer:has(> h2.cust-dash-title) {
  margin: 0 0 20px; padding: 0 20px 20px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
}
/* medzery robia okraje panelov - br medzi a v sekciach (za tabulkou kuponov, tri za prazdnym textom) prec */
body.nd .nd-content:has(> .userProfile) > br,
body.nd .nd-content:has(> .userProfile) > .mainContainer:has(> h2.cust-dash-title) > br { display: none; }
/* garaz v prehlade: karty maju vlastny spodny okraj 20 px */
body.nd .nd-content:has(> .userProfile) > .mainContainer:has(> h2.cust-dash-title):has(.garrage_car_box) { padding-bottom: 0; }
body.nd .mainContainer > h2.cust-dash-title {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px;
  margin: 0 -20px 18px; padding: 14px 20px; border-bottom: 1px solid var(--nd-line); border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0;
  background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent);
  font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2; color: var(--nd-ink);
}   /* jemne zlta so zltym pasikom vlavo (Stefan 12.10.2026: ina farba ako jemne siva, aby nadpisy vynikli; z dvoch
       navrhov vybral jemnejsi, tmavy pruh ako aktivna zalozka uctu bol druhy) */
/* odkaz Zobrazit vsetky: zatvorky okolo neho su textove uzly v .title_thin - nulova velkost ich skryje */
body.nd .mainContainer > h2.cust-dash-title .title_thin { font-size: 0; }
body.nd .mainContainer > h2.cust-dash-title .title_thin a.cust-dash-all {
  display: inline-block; font-family: var(--nd-font-body); font-size: var(--nd-fs-14-5); font-weight: 600; text-transform: none;
  color: var(--nd-on-accent) !important; text-decoration: none !important; /* comco-templates.css: underline !important */
  /* tmavy, nie --nd-accent-ink: na jemne zltom nadpise ma len 4,4:1 */
}
body.nd .mainContainer > h2.cust-dash-title .title_thin a.cust-dash-all::first-letter { text-transform: uppercase; }
body.nd .mainContainer > h2.cust-dash-title .title_thin a.cust-dash-all::after {
  content: "\f105"; margin-left: 6px; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: var(--nd-fs-13);
}
body.nd .mainContainer > h2.cust-dash-title .title_thin a.cust-dash-all:hover { text-decoration: underline !important; text-underline-offset: 3px; } /* proti none !important vyssie */
/* nadpisy blokov su jemne zlte so zltym pasikom vlavo vsade (Stefan 12.10.2026: v ucte aj mimo neho) - farba je priamo
   v pravidlach panelov (prihlasenie/registracia/Profil, krok Objednavka, .ordersummary, kosik, zabudnute heslo, pridanie
   auta). Na strankach Objednavky a Kupony je nadpisom bloku hlavicka tabulky - pismo ako ostatne nadpisy blokov uctu
   (19 px, nadpisove pismo). V prehlade ostava hlavicka tabuliek siva a mala - nad nimi je uz zlty nadpis sekcie.
   Vsetky nadpisy blokov uctu (prehlad, Nastavenia, Objednavky, Kupony, detail objednavky, zalozky Kancelarie) maju
   rovnake pismo: nadpisove, 19 px, 700, lh 1.2, zvisle 14 px (Stefan 12.10.2026: boli 17/18/19 px a 600/700). */
body.nd .nd-content:has(> .userProfile) > .customer_dashboard > .table_header { background: var(--nd-accent-soft); }
body.nd .nd-content:has(> .userProfile) > table.table > thead > tr > th:first-child,
body.nd .nd-content:has(> .userProfile) > .customer_dashboard > .table_header { box-shadow: inset 4px 0 0 var(--nd-accent); }
body.nd .nd-content:has(> .userProfile) > table.table > thead > tr > th,
body.nd .nd-content:has(> .userProfile) > .customer_dashboard > .table_header > div {
  padding-top: 14px; padding-bottom: 14px; font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2; color: var(--nd-ink);
}

/* prazdny stav (ziadne objednavky, faktury, kupony): neutralny box namiesto zltej hlasky a holeho odseku.
   Kupony: odsek je jediny p v sekcii prehladu, na stranke Kupony za nim idu tri br (uvod pridania auta ma za sebou div) */
body.nd .nd-content:has(> .userProfile) .alert-warning,
body.nd .nd-content:has(> .userProfile) > .mainContainer:has(> h2.cust-dash-title) > p,
body.nd .nd-content:has(> .userProfile) > h3 ~ p:has(+ br) {
  margin: 0; padding: 16px 18px; border: 1px dashed var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2);
  font-size: 16px; color: var(--nd-muted);
}

/* objednavky (customer_orders.php): tabulka ako table.bordertable */
body.nd .nd-content:has(> .userProfile) > table.table {
  margin-bottom: 20px; border: 1px solid var(--nd-line); border-collapse: separate; border-spacing: 0; border-radius: var(--nd-r-lg); overflow: hidden;
}
body.nd .nd-content:has(> .userProfile) > table.table > * > tr > :is(th, td) {
  padding: 12px 14px; border: 0; border-bottom: 1px solid var(--nd-line-2); vertical-align: middle;
}
body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr:last-child > :is(th, td) { border-bottom: 0; }
body.nd .nd-content:has(> .userProfile) > table.table > thead > tr > th {
  padding-top: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--nd-line); background: var(--nd-accent-soft); font-weight: 700; color: var(--nd-ink);
}   /* jemne zlta ako nadpisy blokov uctu (pasik vlavo vyssie pri h2.cust-dash-title) */
body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > th { font-weight: 700; color: var(--nd-ink); }
body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > td:nth-child(3) { font-weight: 600; white-space: nowrap; }
body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr:hover { background: var(--nd-surface-2); }
/* akcie riadku (Detail, Sledovat zasielku, Faktura, Dobropis) - aj v prehlade a v kancelarii */
body.nd a.orders_a {
  display: inline-flex; align-items: center; gap: 6px; height: 32px; margin: 3px 6px 3px 0; padding: 0 12px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
  font-size: var(--nd-fs-13-5); font-weight: 600; line-height: 1; white-space: nowrap;
  color: var(--nd-ink) !important; text-decoration: none !important; /* .mainContainer a */
}
body.nd a.orders_a:hover { border-color: var(--nd-ink); background: var(--nd-surface); }

/* ==== Kancelaria (customer_office.php, zaklad v comco-templates.css; Stefan 12.10.2026: spojit dokopy, zalozky zlte ako
   nadpisy blokov). Zalozky su zlta hlavicka karty (pasik vlavo ako h2.cust-dash-title), aktivna biela splyva s obsahom.
   Doklady su riadky jedneho zoznamu v karte, nie samostatne krabice; na sirokej obrazovke jeden riadok na doklad so
   stlpcami ako tabulka (.inv-row-* display: contents, miesta podla grid-area). Testovaci zakaznik nie je B2B -
   snimky cez scratchpad officefix.js (markup sablony s vymyslenymi dokladmi). */
body.nd .office-tabs {
  display: flex; gap: 4px; margin: 4px 0 0; padding: 8px 12px 0 16px; overflow-x: auto; scrollbar-width: none;
  border: 1px solid var(--nd-line); border-bottom: 0; border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0;
  background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent), inset 0 -1px 0 var(--nd-line);
}
body.nd .office-tabs::-webkit-scrollbar { display: none; }
body.nd .office-tab-btn {
  flex: 0 0 auto; margin: 0; padding: 11px 18px; border: 1px solid transparent; border-bottom: 0; border-radius: var(--nd-r) var(--nd-r) 0 0;
  background: transparent; font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2; white-space: nowrap; color: var(--nd-ink-2);
  transition: background-color .15s, color .15s;
}
body.nd .office-tab-btn:hover { background: rgba(255, 255, 255, .6); color: var(--nd-ink); }
body.nd .office-tab-btn.active { border-color: var(--nd-line); background: var(--nd-surface); color: var(--nd-ink); box-shadow: inset 0 3px 0 var(--nd-accent); }
body.nd .office-tab-pane { padding: 0; border: 1px solid var(--nd-line); border-top: 0; border-radius: 0 0 var(--nd-r-lg) var(--nd-r-lg); background: var(--nd-surface); }
/* prazdna zalozka: text priamo na bielom tele karty - prazdny stav uctu (.alert-warning, siva prerusovana krabica
   s okruhlymi rohmi) by kartu prekryl */
body.nd .nd-content:has(> .userProfile) .office-tab-pane > .alert-warning {
  margin: 0; padding: 18px 20px; border: 0; border-radius: 0 0 var(--nd-r-lg) var(--nd-r-lg); background: transparent;
}
/* strankovanie: pruh nad a pod zoznamom */
body.nd .office-tab-pane > .inv-pagination { margin: 0; padding: 12px 20px; }
body.nd .office-tab-pane > .inv-pagination:first-child { border-bottom: 1px solid var(--nd-line); }
body.nd .office-tab-pane > .inv-list + .inv-pagination { border-top: 1px solid var(--nd-line); }
body.nd .office-tab-pane .inv-pg-btn { min-width: 34px; height: 34px; border-color: var(--nd-line); border-radius: var(--nd-r); font-size: var(--nd-fs-14); color: var(--nd-ink) !important; }
body.nd .office-tab-pane .inv-pg-btn:hover { border-color: var(--nd-ink); background: var(--nd-surface); }
body.nd .office-tab-pane .inv-pg-btn.active { border-color: var(--nd-dark); background: var(--nd-dark); color: #fff !important; }
body.nd .office-tab-pane .inv-pg-btn.disabled { color: var(--nd-muted-2) !important; }
body.nd .office-tab-pane .inv-pg-info { font-size: var(--nd-fs-14); color: var(--nd-muted); }
/* doklad = riadok zoznamu */
body.nd .office-tab-pane .inv-list { margin: 0; padding: 0; }
body.nd .office-tab-pane .inv-card {
  display: grid; grid-template-columns: 120px 96px 96px 132px minmax(0, 1fr) 336px 72px; align-items: start; gap: 10px 18px;
  grid-template-areas: "num issued due type orders amounts pdf";
  margin: 0; padding: 14px 20px; border: 0; border-bottom: 1px solid var(--nd-line-2); border-radius: 0; background: transparent;
  font-size: var(--nd-fs-15); line-height: 1.35; color: var(--nd-ink-2); transition: background-color .15s;
}
body.nd .office-tab-pane .inv-card:last-child { border-bottom: 0; }
body.nd .office-tab-pane .inv-card:hover, body.nd .office-tab-pane .inv-card.paid:hover { background: var(--nd-surface-2); }
body.nd .office-tab-pane .inv-card.paid { border-color: var(--nd-line-2); background: transparent; }  /* zelene pozadie -> znacka Uhradena */
body.nd .office-tab-pane .inv-card > .inv-row { display: contents; }
body.nd .office-tab-pane .inv-num { grid-area: num; min-width: 0; font-weight: 700; color: var(--nd-ink); }
body.nd .office-tab-pane .inv-row-1 > .inv-dates:nth-child(2) { grid-area: issued; }
body.nd .office-tab-pane .inv-row-1 > .inv-dates:nth-child(3) { grid-area: due; }
body.nd .office-tab-pane .inv-dates { color: var(--nd-ink-2); }
body.nd .office-tab-pane .inv-type {
  grid-area: type; justify-self: start; margin-top: 15px; padding: 3px 10px; border-radius: var(--nd-r-pill);
  font-size: var(--nd-fs-13); font-weight: 600; line-height: 1.2; white-space: nowrap;
}
body.nd .office-tab-pane .inv-type-standard { background: var(--nd-surface-3); color: var(--nd-ink-2); }
body.nd .office-tab-pane .inv-type-summary { background: var(--nd-accent-soft); color: var(--nd-on-accent); } /* --nd-accent-ink tu ma len 4,4:1 */
body.nd .office-tab-pane .inv-orders { grid-area: orders; flex: none; min-width: 0; margin: 0; }
/* sumy s pevnou sirkou - stlpce sedia pod sebou v kazdom riadku (kazdy doklad je vlastna mriezka) */
body.nd .office-tab-pane .inv-amounts { grid-area: amounts; display: flex; justify-content: flex-end; gap: 18px; width: auto; }
body.nd .office-tab-pane .inv-amount-item { flex: 0 0 100px; text-align: right; }
body.nd .office-tab-pane .inv-amount-item > span:last-child { font-weight: 700; color: var(--nd-ink); }
body.nd .office-tab-pane .inv-pdf { grid-area: pdf; align-self: center; justify-self: end; margin: 0; }
/* popis nad hodnotou; povodne .inv-amount-item span robilo tucne aj popis */
body.nd .office-tab-pane .inv-label {
  display: block; margin-bottom: 2px; font-family: var(--nd-font-body); font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.2;
  color: var(--nd-muted); white-space: nowrap;
}
body.nd .office-tab-pane .inv-orders a.inv-order-link { color: var(--nd-ink) !important; text-decoration-color: var(--nd-accent-deep) !important; text-underline-offset: 3px; }
body.nd .office-tab-pane .inv-orders a.inv-order-link:hover { color: var(--nd-accent-ink) !important; }
body.nd .office-tab-pane .inv-paid-mark {
  display: inline-block; padding: 1px 8px; border-radius: var(--nd-r-pill); background: var(--nd-ok-soft); color: var(--nd-ok); font-weight: 700; white-space: nowrap;
}
body.nd .office-tab-pane .inv-unpaid-mark { color: var(--nd-ink); }
body.nd .office-tab-pane .inv-return-date { display: block; font-size: var(--nd-fs-13); font-weight: 500; color: var(--nd-muted); }
/* stredna sirka: dva riadky - hore cislo, datumy, typ a PDF, dole objednavky a sumy */
@media (max-width: 1199px) {
  body.nd .office-tab-pane .inv-card {
    grid-template-columns: 120px 96px 96px minmax(0, 1fr) 72px;
    grid-template-areas: "num issued due type pdf" "orders orders orders amounts amounts";
  }
}
/* mobil: karta pod sebou - cislo a PDF, datumy, typ, objednavky, sumy */
@media (max-width: 767px) {
  /* styri zalozky sa do sirky nezmestia - mriezka 2 x 2, aktivna biela */
  body.nd .office-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 10px 10px 10px 14px; }
  body.nd .office-tab-btn { padding: 9px 8px; border: 1px solid transparent; border-radius: var(--nd-r); white-space: normal; text-align: center; }
  body.nd .office-tab-btn.active { border-color: var(--nd-line); }
  body.nd .office-tab-pane > .inv-pagination { padding: 10px 14px; }
  body.nd .office-tab-pane .inv-card {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 14px; padding: 14px;
    grid-template-areas: "num pdf" "issued due" "type type" "orders orders" "amounts amounts";
  }
  /* dobropisy a dodacie listy typ nemaju - bez prazdneho riadku */
  body.nd .office-tab-pane .inv-card:not(:has(.inv-type)) { grid-template-areas: "num pdf" "issued due" "orders orders" "amounts amounts"; }
  body.nd .office-tab-pane .inv-pdf { align-self: start; }
  body.nd .office-tab-pane .inv-type { margin-top: 0; }
  body.nd .office-tab-pane .inv-amounts { flex-wrap: wrap; justify-content: flex-start; gap: 8px 14px; }
  body.nd .office-tab-pane .inv-amount-item { flex: 0 1 auto; text-align: left; }
}

/* mriezka .customer_dashboard (kupony vsade, posledne objednavky v prehlade): ako tabulka.
   Bootstrap stlpce boli na hodnoty prilis uzke (kupony 2/1/3/2/4: Hodnota mala 1/12 a hlavicka sa prekryvala
   so susedom; objednavky 2/3/2/3/1: akcie padali pod seba) -> od 992 px vlastna mriezka, pod nou karty */
body.nd .customer_dashboard {
  margin: 0 0 4px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); overflow: hidden;
}
body.nd .customer_dashboard > .row { margin: 0; }
body.nd .customer_dashboard > .row > div { padding: 10px 12px; }
body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row { display: grid; align-items: center; }
body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row::before,
body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row::after { display: none; }
body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row > div { width: auto; float: none; }
body.nd .customer_dashboard > .table_header {
  margin: 0; border-bottom: 1px solid var(--nd-line); background: var(--nd-surface-2); font-weight: 600; color: var(--nd-ink);
}
body.nd .customer_dashboard > .row.body { padding: 0; border-bottom: 1px solid var(--nd-line-2); color: var(--nd-ink-2); }
body.nd .customer_dashboard > .row.body:last-child { border-bottom: 0; }
body.nd .customer_dashboard > .row.body:hover { background: var(--nd-surface-2); }
body.nd .customer_dashboard .voucher-muted { color: var(--nd-muted); }
/* odkaz na objednavku: farba z .mainContainer a, podciarknutie z comco-templates.css - oboje s !important */
body.nd .customer_dashboard a.voucher-order-link { color: var(--nd-ink) !important; text-decoration-color: var(--nd-accent-deep) !important; text-underline-offset: 3px; }
/* kod kuponu a tlacidlo kopirovania (obrazok 10 px - vacsia plocha na klik) */
/* kod a obrazok spaja v sablone nbsp - flex ich rozdeli, pri uzkom stlpci ide pod kod obrazok, nie polovica kodu */
body.nd .customer_dashboard > .row.body > div:has(> .voucher-copy-btn) {
  display: flex; flex-wrap: wrap; align-items: center; column-gap: 2px; font-weight: 700; letter-spacing: .02em; color: var(--nd-ink); overflow-wrap: anywhere;
}
body.nd .customer_dashboard .voucher-copy-btn {
  box-sizing: content-box; width: 12px; height: auto; padding: 5px; border-radius: var(--nd-r-sm);
}
body.nd .customer_dashboard .voucher-copy-btn:hover { background: var(--nd-surface-3); }
body.nd .customer_dashboard:has(.orders_a) > .row.body > div:first-child { font-weight: 700; color: var(--nd-ink); }
body.nd .customer_dashboard:has(.orders_a) > .row.body > div:nth-child(3) { font-weight: 600; color: var(--nd-ink); white-space: nowrap; }
@media (min-width: 992px) {
  body.nd .customer_dashboard:has(.voucher-copy-btn) > .row {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr) minmax(0, 1.7fr) minmax(0, 1.1fr) minmax(0, 2fr); align-items: start;
  }
  body.nd .customer_dashboard:has(.orders_a) > .row {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.5fr) minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 2.4fr);
  }
  body.nd .customer_dashboard:has(.orders_a) > .row.body > div:nth-child(5) { padding-top: 7px; padding-bottom: 7px; }
}
@media (max-width: 991px) {
  /* karty: objednavka = cislo + suma, datum + stav, akcie; kupon = kod + hodnota, pod nimi vytvorenie, platnost, pouzitie.
     Hlavicka by nesedela - skryta. Nepouzity kupon ma v stlpci pouzitia len pomlcky - skryte. */
  body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .table_header { display: none; }
  body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row.body {
    grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 12px 14px;
  }
  body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row.body > div { padding: 0; }
  body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row.body > div:nth-child(1) { grid-column: 1; grid-row: 1; }
  body.nd .customer_dashboard:is(:has(.orders_a), :has(.voucher-copy-btn)) > .row.body > div:nth-child(2) { grid-column: 2; grid-row: 1; text-align: right; }
  /* cislo a datum aspon na sirku obsahu, datum s casom na jeden riadok - dlhy stav (Pripravena na osobny odber) inak stlpec
     stlacil pod sirku datumu a datum sa prekryval so stavom (chyba #51, 320 px); stav sa zalomi */
  body.nd .customer_dashboard:has(.orders_a) > .row.body { grid-template-columns: minmax(min-content, 1fr) auto; }
  body.nd .customer_dashboard:has(.orders_a) > .row.body > div:nth-child(2) { grid-column: 1; grid-row: 2; font-size: var(--nd-fs-14); color: var(--nd-muted); text-align: left; white-space: nowrap; }
  body.nd .customer_dashboard:has(.orders_a) > .row.body > div:nth-child(3) { grid-column: 2; grid-row: 1; text-align: right; }
  body.nd .customer_dashboard:has(.orders_a) > .row.body > div:nth-child(4) { grid-column: 2; grid-row: 2; font-size: var(--nd-fs-14); text-align: right; }
  body.nd .customer_dashboard:has(.orders_a) > .row.body > div:nth-child(5) { grid-column: 1 / -1; grid-row: 3; margin-top: 8px; }
  body.nd .customer_dashboard:has(.voucher-copy-btn) > .row.body > div:nth-child(2) { font-weight: 700; color: var(--nd-ink); }
  body.nd .customer_dashboard:has(.voucher-copy-btn) > .row.body > div:nth-child(n+3) { grid-column: 1 / -1; font-size: var(--nd-fs-14); }
  body.nd .customer_dashboard:has(.voucher-copy-btn) > .row.body > div:nth-child(5):not(:has(a)) { display: none; }
  /* popis Platny do je v sablone len pre xs (Bootstrap visible-xs-inline: display none !important) - v karte treba aj na tablete */
  body.nd .customer_dashboard:has(.voucher-copy-btn) > .row.body .visible-xs-inline { display: inline !important; }
}

/* garaz: karty aut biele s ramikom, pridat auto ako prerusovana dlazdica.
   Farbu odkazov v karte drzi comco.css s !important. */
body.nd .garrage_car_box { border-radius: var(--nd-r-lg); }
body.nd .garrage_car_box.normal {
  padding: 10px; border: 1px solid var(--nd-line); background: var(--nd-surface); transition: border-color .15s, box-shadow .15s;
}
body.nd .garrage_car_box.normal:hover { border-color: var(--nd-muted-2); box-shadow: var(--nd-shadow-sm); }
body.nd .garrage_car_box.normal.promo { border-color: var(--nd-ok); }
body.nd .garrage_car_box.normal > a { color: var(--nd-ink) !important; } /* comco.css: #000 !important */
body.nd .garrage_car_box .gc-name { font-family: var(--nd-font-display); font-weight: 700; color: var(--nd-ink); }
body.nd .garrage_car_box :is(.gc-orig, .gc-spec, .added) { color: var(--nd-muted); }
body.nd .garrage_car_box :is(.gc-vin, .gc-uservin-line, .gc-ecv-line) { color: var(--nd-ink-2); }
body.nd .garrage_car_box .title small { overflow-wrap: anywhere; }
body.nd .garrage_car_box :is(.gc-uservin, .gc-ecv) { color: var(--nd-ink); }
body.nd .garrage_car_box :is(.garrage_edit, .garrage_edit_ecv, .garrage_edit_vin) { color: var(--nd-muted-2); }
body.nd .garrage_car_box :is(.garrage_edit_ecv, .garrage_edit_vin).gc-ecv-add,
body.nd .garrage_car_box :is(.garrage_edit_ecv, .garrage_edit_vin).gc-vin-add { color: var(--nd-ok); font-weight: 600; }
body.nd .garrage_car_box.normal .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px;
  border-radius: var(--nd-r); font-size: var(--nd-fs-14-5); font-weight: 600; text-transform: none;
}
body.nd .garrage_car_box.normal .garrage_x { border-radius: var(--nd-r-sm); background-color: var(--nd-danger); color: var(--nd-surface); }
/* x pri hoveri: s vacsim pismom nd mal 23 px a vytrcal z obalu .garrage_x_box (18 px) do odkazu karty -
   ten sa zuzil, nazov sa zalomil a pero/EČV/VIN uskocili spod kurzora; vyska obalu drzi */
body.nd .garrage_car_box.normal .garrage_x { height: 18px; font-size: var(--nd-fs-13); line-height: 18px; }
body.nd .garrage_car_box.add_new {
  border: 1px dashed var(--nd-muted-2); background: var(--nd-surface);   /* biela: stranka ma od 12.10. pozadie --nd-surface-2 */ transition: border-color .15s, background-color .15s;
}
body.nd .garrage_car_box.add_new:hover { border-color: var(--nd-accent-deep); background: var(--nd-accent-soft); }
body.nd .garrage_car_box.add_new a { font-family: var(--nd-font-display); font-size: 20px; font-weight: 600; color: var(--nd-ink-2) !important; } /* comco.css: siva !important */
body.nd .garrage_car_box.add_new a img { margin-bottom: 8px; opacity: .75; }
/* obrazky aut maju vlastne sive pozadie (na sivej karte starych stranok splyvalo) - na bielej karte ako nahlad */
body.nd .garrage_car_box a img { border-radius: var(--nd-r); }
/* obrazky z nd/img su 3x vacsie (nd_garrage_img) - zobrazena velkost ako povodne 303 / 300 px (comco.css max-width 80 %) */
body.nd .garrage_car_box a img { max-width: min(80%, 303px); }
body.nd .garrage_car_box.add_new a img { max-width: min(80%, 300px); }
@media (min-width: 768px) {
  /* desktop: drobne riadky karty mali 12-13 px (na mobile ich comco-templates.css zvacsuje sam) */
  body.nd .garrage_car_box .gc-name { font-size: 17px; line-height: 1.25; }
  body.nd .garrage_car_box .gc-orig { font-size: var(--nd-fs-13); }
  body.nd .garrage_car_box :is(.gc-vin, .gc-spec, .gc-uservin-line, .gc-ecv-line) { font-size: var(--nd-fs-13-5); }
  body.nd .garrage_car_box.normal .added { font-size: var(--nd-fs-12-5); }
}

/* garaz: inline formulare VIN, EČV a premenovanie (customer_garrage_js.php vklada .gc-edit-form; Stefan 12.10.2026:
   krajsie). Pole cez celu sirku, chyba hned pod nim, Ulozit / Zrusit pod chybou - vedla tlacidiel sa 17-miestne VIN
   zmesti len pri sirke 1440 (karta col-sm-4), na 800 px malo pole 159 px. Tlacidla mali vysku a padding tlacidla
   karty (.garrage_car_box.normal .btn) a comco-templates.css im davalo 11 px s !important. Snimky: scratchpad garform.js */
body.nd .garrage_car_box .gc-edit-form {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px; width: 100%; margin: 6px 0 4px; text-align: left;
}
body.nd .garrage_car_box :is(.gc-uservin-line, .gc-ecv-line):has(.gc-edit-form) { margin-top: 10px; font-weight: 600; color: var(--nd-ink-2); }
body.nd .garrage_car_box .gc-edit-form input.gc-edit-input {
  flex: 1 1 100%; width: auto; min-width: 0; height: 36px; margin: 0; padding: 0 10px; border: 1px solid var(--nd-muted-2); border-radius: var(--nd-r);
  background: var(--nd-surface); font-family: var(--nd-font-body); font-size: 15px; font-weight: 500; color: var(--nd-ink); box-shadow: none;
  transition: border-color .15s, box-shadow .15s;
}
/* VIN a EČV su kody - velke pismena s rozostupom (formatovanie robi JS) */
body.nd .garrage_car_box :is(.gc-uservin-line, .gc-ecv-line) .gc-edit-form input.gc-edit-input { letter-spacing: .04em; text-transform: uppercase; }
body.nd .garrage_car_box .gc-edit-form input.gc-edit-input::placeholder { color: var(--nd-muted-2); font-weight: 400; letter-spacing: 0; text-transform: none; }
body.nd .garrage_car_box .gc-edit-form input.gc-edit-input:focus { border-color: var(--nd-accent-deep); outline: 0; box-shadow: 0 0 0 3px var(--nd-accent-soft); }
body.nd .garrage_car_box .gc-edit-form .gc-edit-btns { order: 2; display: flex; flex: 0 0 auto; gap: 6px; width: auto; margin: 0; }
body.nd .garrage_car_box .gc-edit-form .gc-edit-btns .btn {
  height: 36px; min-height: 0; padding: 0 12px !important; border-radius: var(--nd-r); font-size: 14px !important; font-weight: 600; line-height: 1;
}
body.nd .garrage_car_box .gc-edit-form .gc-edit-btns .btn-default { border: 1px solid var(--nd-line); background: var(--nd-surface); color: var(--nd-ink-2); }
body.nd .garrage_car_box .gc-edit-form .gc-edit-btns .btn-default:hover { border-color: var(--nd-ink); color: var(--nd-ink); }
body.nd .garrage_car_box .gc-edit-form .gc-edit-err {
  order: 1; flex: 1 0 100%; margin: 0; font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.3; color: var(--nd-danger);
}
body.nd .garrage_car_box .gc-edit-form.gc-edit-form--err input.gc-edit-input { border-color: var(--nd-danger); }
@media (max-width: 767px) {
  /* 16 px - iOS pri mensom pisme v poli priblizi stranku */
  body.nd .garrage_car_box .gc-edit-form input.gc-edit-input { height: 40px; font-size: 16px; }
  body.nd .garrage_car_box .gc-edit-form .gc-edit-btns .btn { height: 40px; padding: 0 16px !important; }
}

/* pridanie auta: popisy poli ako v prihlaseni, hlavicky panelov svetlosive ako ostatne panely konta */
body.nd.page-garrage-add .ad-car-select.panel > .panel-heading {
  padding: 14px 16px; background: var(--nd-accent-soft); border-bottom-color: var(--nd-line); box-shadow: inset 4px 0 0 var(--nd-accent);
  font-size: 19px; line-height: 1.2;
}   /* pismo ako ostatne nadpisy blokov uctu (19 px / 700, vyska 52 px); panel bocneho stlpca ma 17 px */
body.nd.page-garrage-add .gc-add-fields label { font-size: var(--nd-fs-14-5); font-weight: 600; color: var(--nd-ink-2); }
body.nd.page-garrage-add .gc-add-fields label small { font-size: var(--nd-fs-13); font-weight: 400; color: var(--nd-muted); }
/* popisok nad polom VIN a nad vyberom z katalogu (len nd, customer_garrage_add.php) ako popisy poli pod nimi;
   selecty katalogu (select2) boli nalepene na sebe - medzera 8 px (Stefan 12.10.2026) */
body.nd.page-garrage-add .gc-add-label { display: block; margin: 0 0 6px; font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1.4; color: var(--nd-ink-2); }
body.nd.page-garrage-add .ad-car-select form.ad-select-form > .select2-container:has(~ .select2-container) { margin-bottom: 8px; }
/* chybne VIN / EČV: vseobecne .error starej temy dava polu cervene pozadie, biely text, inline-block a ine odsadenie;
   v nd ostava pole biele s cervenym ramikom a hlaska je vlavo pod nim ako vo formularoch garaze (Stefan 12.10.2026) */
body.nd.page-garrage-add :is(#vin_form, .gc-add-fields) input.form-control.error {
  display: block; padding: 6px 12px; border-color: var(--nd-danger); background-color: var(--nd-surface); color: var(--nd-ink);
}
body.nd.page-garrage-add :is(#vin_form, .gc-add-fields) input.form-control.error:focus { border-color: var(--nd-danger); box-shadow: 0 0 0 3px var(--nd-danger-soft); }
body.nd.page-garrage-add #error_text { top: 0; margin: 0 0 4px; text-align: left; font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.3; color: var(--nd-danger); }
body.nd.page-garrage-add #error_text:empty { display: none; }
body.nd.page-garrage-add .gc-add-err { margin-top: 6px; font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.3; color: var(--nd-danger); }

/* hlavicka po prihlaseni: aktualna cast konta zvyraznena (zalozku oznaci JS v customer_account.php) */
body.nd:has(.userProfile):not(:has(#btn-customer-garrage.active, #btn-customer-vouchers.active)) .nd-icons .nd-iconbtn[href$="/customer"],
body.nd:has(#btn-customer-garrage.active) .nd-icons .nd-iconbtn[href$="/customer/garrage"],
body.nd:has(#btn-customer-vouchers.active) .nd-icons .nd-iconbtn[href$="/customer/vouchers"] { color: var(--nd-accent); }
body.nd:has(.userProfile) .nd-bottomnav__item[href$="/customer"] { color: var(--nd-accent-ink); }

@media (min-width: 768px) and (max-width: 1199px) {
  body.nd .userProfile .cust-nav-col .btn-group > .btn { padding: 0 12px; }
}
@media (min-width: 768px) and (max-width: 991px) {
  /* garaz: tri karty vedla seba mali okolo 135 px a VIN pretekal kartu -> dve */
  body.nd .garrage-cars-row > .col-sm-4 { width: 50%; }
}
@media (max-width: 767px) {
  /* zalozky: mriezka 3 stlpce, ikona nad textom (pat poloziek v riadku by sa pri 320 px nezmestilo) */
  body.nd .userProfile .cust-nav-col .btn-group { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 4px; }
  body.nd .userProfile .cust-nav-col .btn-group > .btn { flex-direction: column; gap: 5px; height: 56px; padding: 0 4px; font-size: var(--nd-fs-13); }
  body.nd .userProfile .cust-nav-col .btn-group > .btn i { font-size: 17px; }
  body.nd .nd-content:has(> .userProfile) > .mainContainer:has(> h2.cust-dash-title) { padding: 0 14px 14px; }
  body.nd .mainContainer > h2.cust-dash-title { margin: 0 -14px 14px; padding: 14px; }

  /* objednavky: tabulka s piatimi stlpcami pretekala stlpec (aj v starom dizajne) -> riadok ako karta
     (cislo + suma, datum + stav, akcie) bez hlavicky, rovnako ako posledne objednavky v prehlade */
  body.nd .nd-content:has(> .userProfile) > table.table > thead { display: none; }
  body.nd .nd-content:has(> .userProfile) > table.table,
  body.nd .nd-content:has(> .userProfile) > table.table > tbody { display: block; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr {
    display: grid; grid-template-columns: minmax(min-content, 1fr) auto; gap: 2px 12px; padding: 12px 14px; border-bottom: 1px solid var(--nd-line-2);
  }   /* stlpec cisla a datumu aspon na sirku obsahu, datum na jeden riadok (dlhy stav ho prekryval, chyba #51) */
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr:last-child { border-bottom: 0; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > :is(th, td) { padding: 0; border: 0; text-align: left; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > :nth-child(1) { grid-column: 1; grid-row: 1; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > :nth-child(2) { grid-column: 1; grid-row: 2; font-size: var(--nd-fs-14); color: var(--nd-muted); white-space: nowrap; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > :nth-child(3) { grid-column: 2; grid-row: 1; text-align: right; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > :nth-child(4) { grid-column: 2; grid-row: 2; font-size: var(--nd-fs-14); text-align: right; }
  body.nd .nd-content:has(> .userProfile) > table.table > tbody > tr > :nth-child(5) { grid-column: 1 / -1; grid-row: 3; margin-top: 8px; }
  body.nd a.orders_a { height: 36px; }

  /* garaz: tlacidlo karty a dlazdica pridania */
  body.nd .garrage_car_box.normal .btn { height: 44px; font-size: 16px; }
  body.nd .garrage-add-btn { width: 48px; height: 48px; font-size: 24px; }
}

/* ============================================================
   Hlavicka pod 360 px: ikony konta a kosika sa zalamovali pod logo (chybalo ~10 px),
   Zakaznicky servis v hornej liste zasahoval do ikony telefonu
   ============================================================ */
@media (max-width: 359px) {
  .nd-logo img { height: 30px; }
  .nd-util__left { gap: 10px; }
  .nd-util__left .nd-util__link svg { display: none; }
}

/* Objednavky a Odhlasit: na mobile su v hornej liste skryte (nd-util__hide-sm), preto su vo vysuvnom menu */
.nd-nav__account { display: none; }
@media (max-width: 767px) {
  body.nd .nd-nav__account { display: block; margin: 0 16px 24px; padding-top: 4px; border-top: 1px solid var(--nd-line); }
  body.nd .nd-nav__account a {
    display: flex; align-items: center; gap: 8px; padding: 11px 6px; border-bottom: 1px solid var(--nd-line-2);
    font-size: var(--nd-fs-15); font-weight: 700; color: var(--nd-ink) !important; text-decoration: none !important; /* .mainContainer a a navbar: farba s !important */
  }
  body.nd .nd-nav__account a:hover { background: var(--nd-surface-2); }
  body.nd .nd-nav__account svg { color: var(--nd-muted); }
}


/* ==== Suhrn objednavky .ordersummary - detail v konte, dakovacia stranka, sledovanie /order/<uuid> - facelift ====
   Sablony order_summary.php, blocks/order_addresses.php, order_uuid_summary.php (len CSS). Riadok .wrap.row = karta ako
   na nastenke: ramik kresli ::before (riadok ma zaporne okraje, stlpce vnutorny okraj 15 px), nadpis h4 = hlavicka karty.
   Dva stlpce col-sm-6, kazdy s vlastnym nadpisom, su samostatne karty (nizsie). */
body.nd .ordersummary > .wrap.row { position: relative; isolation: isolate; margin-bottom: 20px; padding-bottom: 8px; }
body.nd .ordersummary > .wrap.row::before {
  content: ''; display: block; position: absolute; inset: 0 15px; z-index: -1;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
}
body.nd .ordersummary > .wrap.row > [class*='col-'] > h4 {
  margin: 1px 1px 12px; padding: 14px 16px; border-bottom: 1px solid var(--nd-line);
  border-radius: calc(var(--nd-r-lg) - 1px) calc(var(--nd-r-lg) - 1px) 0 0; background: var(--nd-accent-soft); box-shadow: inset 4px 0 0 var(--nd-accent);
  font-family: var(--nd-font-display); font-size: 19px; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-transform: none; color: var(--nd-ink);
}
/* dva stlpce s vlastnymi nadpismi (adresy, kontakt + doprava): samostatne karty vedla seba ako v povodnej sablone, na mobile
   pod sebou (Stefan 12.10.2026: boli spojene do jednej karty so spolocnou hlavickou). Kartou je stlpec, riadok len rozklada. */
body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4) { display: flex; gap: 20px; margin-left: 0; margin-right: 0; padding-bottom: 0; }
body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4)::before,
body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4)::after { display: none; }
body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4) > .col-sm-6 {
  flex: 1 1 0; min-width: 0; width: auto; float: none; padding: 0 0 8px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
}
body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4) > .col-sm-6 > h4 { margin: 0 0 12px; }
@media (max-width: 767px) {
  body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4) { flex-direction: column; }
  body.nd .ordersummary > .wrap.row:has(> .col-sm-6 + .col-sm-6 > h4) > .col-sm-6 { flex: none; } /* zaklad 0 by v stlpci zrutil vysku */
}
/* dodacie miesto a fakturacna adresa (blocks/order_addresses.php, vetva nd): adresa ako na obalke, doprava resp. IČO / IČ DPH / DIČ
   v mriezke pod nou (box a predajna: popisok Odberne miesto nad adresou, odkaz na mapu pod nou).
   "Rovnaka s fakturacnou adresou" je holy odsek v stlpci - bez okraja lepil na ramik karty. */
body.nd .ordersummary .nd-addr { padding: 0 16px; font-size: 16px; line-height: 1.5; color: var(--nd-ink); overflow-wrap: anywhere; }
body.nd .ordersummary .nd-addr__name { font-weight: 600; }
body.nd .ordersummary .nd-addr__label { margin-bottom: 2px; font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.3; color: var(--nd-muted); }
body.nd .ordersummary .nd-addr__map { display: inline-block; margin-top: 6px; font-size: var(--nd-fs-14-5); font-weight: 600; }
body.nd .ordersummary .nd-addr-ids {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px 16px; margin: 14px 16px 6px; /* na mobile 2 stlpce - IČ DPH sa v tretine lamal */ padding-top: 12px; border-top: 1px solid var(--nd-line-2);
}
body.nd .ordersummary .nd-addr-ids dt { font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.3; color: var(--nd-muted); }
body.nd .ordersummary .nd-addr-ids dd { margin: 2px 0 0; font-size: 15px; font-weight: 500; line-height: 1.35; color: var(--nd-ink); overflow-wrap: anywhere; }
body.nd .ordersummary > .wrap.row > [class*='col-'] > h4 ~ p { padding: 0 16px; font-size: 16px; color: var(--nd-ink-2); }
/* sledovanie zasielky (core/include/order_tracking.php): obsah od okraja 16 px ako ostatne karty (stary okraj 8 px) */
body.nd .order-tracking .ot-pkg { padding: 0 16px; }
body.nd .order-tracking td:first-child { padding-left: 16px; }
body.nd .order-tracking td:last-child { padding-right: 16px; }
/* popis a hodnota: popis v lavom stlpci (float do vnutorneho okraja), hodnota aj so zalomenim a odkazom pod nim vpravo.
   Povodne popisy 120 px s nowrap - Cislo rezervacie sa v pisme nd zlepilo s hodnotou. */
body.nd .ordersummary > .wrap.row ul { margin: 0; padding: 0 16px 4px; list-style: none; }
body.nd .ordersummary > .wrap.row ul > li { display: flow-root; margin: 0 0 4px; padding-left: 150px; font-size: 16px; line-height: 1.5; color: var(--nd-ink); }
body.nd .ordersummary > .wrap.row ul > li > span:first-child {
  float: left; width: 140px; margin-left: -150px; padding: 0; text-align: left; white-space: normal; font-weight: 500; color: var(--nd-muted);
}
/* komentar zakaznika: tabulka s popisom a textom; text mal sirku popisu (120 px) */
body.nd .ordersummary > .wrap.row ul > li:has(> table) { margin-top: 8px; padding-left: 0; }
body.nd .ordersummary > .wrap.row ul > li:has(> table) > br { display: none; }
body.nd .ordersummary > .wrap.row ul > li > table { width: 100%; }
body.nd .ordersummary > .wrap.row ul > li > table td:first-child { width: 150px; }
body.nd .ordersummary > .wrap.row ul > li > table td:first-child > span { display: block; width: 140px; padding: 0; text-align: left; white-space: normal; font-weight: 500; color: var(--nd-muted); }
body.nd .ordersummary > .wrap.row ul > li > table span.comment { display: inline; width: auto; padding: 0; text-align: left; white-space: normal; overflow-wrap: anywhere; color: var(--nd-ink); }
@media (max-width: 767px) {
  body.nd .ordersummary > .wrap.row ul > li { padding-left: 138px; }
  body.nd .ordersummary > .wrap.row ul > li > span:first-child { width: 130px; margin-left: -138px; }
  body.nd .ordersummary > .wrap.row ul > li > table td:first-child { width: 138px; }
  body.nd .ordersummary > .wrap.row ul > li > table td:first-child > span { width: 130px; }
}
@media (max-width: 359px) {
  body.nd .ordersummary > .wrap.row ul > li { padding-left: 112px; }
  body.nd .ordersummary > .wrap.row ul > li > span:first-child { width: 104px; margin-left: -112px; }
  body.nd .ordersummary > .wrap.row ul > li > table td:first-child { width: 112px; }
  body.nd .ordersummary > .wrap.row ul > li > table td:first-child > span { width: 104px; }
}
/* tovar v detaile objednavky (tabulka s nazvom a mnozstvo x cena, sucty v tfoot) */
body.nd .ordersummary > .wrap.basket .table { margin: 0; padding: 0 16px; }
body.nd .ordersummary > .wrap.basket table.table { margin: 0; }
body.nd .ordersummary > .wrap.basket table.table > tbody > tr > td { padding: 10px 0; border-top: 0; border-bottom: 1px solid var(--nd-line-2); vertical-align: middle; }
/* odkaz tovaru: a.order-summary-link ma v comco-templates.css podciarknutie s !important */
body.nd .ordersummary > .wrap.basket table.table > tbody > tr > td.name a { font-weight: 500; color: var(--nd-ink); text-decoration: none !important; }
body.nd .ordersummary > .wrap.basket table.table > tbody > tr > td.name a:hover { text-decoration: underline !important; }
body.nd .ordersummary > .wrap.basket table.table > tbody > tr > td.price_qty { padding-left: 12px; white-space: nowrap; text-align: right; color: var(--nd-ink-2); }
/* doprava, platba a kupon (text bez odkazu) hrubkou nazvu tovaru: base/comco.css .basket .name 700, na mobile .table td 400 */
body.nd .ordersummary > .wrap.basket table.table > tbody > tr > td.name { font-weight: 500; }
/* /order/<uuid>: doprava, platba a kupon (order_uuid_summary.php .order-uuid-item-fee) - popis vlavo, suma vpravo v stlpci Celkom,
   bez ks a ceny za kus. Riadkovanie ako nazov tovaru (2em zo base/comco-templates.css dlhy popis na mobile riedil po 32 px),
   vyska riadku na sirokej ako doteraz. Od 992 px popis od okraja nazvu tovaru: ten zacina za stlpcom obrazka col-md-2
   v col-md-6 bez laveho okraja = 1/12 sirky riadku + 2,5 px. */
body.nd .ordersummary .row.order-uuid-item-fee { padding: 4px 0; line-height: 1.5; }
@media (min-width: 992px) {
  body.nd .ordersummary .order-uuid-item-fee-name { padding-left: calc(100% / 12 + 2.5px); }
}
body.nd .ordersummary > .wrap.basket table.table > tfoot > tr > td { padding: 6px 12px; border: 0; background: var(--nd-surface-2); color: var(--nd-ink); }
body.nd .ordersummary > .wrap.basket table.table > tfoot > tr:first-child > td { padding-top: 12px; }
body.nd .ordersummary > .wrap.basket table.table > tfoot > tr:last-child > td { padding-bottom: 12px; font-size: 18px; }
/* tlacidlo Sledovat stav objednavky nad suhrnom (povodne zelene, farba textu s !important) */
body.nd a.order-summary-btn {
  display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: var(--nd-r); background: var(--nd-dark);
  font-family: var(--nd-font-body); font-size: var(--nd-fs-15); font-weight: 700; line-height: 1; text-transform: none; text-decoration: none;
  color: var(--nd-surface) !important;
}
body.nd a.order-summary-btn:hover { background: var(--nd-ink); color: var(--nd-surface) !important; }

/* ==== Titulka bez laveho stlpca (07.10.2026) ====
   Menu Vyber tovaru je v nd vsade zatvorene, takze stlpec s #main-menu-place (miesto pre rozbalene menu) je prazdny:
   skryty, slider ide na celu sirku (slider.php pri skrytom #main-menu-place necha karuselu vysku z CSS).
   Novinky z laveho stlpca vedla vyberu auta: skryte, vyber auta na celu sirku. Ich mobilna kopia pod formularom
   (page_home.php, .hidden-sm.hidden-md.hidden-lg) sa ukaze aj na desktope ako pas troch clankov.
   !important proti .hidden-* z bootstrapu. */
@media (min-width: 768px) {
  body.nd .container.page .row > .col-sm-3:is(:has(> #main-menu-place), :has(> .latestArticles)) { display: none; }
  body.nd .container.page .row > .col-sm-3:is(:has(> #main-menu-place), :has(> .latestArticles)) + .col-sm-9 { width: 100%; }
  body.nd .container.page .hidden-sm.hidden-md.hidden-lg:has(> .latestArticles) { display: block !important; margin-top: 28px; }
  body.nd .container.page .hidden-sm.hidden-md.hidden-lg:has(> .latestArticles) > br { display: none; }
  body.nd .latestArticles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 20px; margin-left: 0; margin-right: 0; }
  body.nd .latestArticles::before, body.nd .latestArticles::after { display: none; }
  body.nd .latestArticles > [class*='col-'] { width: auto; }
  body.nd .latestArticles > .col-xs-12:has(> .page-header), body.nd .latestArticles > .hp-news-more { grid-column: 1 / -1; }
  body.nd .latestArticles > [class*='col-'] { padding-left: 0; padding-right: 0; }
  body.nd .latestArticles > .hp-news-more { justify-self: end; margin-top: 14px; }
}
/* tlacidlo Vyber tovaru: sirka bola zladena so starym lavym stlpcom (comco.css max-width 157.5 px pri 768-991 px,
   212.5 px do 1199 px) a text sa lamal do dvoch riadkov; bez laveho stlpca ma prirodzenu sirku */
body.nd .nd-nav .nav-category > a.nd-nav__catbtn { white-space: nowrap; }
/* Logo bez textu Auto diely, rovnako siroke ako tlacidlo Vyber tovaru pod nim (08.10.2026): oboje berie sirku
   z --nd-brand-w. Od 1200 px 262 px (sirka tlacidla zo starych style.css a comco.css), na tablete 180 px (tlacidlo
   s textom na jeden riadok ma 174 px). Logo 600 x 154 px - pri 262 px vysoke 67 px, riadok hlavicky ma 80 px. */
@media (min-width: 768px) {
  body.nd { --nd-brand-w: 180px; }
  body.nd .nd-logo img { width: var(--nd-brand-w); height: auto; }
  body.nd .nd-nav .nav-category { width: var(--nd-brand-w); max-width: none; }
}
@media (min-width: 1200px) {
  body.nd { --nd-brand-w: 262px; }
}

/* ==== Karty v rade a posuvne pasy (07.10.2026) ====
   Kolko kariet je na desktope (od 992 px) v rade, je parameter MAIN_CFG_ND_PRODUCTS_PER_ROW (3 alebo 4): trieda
   nd-row-3 / nd-row-4 na body (layout_head.php, nd_products_per_row()) nastavi --nd-per-row. Plati pre vsetky
   mriezky kariet (vypis kategorie a vyhladavania, kosik, detail, kalkulacky) aj pre posuvne pasy. Tablet (768 az
   991 px) ma vzdy 3 v rade ako pasy: vypis kategorie dostava z product_show() col-sm-6 (columns=3, len 2 v rade),
   karta s cenou, krokovacom a Kupit sa do tretiny zmesti (~244 px, ako 4 v rade pri 1024). Mobil ma jednu kartu. */
body.nd { --nd-per-row: 3; }
body.nd.nd-row-4 { --nd-per-row: 4; }
@media (min-width: 768px) and (max-width: 991px) {
  body.nd .row:has(> .nd-pcard) > .nd-pcard { width: calc(100% / 3); }
}
@media (min-width: 992px) {
  body.nd .row:has(> .nd-pcard) > .nd-pcard, body.nd .product-strip > .nd-pcard { width: calc(100% / var(--nd-per-row)); }
  /* Najpredavanejsie (page_home.php, 8 kariet): dva plne rady - pri 3 v rade prvych 6, ako na tablete (comco-templates.css) */
  body.nd.nd-row-3 .home-bestsellers > .product:nth-child(n+9) { display: none; }
}
/* posuvny pas (nd_carousel_open/close v nd/bootstrap.php): Odporucame a Navstivene produkty. Pocet kariet spolu je
   MAIN_CFG_ND_CAROUSEL_PRODUCTS, naraz ich je vidno --nd-per-row (tablet 3, mobil jedna a kusok dalsej).
   Zaporny okraj stopy = odsadenie kariet (col-* padding), takze prva karta lici s nadpisom ako v mriezke. */
body.nd .nd-carousel { position: relative; flex: 0 0 100%; min-width: 0; max-width: 100%; }
/* layout.php vypisuje Navstivene produkty do DALSIEHO .container.page vnutri hlavneho - s pevnou sirkou z bootstrapu
   (1170 px !important v starom CSS) pas pretekal obsah stranky o 30 px doprava */
body.nd .container.page > .container.page { width: auto !important; padding-left: 0; padding-right: 0; }
body.nd .nd-carousel__track {
  display: flex; margin: 0 -15px 6px; overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: none;
}
body.nd .nd-carousel__track::-webkit-scrollbar { display: none; }
/* min-width 0: flex prvok sa inak nezuzi pod sirku obsahu (4 v rade pri 992-1199 px = 242,5 px, obsah 245 px) */
body.nd .nd-carousel__track > .nd-pcard { flex: 0 0 calc(100% / var(--nd-per-row)); width: auto; min-width: 0; max-width: none; margin-bottom: 0; scroll-snap-align: start; }
/* nazov karty v slideri o nieco mensi ako vo vypise (16 px), 12.10.2026 */
body.nd .nd-carousel__track > .nd-pcard .nd-pcard__title { font-size: 15px; }   /* pevne: --nd-fs-15 je na mobile 16 px */
body.nd .nd-carousel__nav {
  position: absolute; top: 34%; z-index: 3; display: flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; margin-top: -21px; padding: 0; border: 1px solid var(--nd-line); border-radius: 50%;
  background: var(--nd-surface); box-shadow: var(--nd-shadow); color: var(--nd-ink); cursor: pointer;
}
body.nd .nd-carousel__nav[hidden] { display: none; }
body.nd .nd-carousel__nav:disabled { visibility: hidden; }
body.nd .nd-carousel__nav:hover, body.nd .nd-carousel__nav:focus-visible { border-color: var(--nd-ink); }
body.nd .nd-carousel__prev { left: -21px; }
body.nd .nd-carousel__next { right: -21px; }
/* posuvna lista pod pasom (desktop aj mobil, Stefan 07.10.2026): ukazuje, ze sa da posuvat; klik na listu posunie
   pas plynulo na to miesto, bezec sa da tahat (JS v nd_carousel_close). ::before = vacsia plocha na klik a prst. */
body.nd .nd-carousel__bar { position: relative; height: 6px; margin: 12px 0 4px; border-radius: 999px; background: var(--nd-line-2); cursor: pointer; }
body.nd .nd-carousel__bar[hidden] { display: none; }
body.nd .nd-carousel__bar::before, body.nd .nd-carousel__thumb::before { content: ""; position: absolute; inset: -9px 0; }
body.nd .nd-carousel__thumb {
  position: absolute; top: 0; left: 0; height: 100%; min-width: 32px; border-radius: inherit; background: var(--nd-muted);
  cursor: grab; touch-action: none; transition: background-color .15s;
}
body.nd .nd-carousel__bar:hover .nd-carousel__thumb, body.nd .nd-carousel.is-drag .nd-carousel__thumb { background: var(--nd-ink); }
body.nd .nd-carousel.is-drag .nd-carousel__thumb { cursor: grabbing; }
/* pocas tahania bez prichytavania ku kartam, po pusteni JS plynulo dorovna na najblizsiu */
body.nd .nd-carousel.is-drag .nd-carousel__track { scroll-snap-type: none; scroll-behavior: auto; }
/* Suvisiace produkty na detaile (product_respo.php) su v Bootstrap .media-body = table-cell so sirkou 10000 px, ktora
   sa roztiahne na sirku obsahu - pas by bol siroky ako vsetky karty; .media ma overflow hidden a orezal by sipky */
body.nd .media:has(.ad-detail-replace .nd-carousel) { overflow: visible; }
body.nd .media-body:has(.ad-detail-replace .nd-carousel) { display: block; width: auto; overflow: visible; }
@media (max-width: 991px) {
  body.nd .nd-carousel__track > .nd-pcard { flex-basis: calc(100% / 3); }
}
@media (max-width: 767px) {
  body.nd .nd-carousel__track { margin: 0 -6px 4px; }
  body.nd .nd-carousel__track > .nd-pcard { flex-basis: 82%; }
  body.nd .nd-carousel__nav { display: none; }
}
/* Sipky pasov na tablete (13.10.2026): pri 768 a 1024 px je okraj stranky len 24 a 42 px - sipka 42 px s left/right -21 px
   presahovala za okraj obsahu a prekryvala poslednu kartu. Dotykovy tablet ako mobil: sipky skryte, posuva sa prstom
   a listou pod pasom (ta je viditelna na kazdej sirke, ked je co posuvat). S mysou mensia sipka vnutri okraja obsahu. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.nd .nd-carousel__nav { width: 36px; height: 36px; margin-top: -18px; }
  body.nd .nd-carousel__prev { left: 4px; }
  body.nd .nd-carousel__next { right: 4px; }
}
@media (min-width: 768px) and (max-width: 1199px) and (hover: none) {
  body.nd .nd-carousel__nav { display: none; }
}
/* ==== Token [[top-products]] (template/default/top_products.php, Stefan 13.10.2026): Popularne filtre / spojkove sady /
   stierace na /nahradne-diely-a753 a dalsich strankach s tokenom. Posuvny pas nd_carousel (nd_carousel_count() kariet,
   naraz --nd-per-row), nadpis a odkaz „Vsetky …“ v jednom riadku nad pasom - odkaz ako tlacidlo so sipkou vpravo
   namiesto zltej listy h2.top-products-more pod kartami (tu sa nevypisuje). ==== */
body.nd .nd-tp { margin: 28px 0 10px; }
body.nd .nd-tp__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; margin-bottom: 14px; }
body.nd .nd-tp__head h2.top-products-title { flex: 1 1 auto; min-width: 0; margin: 0; }
body.nd .nd-tp__more {
  display: inline-flex; flex: none; align-items: center; gap: 8px; margin-left: auto; padding: 8px 14px 8px 16px;
  border: 1px solid var(--nd-line); border-radius: 999px; background: var(--nd-surface);
  font-size: var(--nd-fs-15); font-weight: 600; line-height: 1.3; white-space: nowrap;
  color: var(--nd-ink) !important; text-decoration: none !important;   /* !important proti .mainContainer a z comco.css */
  transition: background-color .15s, border-color .15s;
}
body.nd .nd-tp__more svg { flex: none; transition: transform .15s; }
body.nd .nd-tp__more:hover, body.nd .nd-tp__more:focus-visible { border-color: var(--nd-accent); background: var(--nd-accent); color: var(--nd-on-accent) !important; }
body.nd .nd-tp__more:hover svg, body.nd .nd-tp__more:focus-visible svg { transform: translateX(3px); }
body.nd .nd-tp__more:focus-visible { outline: 3px solid var(--nd-accent-deep); outline-offset: 2px; }
@media (max-width: 767px) {
  body.nd .nd-tp { margin-top: 22px; }
  body.nd .nd-tp__more { padding: 6px 12px 6px 14px; }
}

/* ==== Filter bez laveho stlpca (07.10.2026): lista nad produktmi + bocny panel ====
   Formular #ntf-filter (ntfacets/render.php) je pred obsahom (nd/default_2columns.php) a od tabletu je to vysuvny
   panel zlava - otvara ho tlacidlo Filter v liste #ntf-bar (page.php), stav drzi body.ntf-open ako na mobile.
   Listu doplna blocks/nd_filter_bar_js.php: rozbalovacie tlacidla prvych styroch skupin (.nd-fdd) s kopiou
   hodnot a cipy vybranych hodnot (.nd-fchip). Mobil ostava na povodnej liste Filter / Zoradit. */
.nd-fpanel-backdrop { display: none; }
@media (max-width: 767px) {
  body.nd .nd-fbar__dd, body.nd .nd-fbar__chips { display: none; }
}
@media (min-width: 768px) {
  body.nd.ntf-on #ntf-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 18px; }
  body.nd.ntf-on .ntf-bar-btn, body.nd .nd-fdd__btn {
    display: inline-flex; align-items: center; gap: 7px; height: 40px; margin: 0; padding: 0 14px;
    border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
    font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1; color: var(--nd-ink-2); white-space: nowrap; cursor: pointer;
  }
  body.nd.ntf-on .ntf-bar-btn { position: relative; border-color: var(--nd-ink); background: var(--nd-ink); color: #fff; }
  body.nd.ntf-on .ntf-bar-btn:hover { background: var(--nd-dark); }
  body.nd.ntf-on .ntf-bar-hint { display: none; }
  body.nd.ntf-on .ntf-bar-badge {
    display: none; min-width: 20px; padding: 0 6px; border-radius: var(--nd-r-pill); background: var(--nd-accent);
    font-size: var(--nd-fs-12); font-weight: 700; line-height: 20px; text-align: center; color: var(--nd-on-accent);
  }
  /* pocet ako bublina v rohu: tlacidlo nemeni sirku, otvorene rozbalenie po prvom vybere neposkoci */
  body.nd.ntf-on .ntf-bar-badge.on { display: inline-block; position: absolute; top: -9px; right: -9px; box-shadow: 0 0 0 2px var(--nd-surface); }
  /* pocas nacitania bez klikania ako #ntf-filter.ntf-loading v starom CSS - klik zrusi JS (nd_filter_bar_js.php),
     pointer-events: none by ho pustil na produkty pod rozbalenim */
  body.nd.ntf-busy .nd-fdd__pop, body.nd.ntf-busy .nd-fbar__chips { opacity: .6; cursor: progress; }
  body.nd .nd-fbar__dd { display: contents; }
  body.nd .nd-fdd { position: relative; }
  body.nd .nd-fdd__btn:hover, body.nd .nd-fdd__btn.is-active, body.nd .nd-fdd.is-open > .nd-fdd__btn { border-color: var(--nd-ink); color: var(--nd-ink); }
  body.nd .nd-fdd__btn .nd-ico { color: var(--nd-muted); transition: transform .15s; }
  body.nd .nd-fdd.is-open > .nd-fdd__btn .nd-ico { transform: rotate(180deg); }
  body.nd .nd-fdd__n {
    min-width: 20px; padding: 0 6px; border-radius: var(--nd-r-pill); background: var(--nd-ink);
    font-size: var(--nd-fs-12); font-weight: 700; line-height: 20px; text-align: center; color: #fff;
  }
  body.nd .nd-fdd__pop {
    position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; width: 300px; max-height: min(420px, 60vh); overflow-y: auto;
    padding: 8px 14px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface);
    box-shadow: var(--nd-shadow-lg); scrollbar-width: thin;
  }
  body.nd .nd-fdd__pop--right { left: auto; right: 0; }
  body.nd .nd-fdd__pop .ntf-opts { margin: 0; padding: 0; }
  body.nd .nd-fdd__pop li { list-style: none; } /* .mainContainer ul li ma odrazky */
  /* hodnoty v rozbaleni = ako v paneli (body.nd #ntf-filter .ntf-opt ... vyssie) */
  body.nd .nd-fdd__pop .ntf-opt label { display: flex; align-items: center; gap: 9px; padding: 5px 0; font-size: var(--nd-fs-14-5); line-height: 1.3; color: var(--nd-ink-2); }
  body.nd .nd-fdd__pop .ntf-opt input { flex: 0 0 auto; width: 17px; height: 17px; margin: 0; accent-color: var(--nd-ink); }
  body.nd .nd-fdd__pop .ntf-opt .ntf-cnt {
    margin-left: auto; padding: 1px 7px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
    font-size: var(--nd-fs-11-5); font-weight: 600; line-height: 1.5; color: var(--nd-muted);
  }
  body.nd .nd-fdd__pop .ntf-opt.ntf-has-sub > label { padding-left: 0; }
  body.nd .nd-fdd__pop .ntf-opt.ntf-has-sub > label > input { position: static; top: auto; }
  body.nd .nd-fdd__pop .ntf-sub { border-left: 0; }
  body.nd .nd-fdd__pop .ntf-sub .ntf-opt label { font-size: var(--nd-fs-13-5); }
  body.nd .nd-fdd__pop .ntf-sub-more { font-size: var(--nd-fs-12); color: var(--nd-muted); }
  /* cipy vybranych hodnot */
  body.nd .nd-fbar__chips { display: flex; flex: 0 0 100%; flex-wrap: wrap; align-items: center; gap: 6px; }
  body.nd .nd-fbar__chips[hidden] { display: none; }
  body.nd .nd-fchip {
    display: inline-flex; align-items: center; gap: 5px; height: 30px; margin: 0; padding: 0 8px 0 12px;
    border: 1px solid var(--nd-line); border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
    font-size: var(--nd-fs-13-5); line-height: 1; color: var(--nd-ink); cursor: pointer;
  }
  body.nd .nd-fchip:hover, body.nd .nd-fchip:focus-visible { border-color: var(--nd-ink); }
  body.nd .nd-fchip__g { color: var(--nd-muted); }
  body.nd .nd-fchip .nd-ico { color: var(--nd-muted); }
  body.nd .nd-fchips__all {
    height: 30px; margin: 0; padding: 0 6px; border: 0; background: none; font-size: var(--nd-fs-13-5); font-weight: 600;
    color: var(--nd-accent-ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
  }
  /* bocny panel */
  body.nd.ntf-on #ntf-filter { display: none; }
  body.nd.ntf-open #ntf-filter {
    display: block; position: fixed; top: 0; bottom: 0; left: 0; z-index: 100005; width: 400px; max-width: calc(100vw - 60px);
    margin: 0; border: 0; border-radius: 0; overflow-y: auto; overscroll-behavior: contain; box-shadow: var(--nd-shadow-lg);
  }
  body.nd.ntf-open #ntf-filter .ntf-title { position: sticky; top: 0; z-index: 2; padding: 12px 12px 12px 20px; border-radius: 0; }
  body.nd.ntf-open #ntf-close {
    display: block; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: var(--nd-r); background: transparent;
    font-size: 28px; font-weight: 400; line-height: 1; color: var(--nd-ink); cursor: pointer;
  }
  body.nd.ntf-open #ntf-close:hover { background: var(--nd-surface-2); }
  body.nd.ntf-open #ntf-filter .panel-body { padding: 16px 20px 0; }
  body.nd.ntf-open #ntf-filter .ntf-opts.ntf-scroll { max-height: none; overflow: visible; padding-right: 0; }
  body.nd.ntf-open #ntf-filter .ntf-apply { position: sticky; bottom: 0; margin: 18px -20px 0; width: calc(100% + 40px); height: 52px; border-radius: 0; }
  body.nd.ntf-open .nd-fpanel-backdrop { display: block; position: fixed; inset: 0; z-index: 100004; background: rgba(21, 23, 26, .45); }
}

/* ==== TecDoc katalog bez laveho stlpca (07.10.2026) ====
   autodiely/autodiely.php kresli v obsahu vlastny riadok #ad-column-left (col-sm-3) + #ad-column-right (col-sm-9).
   Od tabletu vyssie su oba na celu sirku: Vozidlo (formular .ad-select-form) je pas nad obsahom, Filter (#parts-filter)
   a strom kategorii (.ad-tree.pf-tree) su bocne panely zlava ako #ntf-filter. Otvara ich lista #pf-bar Filtrovat /
   Kategorie (_tecdoc_facet_render_bar, povodne len mobilna), stav drzia triedy body.pf-open-filter, pf-open-cats
   a pf-drawer-open (show_parts.php). Listu doplna blocks/nd_filter_bar_js.php (vypisuje ho nd/default_1columns.php).
   VIN katalog (laximo_comco.php) ma ten isty #ad-column-left bez .ad-select-form a ostava v stlpci. Mobil sa nemeni. */
@media (min-width: 768px) {
  body.nd .row:has(> #ad-column-left .ad-select-form) > #ad-column-left,
  body.nd .row:has(> #ad-column-left .ad-select-form) > #ad-column-right { float: none; width: 100%; }
  /* odznak Heureka pod Vozidlom (includes/left_column.html) patril do stlpca */
  body.nd #ad-column-left:has(.ad-select-form) > .hidden-xs { display: none; }
  /* Vozidlo: nadpis vlavo, vybery v jednom rade (na tablete v dvoch) */
  body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select:has(.ad-select-form) { display: flex; align-items: stretch; margin-bottom: 18px; overflow: hidden; }
  body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select:has(.ad-select-form) > .panel-heading {
    flex: 0 0 auto; display: flex; align-items: center; margin: 0; padding: 0 18px; border: 0; border-right: 1px solid var(--nd-line);
    border-radius: 0; background: var(--nd-surface-2);
  }
  body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select:has(.ad-select-form) > .panel-body { flex: 1 1 auto; min-width: 0; padding: 12px 14px; }
  body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form { display: flex; flex-wrap: wrap; gap: 8px; }
  body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form select.form-control { flex: 1 1 150px; width: auto; min-width: 0; margin: 0; }
  body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form :is(#ad-frm-button, #ndv-frm-button) { flex: 0 0 auto; width: auto; height: 40px; margin: 0; padding: 0 22px; }

  /* Filter a strom kategorii: bocne panely (len ked je na stranke lista, ktora ich otvara) */
  body.nd .row:has(#pf-bar) > #ad-column-left #parts-filter,
  body.nd .row:has(#pf-bar) > #ad-column-left .ad-tree.pf-tree { display: none; }
  body.nd.pf-open-filter .row:has(#pf-bar) > #ad-column-left #parts-filter,
  body.nd.pf-open-cats .row:has(#pf-bar) > #ad-column-left .ad-tree.pf-tree {
    display: block; position: fixed; top: 0; bottom: 0; left: 0; z-index: 100005; width: 400px; max-width: calc(100vw - 60px);
    margin: 0; border: 0; border-radius: 0; overflow-y: auto; overscroll-behavior: contain; box-shadow: var(--nd-shadow-lg);
  }
  body.nd.pf-drawer-open #ad-column-left .panel > .panel-heading { position: sticky; top: 0; z-index: 2; min-height: 52px; padding-right: 60px; border-radius: 0; }
  body.nd.pf-drawer-open #pf-drawer-close {
    display: block; position: fixed; top: 6px; left: calc(min(400px, 100vw - 60px) - 50px); z-index: 100006; width: 40px; height: 40px;
    margin: 0; padding: 0; border: 0; border-radius: var(--nd-r); background: transparent;
    font-size: 28px; font-weight: 400; line-height: 1; color: var(--nd-ink); cursor: pointer;
  }
  body.nd.pf-drawer-open #pf-drawer-close:hover { background: var(--nd-surface-2); }
  body.nd.pf-open-filter #parts-filter .pf-opts.pf-scroll { max-height: none; overflow: visible; padding-right: 0; }
  body.nd.pf-open-filter #pf-show-btn { position: sticky; bottom: 0; z-index: 2; width: calc(100% + 32px); height: 52px; margin: 18px -16px -16px; border-radius: 0; }
  body.nd.pf-drawer-open .nd-fpanel-backdrop { display: block; position: fixed; inset: 0; z-index: 100004; background: rgba(21, 23, 26, .45); }

  /* lista ako #ntf-bar: Filtrovat (tmave) a Kategorie, za nimi rozbalovacie skupiny a cipy */
  body.nd #pf-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; position: static; margin: 0 0 18px; padding: 0; background: none; }
  body.nd .pf-bar-btn {
    flex: none; display: inline-flex; align-items: center; gap: 7px; height: 40px; min-height: 0; margin: 0; padding: 0 14px;
    border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
    font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1; color: var(--nd-ink-2); white-space: nowrap; cursor: pointer;
  }
  body.nd #pf-bar-filter { position: relative; border-color: var(--nd-ink); background: var(--nd-ink); color: #fff; }
  body.nd #pf-bar-filter:hover { background: var(--nd-dark); }
  body.nd #pf-bar-cats:hover { border-color: var(--nd-ink); color: var(--nd-ink); }
  body.nd .pf-bar-hint { display: none; }
  body.nd .pf-bar-badge {
    display: none; min-width: 20px; padding: 0 6px; border-radius: var(--nd-r-pill); background: var(--nd-accent);
    font-size: var(--nd-fs-12); font-weight: 700; line-height: 20px; text-align: center; color: var(--nd-on-accent);
  }
  body.nd .pf-bar-badge.on { display: inline-block; position: absolute; top: -9px; right: -9px; box-shadow: 0 0 0 2px var(--nd-surface); }
  body.nd.pf-busy .nd-fdd__pop, body.nd.pf-busy .nd-fbar__chips { opacity: .6; cursor: progress; }
  /* hodnoty TecDoc fasiet v rozbaleni = ako v paneli (body.nd #parts-filter .pf-opt vyssie) */
  body.nd .nd-fdd__pop .pf-opts { display: flex; flex-direction: column; margin: 0; padding: 0; }
  body.nd .nd-fdd__pop .pf-opt {
    display: flex; align-items: center; gap: 9px; margin: 0; padding: 5px 0; font-size: var(--nd-fs-14-5); font-weight: 400; line-height: 1.3;
    color: var(--nd-ink-2); cursor: pointer;
  }
  body.nd .nd-fdd__pop .pf-opt input { flex: 0 0 auto; width: 17px; height: 17px; margin: 0; accent-color: var(--nd-ink); }
  body.nd .nd-fdd__pop .pf-name { flex: 1 1 auto; }
  body.nd .nd-fdd__pop .pf-count {
    margin-left: auto; padding: 1px 7px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
    font-size: var(--nd-fs-11-5); font-weight: 600; line-height: 1.5; color: var(--nd-muted);
  }
  body.nd .nd-fdd__pop .pf-zero { color: var(--nd-muted-2); cursor: default; }
}

/* ==== Vyber tovaru len na klik (08.10.2026) ====
   Zdielany template/respo/custom.js ukazuje a skryva .nav-menu pri prechode mysou (inline display), Bootstrap
   dropdown k tomu na klik prepina triedu .open na .nav-category (zavrie ho aj druhy klik, klik mimo a Esc).
   V nd od tabletu rozhoduje len .open - inline styl z hoveru preto prebija !important. Mobil ma menu vzdy
   rozbalene vo vysuvnom paneli (vyssie, display: block !important v max-width: 767px). Podmenu ostava na hover. */
@media (min-width: 768px) {
  body.nd .nd-nav .nav-category > .dropdown-menu.nav-menu { display: none !important; }
  body.nd .nd-nav .nav-category.open > .dropdown-menu.nav-menu { display: block !important; }
}

/* ==== Tablet: titulka, menu Vyber tovaru a podmenu pasu (14.10.2026) ====
   - titulka 992-1199: karta bannerov vedla vyberu auta sa nenatahuje na vysku formulara (obrazok 3 : 1 v stlpci
     260 px ma 87 px a pod textom ostavalo okolo 300 px prazdnej karty); od 1200 px karta ostava na vysku stlpca
   - menu Vyber tovaru 768-1199: siroke podla najdlhsej polozky (aspon ako tlacidlo, najviac 340 px), inak bola
     polozka Vybavenie servisu a dielne orezana; pismo 15 px namiesto 0.9em z comco.css (12.6 px pri 768-991)
   - na dotyk (pointer: coarse) riadky menu aj podmenu pasu aspon 44 px. Podmenu Vsetko o nakupe, Zakaznicky
     servis a Kontakt otvara na dotyk blocks/nd_header_js.php (prve tuknutie otvori, druhe ide na stranku);
     .nd-sub-end tam dostane podmenu, ktore by vyslo z okna vpravo - zarovna sa k pravemu okraju polozky */
@media (min-width: 992px) and (max-width: 1199px) {
  body.nd .nd-hero-ads { align-self: start; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  body.nd .nd-nav .nav-category > .dropdown-menu.nav-menu { width: max-content; min-width: var(--nd-brand-w); max-width: min(340px, calc(100vw - 48px)); }
  body.nd .nd-nav .nav-category .dropdown-menu li a { padding: 12px 16px; font-size: var(--nd-fs-15); line-height: 1.4; white-space: normal; }
}
@media (min-width: 768px) and (pointer: coarse) {
  body.nd .nd-nav .nav-category .dropdown-menu li a,
  body.nd .nd-nav .navbar-nav .dropdown-menu > li > a { min-height: 44px; padding-top: 12px; padding-bottom: 12px; }
}
@media (min-width: 768px) {
  body.nd .nd-nav .navbar-nav > li.nd-sub-end > .dropdown-menu { left: auto; right: 0; }
}

/* ==== Produkt z kosika na karte vypisu (08.10.2026) ====
   Podla prototypu (.in-cart a .incart-ribbon): karta produktu, ktory zakaznik ma v kosiku, ma zeleny ramik
   a v pravom hornom rohu odznak V kosiku (pri viac kusoch V kosiku · N). Triedu nd-in-cart, data-nd-incart
   aj odznak .nd-incart sklada server (template/nd/bootstrap.php nd_incart), po AJAX pridani alebo zmene
   mnozstva ich prekresli blocks/nd_incart_js.php. Box karty je .nd-pcard__in (vsetko cez product_show)
   a TecDoc .ad-product. Ramik prebija hover vyssou specificitou, nie !important. Druhy pixel ramika je
   inset tien: vonkajsi (0 0 0 1px) posuvny pas (.nd-carousel__track, overflow-x auto) dole orezal a ramik
   bol na spodku o 1 px tensi (Stefan 08.10.2026). */
body.nd .nd-pcard__in.nd-in-cart, body.nd .ad-product.nd-in-cart { border-color: var(--nd-ok); box-shadow: inset 0 0 0 1px var(--nd-ok); }
body.nd .nd-pcard__in.nd-in-cart:hover { border-color: var(--nd-ok); box-shadow: inset 0 0 0 1px var(--nd-ok), var(--nd-shadow); }
body.nd .ad-product.nd-in-cart:hover { border-color: var(--nd-ok); box-shadow: inset 0 0 0 1px var(--nd-ok), var(--nd-shadow-sm); }
body.nd .nd-incart {
  position: absolute; top: 0; right: 0; z-index: 4; display: inline-flex; align-items: center; gap: 4px; margin: 0;
  padding: 4px 10px; border-radius: 0 calc(var(--nd-r-lg) - 1px) 0 var(--nd-r); background: var(--nd-ok); color: #fff;
  font-size: var(--nd-fs-11); font-weight: 700; line-height: 1.2; letter-spacing: .01em; white-space: nowrap;
}
body.nd .nd-incart .nd-ico { flex: 0 0 auto; stroke-width: 2.6; }
/* TecDoc riadok: vpravo hore je cena (od 1200 px), pod 1200 px vyrobca, nazov a ikonka strany montaze - odznak
   dostane vlastny pruh nad obsahom, aby nic neprekryl */
body.nd .ad-product.nd-in-cart { padding-top: 34px; }
@media (min-width: 768px) {
  body.nd .ad-product.nd-in-cart .ad-product-info .pf-ms { top: 34px; }
}
@media (max-width: 767px) {
  body.nd .ad-product.nd-in-cart { padding-top: 32px; }
  body.nd .ad-product.nd-in-cart .ad-product-info .pf-ms { top: 34px; }   /* karta ako slider: ikonka vedla obrazka pod odznakom */
}
/* kalkulacka naplni: vnorena karta 1 L nema obrazok, odznak by prekryl znacku a nazov */
body.nd .kalk-naplne-doplnok .nd-pcard__in.nd-in-cart > .nd-pcard__body { padding-top: 30px; }

/* ---- hľadanie: VIN (template/nd/header.php #searchBox, JS blocks/nd_header_js.php, ajax/vin_lookup.php) ----
   Dve záložky Diel / číslo / OE a VIN. V zbalenej mobilnej hlavičke sa vedľa políčka nezmestia (ostávajú skryté),
   v mobilnom vyhľadávaní na celú obrazovku sú ako prepínač nad políčkom - VIN je na telefóne častý vstup
   (technický preukaz v ruke). Hláška #nd-search-msg je na desktope rozbaľovacia pod políčkom, v modale v toku. */
html.search-modal-open .nd-search__modes { display: flex; gap: 6px; margin: 0 0 10px; border: 0; }
html.search-modal-open .nd-search__modes button {
  flex: 1 1 0; height: 38px; padding: 0 10px; border: 1px solid rgba(255,255,255,.22); border-radius: var(--nd-r);
  background: rgba(255,255,255,.06); color: #d5d8dc; font-size: var(--nd-fs-15);
}
html.search-modal-open .nd-search__modes button.is-active { background: #fff; border-color: #fff; color: var(--nd-ink); }
html.search-modal-open body.nd #searchBox[data-mode="vin"] #search-q { font-family: var(--nd-font-mono); letter-spacing: .02em; }
html.search-modal-open body.nd #searchBox[data-mode="vin"] .search-modal__home { display: none; }
body.nd #searchBox[data-mode="vin"] #search-q { text-transform: uppercase; }
body.nd #searchBox[data-mode="vin"] #search-q::placeholder { text-transform: none; }

.nd-search__msg {
  padding: 12px 14px; border: 1px solid var(--nd-line); border-left: 4px solid var(--nd-muted);
  border-radius: var(--nd-r); background: var(--nd-surface); color: var(--nd-ink-2);
  font-size: var(--nd-fs-15); line-height: 1.45; text-align: left;
}
.nd-search__msg[hidden] { display: none; }
.nd-search__msg a { font-weight: 600; color: var(--nd-ink); text-decoration: underline; }
.nd-search__msg--info { border-left-color: var(--nd-accent); background: var(--nd-accent-soft); }
.nd-search__msg--busy { border-left-color: var(--nd-accent); color: var(--nd-muted); }
.nd-search__msg--warn { border-left-color: var(--nd-warn); }
.nd-search__msg--error { border-left-color: var(--nd-danger); background: var(--nd-danger-soft); }
html:not(.search-modal-open) body.nd #searchBox .nd-search__msg {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 1050; box-shadow: var(--nd-shadow-lg);
}
html.search-modal-open body.nd #searchBox .nd-search__msg { flex: 0 0 auto; margin: 12px 16px 0; }
body.nd #searchBox.nd-search--busy .nd-search__go { opacity: .7; cursor: progress; }
.nd-vin-login-note {
  margin: 0 0 14px; padding: 10px 12px; border-left: 4px solid var(--nd-accent); border-radius: var(--nd-r-sm);
  background: var(--nd-accent-soft); color: var(--nd-ink-2); font-size: var(--nd-fs-15);
}

/* ==== Ciernobiele loga znaciek na titulke (08.10.2026) ====
   Blok Autodiely pre popularne znacky vozidiel (obsah stranky, ul.ad-brand-ul) mal farebne gify 90x75. V nd ich
   server vymeni za ciernobiele loga z garaze (template/nd/bootstrap.php nd_home_brand_logos: subory 120x88 s logom
   normalizovanym na rovnaku plochu, trieda nd-brand-bw), doplni dalsie znacky do 20 (nd_home_brand_more) a ul urobi
   stopou posuvneho pasu nd_carousel (obal .nd-hp-brands). Stefan: mensie loga, na desktope dva plne rady az do konca,
   na mobile posuvny pas do strany.
   Od 768 px mriezka bez posuvania: ul ma 720 / 940 / 1140 px, teda 6 / 8 / 10 stlpcov po 105 az 112 px, co je za
   druhym radom, je skryte (20 v PHP = 2 x 10 - pri zmene stlpcov uprav aj nd_home_brand_logos). JS pasu vtedy listu
   aj sipky skryje sam. Pod 768 px jeden rad so scroll-snap a listou pasu, vidno tri a pol znacky.
   Logo 48 px vysoke, sirka podla pomeru suboru (65 px), v uzsej bunke sa zmensi cele. */
body.nd ul.ad-brand-ul img.nd-brand-bw { width: auto; max-width: 100%; height: 48px; margin: 0 0 6px; object-fit: contain; }
body.nd .nd-hp-brands { margin: 8px 0 24px; }
body.nd .nd-hp-brands ul.ad-brand-ul { margin: 0; }
/* letter-spacing 0: MERCEDES-BENZ sa tak zmesti do 105 px bunky na jeden riadok */
body.nd .nd-hp-brands ul.ad-brand-ul > li > a { display: block; font-size: var(--nd-fs-13); line-height: 1.25; letter-spacing: 0; overflow-wrap: anywhere; }
@media (min-width: 768px) {
  body.nd .nd-hp-brands ul.ad-brand-ul {
    display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px 10px; overflow: visible; scroll-snap-type: none;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  body.nd .nd-hp-brands ul.ad-brand-ul > li:nth-child(n+13) { display: none; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  body.nd .nd-hp-brands ul.ad-brand-ul { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  body.nd .nd-hp-brands ul.ad-brand-ul > li:nth-child(n+17) { display: none; }
}
@media (min-width: 1200px) {
  body.nd .nd-hp-brands ul.ad-brand-ul { grid-template-columns: repeat(10, minmax(0, 1fr)); }
  body.nd .nd-hp-brands ul.ad-brand-ul > li:nth-child(n+21) { display: none; }
}
@media (max-width: 767px) {
  body.nd .nd-hp-brands ul.ad-brand-ul { display: flex; gap: 8px; }
  body.nd .nd-hp-brands ul.ad-brand-ul > li { flex: 0 0 27%; scroll-snap-align: start; }
}

/* ==== Katalog na tablete (14.10.2026) ====
   Popis dlazdice v Popularnych kategoriach (show_parts.php, searchStructure.short_text) konci tromi bodkami, ktore
   pri 768 px padli samy na posledny riadok - pretty zalomi skor (Firefox ho zatial ignoruje, ostava ako doteraz). */
body.nd .ad-catbox ul li a span:not(.cathead) { text-wrap: pretty; }
/* Lista Vozidlo (autodiely/show_select_form.php, 5 vyberov + Zmenit; to iste v paneli #nd-veh-host): pri 992 az
   1199 px uzsi zaklad vyberov, nech Zmenit nepadne samo do 2. riadku; 768 az 991 px mriezka 3 x 2 s tlacidlom
   v poslednej bunke (predtym 3 + 2 vybery a tlacidlo). */
@media (min-width: 992px) and (max-width: 1199px) {
  body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form select.form-control { flex-basis: 110px; }
}
@media (min-width: 768px) and (max-width: 991px) {
  body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.nd :is(#ad-column-left, #nd-veh-host) .ad-select-form :is(#ad-frm-button, #ndv-frm-button) { grid-column: -2; width: 100%; }
}
/* TecDoc lista #pf-bar (768 az 1199 px): rozbalovacie filtre (.nd-fbar__dd, blocks/nd_filter_bar_js.php) zaplnili
   prvy riadok a Zoradit ostal sam v druhom. Prvy riadok je Kategorie dielov, Filtrovat a vpravo Zoradit, filtre su
   pod nimi vo vlastnom riadku (obal je riadok mriezky namiesto display: contents), cipy ostavaju posledne. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.nd #pf-bar .nd-sort { order: 1; }
  body.nd #pf-bar .nd-fbar__dd { display: flex; flex: 0 0 100%; flex-wrap: wrap; gap: 8px; order: 2; min-width: 0; }
  body.nd #pf-bar .nd-fbar__dd:not(:has(.nd-fdd)) { display: none; }
  body.nd #pf-bar .nd-fbar__chips { order: 3; }
}
/* Rozcestnik /nahradne-diely-a753 (template/default/page.php, .ad_top_tabs_big): styri odkazy osobne, dodavky,
   nakladne a motocykle ako biele dlazdice (vzor .pagegallery): mriezka 2 stlpce (mobil 1), ramik, zaoblenie,
   hover zlaty ramik a nadych ikony za 200 ms, bez vynimky pre reduced-motion. Stary comco.css: sivy pruh 80 px,
   ikona float, medzery .text-spacer a posuny .pull_up a .text. */
body.nd .ad_top_tabs_big { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 4px 0 28px; }
body.nd .ad_top_tabs_big::before, body.nd .ad_top_tabs_big::after { content: none; }
body.nd .ad_top_tabs_big > div { float: none; width: auto; min-height: 0; margin: 0; padding: 0; }
body.nd .ad_top_tabs_big a, body.nd .ad_top_tabs_big a:hover, body.nd .ad_top_tabs_big a.truck {
  display: flex; align-items: center; gap: 14px; width: 100%; height: 100%; min-height: 76px; padding: 12px 20px 12px 14px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
  font-size: var(--nd-fs-15); font-weight: 700; line-height: 1.3; color: var(--nd-ink); text-decoration: none;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
body.nd .ad_top_tabs_big a:hover { border-color: var(--nd-accent); box-shadow: var(--nd-shadow); }
body.nd .ad_top_tabs_big .img-spacer { flex: 0 0 64px; display: flex; align-items: center; justify-content: center; width: 64px; float: none; }
body.nd .ad_top_tabs_big img, body.nd .ad_top_tabs_big .img-spacer .pull_up { position: static; max-width: 100%; max-height: 44px; padding: 0; }
body.nd .ad_top_tabs_big a:hover img { animation: nd-tile-breath .4s ease-in-out; }
body.nd .ad_top_tabs_big :is(.text-spacer, .text-spacer-truck) { display: none; }
body.nd .ad_top_tabs_big :is(.text, .text-truck) { position: static; flex: 1 1 auto; min-width: 0; }
@media (max-width: 767px) {
  body.nd .ad_top_tabs_big { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}
/* Kalkulacky (kalkulacky_list.php): skupiny maju 8, 6, 5, 4, 5, 2 a 2 dlazdice. Na tablete 3 stlpce - ostane jedina
   osamela dlazdica (skupina 4); pri 4 stlpcoch od 992 px boli osamele dve (skupiny 5). Znacky /motodiely/ (13)
   ostavaju 5 + 5 + 3 a 7 + 6 - mensi pocet stlpcov by nechal osamelu, vacsi by nazvy nezmestil. */
@media (min-width: 768px) and (max-width: 1199px) {
  body.nd .kalk-group > .kalk-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ==== Lista Filter + Zoradit (08.10.2026) ====
   Zalozky triedenia (core/include/category_sort.php .sort-tabs) presuva blocks/nd_sort_js.php do okna tlacidla
   .nd-sort v liste #ntf-bar (vypis kategorie) alebo #pf-bar (TecDoc), bez filtra do vlastnej listy .nd-sortbar.
   Od tabletu je lista jeden sivy panel: vlavo Filter a rozbalovacie skupiny, vpravo Zoradit, pod nimi cipy.
   Na mobile ide do listy tlacidlo #cst-bar (trieda .nd-has-sort) - Filter a Zoradit su jeden riadok vedla seba,
   panel #cst-panel ostava. */
.nd-sort, .nd-sortbar { display: none; }
@media (min-width: 768px) {
  /* zalozky mimo okna len do prepnutia skriptom (koniec stranky) - lista by po nacitani poskocila */
  body.nd .sort-tabs { display: none; }
  body.nd.ntf-on #ntf-bar, body.nd #pf-bar, body.nd .nd-sortbar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 18px; padding: 8px;
    border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface-2);
  }
  /* bez filtra (len Zoradit) prazdny sivy panel nema zmysel - tlacidlo vpravo nad vypisom */
  body.nd .nd-sortbar { justify-content: flex-end; margin: 6px 0 14px; padding: 0; border: 0; border-radius: 0; background: none; }
  body.nd .nd-fbar__chips:not([hidden]) { margin-top: 2px; padding: 8px 2px 0; border-top: 1px solid var(--nd-line); }
  body.nd .nd-sort { display: block; position: relative; margin-left: auto; }
  body.nd .nd-sort[hidden] { display: none; }
  body.nd .nd-sort__btn {
    display: inline-flex; align-items: center; gap: 7px; height: 40px; margin: 0; padding: 0 12px 0 13px;
    border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface);
    font-size: var(--nd-fs-14-5); font-weight: 600; line-height: 1; color: var(--nd-ink); white-space: nowrap; cursor: pointer;
  }
  body.nd .nd-sort__btn:hover, body.nd .nd-sort.is-open > .nd-sort__btn { border-color: var(--nd-ink); }
  body.nd .nd-sort__btn .nd-ico { flex: none; color: var(--nd-muted); }
  body.nd .nd-sort__btn .nd-ico:last-child { transition: transform .15s; }
  body.nd .nd-sort.is-open > .nd-sort__btn .nd-ico:last-child { transform: rotate(180deg); }
  body.nd .nd-sort__l { font-weight: 500; color: var(--nd-muted); }
  /* lista sa nezmesti (Zoradit by sam spadol do noveho riadku): bez slova Zoradit:, ikonka a hodnota ostavaju,
     slovo ostava pre citacku (09.10.2026, blocks/nd_sort_js.php fit) */
  body.nd .nd-sort--short .nd-sort__l { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  body.nd .nd-sort__v { font-weight: 700; }
  body.nd .nd-sort__pop {
    position: absolute; top: calc(100% + 6px); right: 0; z-index: 60; min-width: 230px; padding: 6px;
    border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: var(--nd-shadow-lg);
  }
  body.nd .nd-sort__pop[hidden] { display: none; }
  body.nd .nd-sort__pop .sort-tabs { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; }
  body.nd .nd-sort__pop .sort-tabs .sort-tab, body.nd .nd-sort__pop .sort-tabs .sort-tab.active {
    display: flex; align-items: center; gap: 10px; width: 100%; margin: 0; padding: 9px 12px 9px 10px; border: 0;
    border-radius: var(--nd-r); background: transparent; font-size: var(--nd-fs-14-5); font-weight: 500; line-height: 1.2;
    text-align: left; color: var(--nd-ink-2);
  }
  body.nd .nd-sort__pop .sort-tabs .sort-tab:hover, body.nd .nd-sort__pop .sort-tabs .sort-tab:focus { background: var(--nd-surface-2); color: var(--nd-ink); }
  body.nd .nd-sort__pop .sort-tabs .sort-tab.active, body.nd .nd-sort__pop .sort-tabs .sort-tab.active:hover {
    background: var(--nd-accent-soft); font-weight: 700; color: var(--nd-ink);
  }
  body.nd .nd-sort__ck { flex: none; visibility: hidden; color: var(--nd-accent-ink); }
  body.nd .sort-tab.active .nd-sort__ck { visibility: visible; }
}
@media (max-width: 767px) {
  body.nd.ntf-on #ntf-bar.nd-has-sort, body.nd #pf-bar.nd-has-sort { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; }
  body.nd.ntf-on #ntf-bar.nd-has-sort .ntf-bar-btn { flex: 1.35 1 0; width: auto; min-width: 0; }
  body.nd .nd-has-sort #cst-bar { display: flex; flex: 1 1 0; min-width: 0; margin: 0; }
  body.nd .nd-has-sort .cst-bar-btn { flex-wrap: wrap; align-content: center; row-gap: 1px; width: 100%; padding-top: 5px; padding-bottom: 5px; }
  /* aktualne zoradenie ako napoveda pod nazvom (ako .ntf-bar-hint vedla), nie tmava bublina */
  body.nd .nd-has-sort .cst-bar-cur {
    flex: 0 0 100%; min-width: 0; padding: 0; overflow: hidden; border-radius: 0; background: none;
    font-size: var(--nd-fs-11); font-weight: 400; line-height: 1.1; color: inherit; opacity: .62; white-space: nowrap; text-overflow: ellipsis;
  }
  body.nd .nd-has-sort .ntf-bar-hint, body.nd .nd-has-sort .pf-bar-hint { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  /* TecDoc: Filtrovat, Kategorie a Zoradit v tretinach - uzsie odsadenie, nech ikonka ostane vedla nazvu */
  body.nd #pf-bar.nd-has-sort .pf-bar-btn, body.nd #pf-bar.nd-has-sort #cst-bar { flex: 1 1 0; min-width: 0; }
  body.nd #pf-bar.nd-has-sort .pf-bar-btn, body.nd #pf-bar.nd-has-sort .cst-bar-btn { gap: 6px; padding-left: 6px; padding-right: 6px; }
  /* pocet vybranych hodnot ako bublina v rohu (ako od tabletu) - v tretine sirky by zalomil nazov */
  body.nd #pf-bar.nd-has-sort #pf-bar-filter { position: relative; }
  body.nd #pf-bar.nd-has-sort .pf-bar-badge.on { position: absolute; top: -7px; right: -7px; box-shadow: 0 0 0 2px var(--nd-surface); }
}
@media (max-width: 374px) {
  body.nd #pf-bar.nd-has-sort .pf-ico, body.nd #pf-bar.nd-has-sort .cst-ico { display: none; }
}

/* ==== Obrazok kategorie vedla nadpisu (08.10.2026) ====
   default/files.php ul.files.files-2 (obrazok stranky vlavo od h1): polozka zoznamu ma zo stareho CSS odsadenie
   15 px, obrazok tak zacinal za lavym okrajom obsahu (drobky, lista filtra) a vlavo ostaval biely pruh.
   V nd zarovno s obsahom, nadpis hned za obrazkom. Landing page (napr. sviecky a45478) ma zoznam priamo v .mainContainer. */
body.nd .mainContainer > .clearfix > ul.files.files-2, body.nd .mainContainer > ul.files.files-2 { margin: 0 14px 12px 0; padding: 0; }
body.nd .mainContainer > .clearfix > ul.files.files-2 > li, body.nd .mainContainer > ul.files.files-2 > li { margin-left: 0; }
/* obrazky kategorii maju vacsinou biele pozadie a na sivej stranke posobili ako nalepeny vystrizok (13.10.2026):
   biela karta ako dlazdice podkategorii, obrazok cely vnutri (object-fit), rovnaky stvorec pri kazdom pomere stran.
   Len zmenseny obrazok (image_60) - plna velkost (files.php, size 0) ostava bez karty. */
body.nd .mainContainer > .clearfix > ul.files.files-2 img.image_60, body.nd .mainContainer > ul.files.files-2 img.image_60 {
  box-sizing: border-box; display: block; width: 112px; height: 112px; max-width: none; padding: 10px; object-fit: contain;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r); background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
}
@media (max-width: 767px) {
  body.nd .mainContainer > .clearfix > ul.files.files-2 img.image_60, body.nd .mainContainer > ul.files.files-2 img.image_60 { width: 88px; height: 88px; padding: 8px; }
}

/* ==== Ciernobiele loga na /autodiely/ a /motodiely/ (08.10.2026) ====
   Dlazdice znaciek z autodiely/show_brands.php (aj /autodiely-dodavky/ a nakladne auta). nd_brand_tiles_bw
   v bootstrap.php vymeni farebny gif za ciernobiele logo z garaze (trieda nd-brand-bw), box loga 60 px a karta
   ostavaju z bloku Autodiely vyssie. Znacka bez neho si necha gif s triedou nd-brand-gray a ten tu filter odfarbi.
   Bez gifu (cast motoriek, 404 aj v starom dizajne) ostava zastupna ikonka. */
body.nd ul.ad-brand-ul a.ad_brands_logos img.nd-brand-gray { filter: grayscale(1); }

/* ==== Popularne kategorie na stranke vozidla (08.10.2026) ====
   autodiely/show_parts.php .ad-catbox na stranke motorizacie (aj /autodiely-dodavky/ a s filtrom znacky dielov).
   Stefan: ako stary dizajn - mierne sive pozadie, ikonka pretrca cez ramik, nizsie dlazdice.
   old (respo/comco.css): #f5f5f5 so zltym prechodom, obrazok 140 px posunuty relative (left -50, top -13),
   li overflow hidden - ikonka je 7 px nad hornou hranou a 6 px za pravou, spodok orezany; viditelna dlazdica 91 px.
   nd: biele pozadie s tienom ako dlazdice podkategorii (13.10.2026, predtym --nd-surface-2 = farba stranky), obrazok absolutne v pravom hornom rohu 10 px nad hornou hranou a 6 px za pravou
   (mobil 8 a 4 px), cely viditelny (bez orezu spodku), text ma vpravo miesto pre obrazok. Vyska 72 px namiesto
   102 px (desktop, popis na jeden riadok), mobil 64 / 81 px namiesto 86 / 89 px. Vacsia medzera riadkov, aby
   ikonka nezasahovala do dlazdice nad sebou. Ramik, radius a hover (akcentovy ramik + tien) ostavaju z nd.
   Test: claude_notes/novy_dizajn_overenie/popular_categories_test.js */
body.nd .ad-catbox > ul.row { row-gap: 22px; margin-top: 14px; }
body.nd .ad-catbox .ad-catbox-inner, body.nd .ad-catbox .ad-catbox-inner:hover {
  position: relative; min-height: 72px; padding: 11px 112px 11px 16px; background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
}
body.nd .ad-catbox a:hover .ad-catbox-inner { box-shadow: var(--nd-shadow); }
body.nd .ad-catbox .ad-catbox-inner > .row > .image { position: absolute; top: -11px; right: -7px; width: auto; }
body.nd .ad-catbox .image img { width: 104px; height: 80px; max-width: none; max-height: none; margin: 0; object-fit: contain; }
/* hover: obrazok sa raz nadychne ako na dlazdiciach podkategorii (@keyframes nd-tile-breath pri .pagegallery) */
body.nd .ad-catbox a:hover .image img { animation: nd-tile-breath .4s ease-in-out; }
@media (max-width: 767px) {
  body.nd .ad-catbox > ul.row { row-gap: 18px; }
  body.nd .ad-catbox .ad-catbox-inner, body.nd .ad-catbox .ad-catbox-inner:hover { min-height: 64px; padding: 8px 92px 8px 14px; }
  body.nd .ad-catbox .ad-catbox-inner > .row > .image { top: -9px; right: -5px; }
  body.nd .ad-catbox .image img { width: 83px; height: 64px; }
  body.nd .ad-catbox ul li a span { line-height: 1.3; }
  body.nd .ad-catbox ul li a span.cathead { margin-bottom: 3px; }
}

/* ==== Lepiaca lista filtra pod hlavickou (08.10.2026) ====
   mobil: hlavicka sa pri posune hore vrati (nd_header_js.php, z-index 1000) a listu s top 0 prekryla - Filter ani
   Filtrovat sa nedali tuknut. Lista sa lepi pod jej viditelny spodok (--nd-hdr-vis, 0 pri skrytej) a ide s nou. */
@media (max-width: 767px) {
  body.nd.ntf-on #ntf-bar, body.nd #pf-bar { top: var(--nd-hdr-vis, 0px); transition: top .25s ease; }
}

/* ==== Obrazky v popisoch stranok (08.10.2026) ====
   Clanky, landing pages a kategorie nemaju v nd lavy stlpec, popis je siroky 1140 px namiesto 848 px v starom
   dizajne. Obrazky so sirkou v percentach (inline width 100 %, landing .media-left img 80 %) sa preto nafukli nad
   svoju velkost: spojka a811 fotka 800 px na 912 px, fotky v clankoch 600 - 1000 px na 1140 px.
   Strop 848 px = stlpec obsahu starej verzie; obrazok nad odsekom na landing pages 400 px. Na mobile sa zmeni len
   obrazok s pevnou sirkou nad sirku stlpca - uz nepretieka (100 %). :where() drzi specificitu na nule, takze
   kazde pravidlo s vlastnym max-width (nahlady priloh, karty, galeria) vyhra a strop doplni len obrazky bez neho.
   Obrazok s atributmi width aj height (napr. width 425 height 283 na clanku o Ferrari) by po zuzeni na mobile
   ostal s pevnou vyskou a zdeformoval sa, preto height auto - pomer stran ostava. Banner znacky (/files/brand-header/
   v kratkom popise brand landing pages) ide dalej na celu sirku. */
:where(body.nd .mainContainer img:not([src*="/brand-header/"]), body.nd .landing_description img) { max-width: min(100%, 848px); }
:where(body.nd .mainContainer img[width][height]:not([src*="/brand-header/"]), body.nd .landing_description img[width][height]) { height: auto; }
body.nd .productListSingle .media .media-left img { max-width: min(80%, 400px); }

/* ==== Prilepeny pas s vybratym autom (COMCO-74, 08.10.2026) ====
   Stefan: modry pas auta nech je prilepeny pod menu aj pri scrolovani. Slot #car-bar (core/include/car_bar.php,
   template/default/layout.php) je priamy potomok body bez predka s overflow alebo transform, sticky preto drzi az po
   patu. Desktop: pod prilepenym navigacnym pasom (--nd-nav-bot, blocks/nd_header_js.php). Mobil: pod viditelnym
   spodkom hlavicky (--nd-hdr-vis, 0 pri skrytej), pri skryvani a vracani hlavicky ide s nou.
   Prilepeny stav (.nd-car-stuck), vysku pasu pre listy filtra (--nd-car-h, 0 bez auta aj tam, kde sa pas nelepi)
   a scroll-padding pre kotvy a scrollIntoView (--nd-scroll-pad na html) nastavuje blocks/nd_car_bar_js.php.
   Vrstvy: hlavicka 1000 > menu 990 > pas 980 > #pf-bar 900 > #ntf-bar 50; mega menu Vyber tovaru, nasepkavac,
   kosik, spodna lista a panely filtra su nad pasom. */
html { scroll-padding-top: var(--nd-scroll-pad, 0px); }
body.nd #car-bar { position: sticky; top: var(--nd-hdr-vis, 0px); z-index: 980; transition: top .25s ease; }
body.nd #car-bar .nd-car-x { display: none; }
@media (min-width: 768px) {
  body.nd #car-bar { top: var(--nd-nav-bot, var(--nd-hdr-vis, 0px)); transition: none; }
  body.nd #car-bar.nd-car-stuck .car-bar { box-shadow: 0 4px 10px -6px rgba(20,24,29,.25); }
}
@media (max-width: 767px) {
  /* rozbalene tlacidla su okno nad obsahom, nie v toku stranky: pas nemeni vysku, obsah ani lista filtra
     neposkocia (iOS Safari nevie scroll anchoring). width auto - .container by inak pretiekol o 15 px.
     Zatvori ho x v okne, tuknutie mimo pasu, Esc alebo znova pas (nd_car_bar_js.php, front.js). */
  body.nd #car-bar .car-bar { position: relative; }
  body.nd #car-bar .car-bar.is-open .car-bar__in {
    position: absolute; top: calc(100% + 6px); left: 15px; right: 15px; z-index: 1; width: auto; margin: 0; padding: 10px 40px;
    max-height: calc(100vh - var(--nd-hdr-vis, 0px) - var(--nd-car-h, 0px) - 72px); overflow-y: auto; box-shadow: var(--nd-shadow-lg);
  }
  /* pas je cela modra lista na celu sirku ako na pocitaci - od 13.10.2026 vzdy (Stefan: nech je na celu sirku stale,
     nie len pri odscrolovani), do vtedy bol hore na stranke cip a lista len v prilepenom stave (.nd-car-stuck, ten
     uz pridava len tien). Vyska 41 px ako cip s odsadenim (8 + 33). Text cipu v liste so skratenim,
     sipka znaci rozbalenie, vpravo x na zrusenie auta. */
  body.nd #car-bar .car-bar {
    padding: 0; background: #e9f1fc; text-align: left; box-shadow: inset 0 -1px 0 #cfe0f6;
  }
  body.nd #car-bar.nd-car-stuck .car-bar { box-shadow: inset 0 -1px 0 #cfe0f6, 0 4px 10px -6px rgba(20,24,29,.25); }
  body.nd #car-bar .car-bar__chip {
    display: flex; gap: 8px; width: 100%; max-width: none; height: 41px; margin: 0; padding: 0 48px 0 15px;
    border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: var(--nd-fs-12-5); text-align: left;
  }
  body.nd #car-bar .car-bar__chip > .fa { flex: none; }
  body.nd #car-bar .car-bar__chip-label { flex: 0 1 auto; min-width: 0; }
  body.nd #car-bar .car-bar__chip::after {
    content: ""; flex: none; margin-left: auto; border: 5px solid transparent; border-bottom-width: 0; border-top-color: #6b7178;
    transition: transform .15s;
  }
  body.nd #car-bar .car-bar.is-open .car-bar__chip::after { transform: rotate(180deg); }
  /* zo zatvoreneho .car-bar__in ostane v liste len x (zrusit auto), ostatne je az v rozbalenom okne */
  body.nd #car-bar .car-bar:not(.is-open) .car-bar__in {
    display: flex; position: absolute; top: 0; right: 0; width: auto; height: 41px; margin: 0; padding: 0; border: 0; background: none;
  }
  body.nd #car-bar .car-bar:not(.is-open) .car-bar__in > :not(.car-bar__actions),
  body.nd #car-bar .car-bar:not(.is-open) .car-bar__actions > :not(.car-bar__clear) { display: none; }
  body.nd #car-bar .car-bar:not(.is-open) .car-bar__actions { margin: 0; }
  body.nd #car-bar .car-bar:not(.is-open) .car-bar__clear {
    display: flex; align-items: center; justify-content: center; width: 44px; height: 41px; padding: 0;
  }
  /* rozbalene okno (13.10.2026, Stefan: x v okne rusilo cele auto, logicke je zbalit okno): x vpravo hore okno len
     zbali (.nd-car-x, vklada nd_car_bar_js.php), auto rusi textove tlacidlo Zrusit auto - to iste .car-bar__clear
     (front.js), ktore v zatvorenej liste ostava ako x. Na pocitaci sa nic nemeni, okno tam nie je. */
  body.nd #car-bar .car-bar.is-open .nd-car-x {
    display: flex; align-items: center; justify-content: center; position: absolute; top: 2px; right: 2px; width: 40px; height: 40px;
    padding: 0; border: 0; border-radius: var(--nd-r); background: none; color: #6b7178; font-size: 17px; line-height: 1;
  }
  body.nd #car-bar .car-bar.is-open .nd-car-x:hover, body.nd #car-bar .car-bar.is-open .nd-car-x:focus-visible { color: #26282b; }
  body.nd #car-bar .car-bar.is-open .car-bar__clear {
    display: inline-flex; align-items: center; padding: 6px 4px; color: var(--nd-danger); font-size: 13px; font-weight: 600; line-height: 1.3;
  }
  body.nd #car-bar .car-bar.is-open .car-bar__clear:hover { text-decoration: underline; }
  body.nd #car-bar .car-bar.is-open .car-bar__clear > .fa { display: none; }
  body.nd #car-bar .car-bar.is-open .car-bar__clear::after { content: "Zrušiť auto"; }
  /* vysunute okno: vsetky texty o stupen vacsie (Stefan 13.10.2026), pas samotny bez zmeny */
  body.nd #car-bar .car-bar.is-open .car-bar__name { font-size: 14.5px; }
  body.nd #car-bar .car-bar.is-open .car-bar__detail { font-size: 13px; }
  body.nd #car-bar .car-bar.is-open .car-bar__btn { font-size: 13.5px; }
  body.nd #car-bar .car-bar.is-open .car-bar__engine, body.nd #car-bar .car-bar.is-open .car-bar__btn--muted { font-size: 14.5px; }
  body.nd #car-bar .car-bar.is-open .car-bar__clear { font-size: 15px; }
  /* listy Filter (#ntf-bar) a Filtrovat (#pf-bar) sa lepia pod pas */
  body.nd.ntf-on #ntf-bar, body.nd #pf-bar { top: calc(var(--nd-hdr-vis, 0px) + var(--nd-car-h, 0px)); }
}
/* nizke okno (telefon na sirku): hlavicka s menu tam zaberaju tretinu vysky, pas sa nelepi */
@media (max-height: 500px) {
  body.nd #car-bar { position: static; }
}

/* ==== Typ vozidla vo formulari landing pages (COMCO-74, template/nd/vehicle_form.php) ==== */
/* typ, pre ktory kategoriu nemame: select2 ho v ponuke necha zasedly, vybrat sa neda (disabled) */
body.nd .select2-results__option[aria-disabled="true"]:has(> .nd-vf-off) { color: var(--nd-muted); cursor: not-allowed; }
body.nd #td_select_car_form select.td_type_id option:disabled { color: var(--nd-muted); }

/* ==== Tlacidlo Hladaj vo formulari landing pages (COMCO-74, template/nd/vehicle_form.php) ==== */
/* Stefan: tlacidlo vpravo nie, v strede. Od 992 px vlastny riadok pod styrmi polami, v strede formulara a siroke ako
   jedno pole: mriezka ma 4 stlpce, pole zabera 2, tlacidlo 2 stredne. Pod 992 px su polia pod sebou a tlacidlo je
   na celu sirku ako doteraz (col-xs-12). Plati len pre formular nd_vehicle_form (form.nd-vf), A aj B. */
@media (min-width: 992px) {
  body.nd #td_select_car_form.nd-vf .landing-page-form-box > .row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.nd #td_select_car_form.nd-vf .landing-page-form-box > .row > .nd-vf-field { grid-column: span 2; }
  body.nd #td_select_car_form.nd-vf .landing-page-form-box > .row > .nd-vf-submit:has(> #ad-frm-button) { grid-column: 2 / span 2; margin-top: 4px; }
}

/* ==== Pas Vozidlo sa vysuva z pasu auta (COMCO-74, 08.10.2026) ====
   Stefan: v modrej liste auta Zmenit motor a Ine auto malicko blizsie k sebe, po kliknuti sa vysunie pas Vozidlo
   (formular .ad-select-form, autodiely/show_select_form.php), inak je skryty.
   Skryty je len v katalogu TecDoc (Vozidlo v #ad-column-left) a len ked je na stranke pas auta s tymito tlacidlami
   (#car-bar .car-bar). Media scripting: bez JS ostava Vozidlo viditelne a tlacidla su odkazy ako doteraz.
   Vysuva ho blocks/nd_car_bar_js.php (trieda .nd-veh-open): okno pevne hned pod pasom auta (--nd-veh-top, -left,
   -w, -maxh nastavuje skript a drzi ho pod pasom aj pri skryvani a vracani hlavicky na mobile). Vrstva 979 - pod
   pasom auta (980), nad listami filtra (#pf-bar 900, #ntf-bar 50). Zasunie ho druhy klik, x v okne, Esc a klik mimo.
   Na mobile su tlacidla v rozbalenom cipe, ten sa pri vysunuti zatvori; tuknutie na cip vysunute Vozidlo zasunie. */
body.nd #car-bar .car-bar__engine { padding-right: 8px; }
body.nd #car-bar .car-bar__engine + .car-bar__btn--muted { margin-left: -4px; padding-left: 8px; }
@media (max-width: 767px) {
  /* rozbaleny cip: Zmenit motor, Ine auto? a x spolu v druhom riadku (inak sa Ine auto? zalomilo samo pod ostatne) */
  body.nd #car-bar .car-bar.is-open .car-bar__actions::after { content: ""; flex-basis: 100%; order: 1; height: 0; }
  body.nd #car-bar .car-bar.is-open .car-bar__engine, body.nd #car-bar .car-bar.is-open .car-bar__btn--muted,
  body.nd #car-bar .car-bar.is-open .car-bar__clear { order: 2; }
}
@media (scripting: enabled) {
  body.nd:has(#car-bar .car-bar) #ad-column-left > .ad-car-select:has(.ad-select-form):not(.nd-veh-open) { display: none; }
}
/* mimo katalogu (12.10.2026; Stefan: modal nech vyskakuje vzdy, nie presmerovanie na autodiely): ten isty panel Vozidlo
   stiahne nd_car_bar_js.php z /ajax/nd_vehicle_band.php do hostitela #nd-veh-host hned za slotom pasu auta. Hostitel
   neposuva layout (vyska 0), zasunuty panel je v nom vzdy skryty (vklada ho len JS), vysunuty je fixed okno ako v katalogu. */
body.nd #nd-veh-host { height: 0; }
body.nd #nd-veh-host > .ad-car-select.panel:not(.nd-veh-open) { display: none; }
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open {
  position: fixed; top: var(--nd-veh-top, 0px); left: var(--nd-veh-left, 15px); z-index: 979; width: var(--nd-veh-w, calc(100% - 30px));
  max-height: var(--nd-veh-maxh, none); margin: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain;
  border-top-left-radius: 0; border-top-right-radius: 0;
  box-shadow: var(--nd-shadow-lg); animation: nd-veh-in .3s cubic-bezier(.4, 0, .2, 1);
}
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open > .panel-heading { border-top-left-radius: 0; border-top-right-radius: 0; }
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open.nd-veh-out { animation: nd-veh-out .2s ease-in forwards; pointer-events: none; }
/* vysunie sa spod pasu auta: posun o celu vysku a orezanie nad hornou hranou okna (tien ostava).
   09.10.2026 Stefan: horne rohy nezaoblene (prilieha k pasu auta) a nech sa zhora postupne vysunie, ale rychlo -
   0.3 s, plynulo zrychli a spomali (predtym .22s ease-out bol za ~80 ms takmer cely vonku a posobil ako skok); bezi aj pri
   prefers-reduced-motion (Windows s vypnutymi animaciami ho inak nevidel vobec), je to kratky posun bez opakovania. */
@keyframes nd-veh-in {
  from { transform: translateY(-100%); clip-path: inset(100% -40px -40px -40px); }
  to { transform: none; clip-path: inset(0 -40px -40px -40px); }
}
@keyframes nd-veh-out {
  from { transform: none; clip-path: inset(0 -40px -40px -40px); }
  to { transform: translateY(-100%); clip-path: inset(100% -40px -40px -40px); }
}
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select > .nd-veh-close { display: none; }
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open > .nd-veh-close {
  display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; width: 44px; height: 44px;
  margin: 0; padding: 0; border: 0; border-radius: 0; background: none; font-size: 26px; line-height: 1; color: var(--nd-ink-2); cursor: pointer;
}
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open > .nd-veh-close:hover,
body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open > .nd-veh-close:focus-visible { background: var(--nd-surface-2); color: var(--nd-ink); }
@media (min-width: 768px) {
  /* desktop: x je posledna polozka riadku Vozidlo | vybery | Zmenit | x */
  body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open > .nd-veh-close { position: static; flex: 0 0 48px; height: auto; border-left: 1px solid var(--nd-line); }
}
@media (max-width: 767px) {
  body.nd :is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open > .panel-heading { padding-right: 48px; }
}
/* plavajuci chat (.bp-load, vrstva 99998) v nizkom okne prekryl x a spodok vysunuteho Vozidla - kym je vysunute,
   je skryty (ako pri otvorenom kosiku, body.nd-lock) */
body.nd:has(:is(#ad-column-left, #nd-veh-host) > .ad-car-select.nd-veh-open) .bp-load { visibility: hidden; }

/* ==== Kategorie dielov prve, pas typov vozidiel pod produktmi (08.10.2026) ====
   Lista #pf-bar nad TecDoc vypisom (autodiely/tecdoc_facets/facet_render.php, poradie a nazov z nd_pf_bar_buttons
   v bootstrap.php): Kategorie dielov su vzdy prve a ako jedine tmave (s ikonou mriezky) - je to vyber kategorie,
   nie filter. Filtrovat je obrysove ako ostatne ovladace filtra (rozbalovacky, Zoradit) a od tabletu ho od
   Kategorii oddeluje zvisla ciara. Na mobile sa nazov zalomi na dva riadky vedla ikonky.
   Pas typov vozidiel (.ad_top_tabs) je za obsahom v .nd-ad-tabs-below (autodiely/autodiely.php, nd_ad_tabs_below
   v bootstrap.php) - od 09.10.2026 na vsetkych strankach katalogu, nielen na vypise dielov. */
body.nd #pf-bar #pf-bar-cats { border-color: var(--nd-ink); background: var(--nd-ink); color: #fff; }
body.nd #pf-bar #pf-bar-cats:hover { border-color: var(--nd-dark); background: var(--nd-dark); color: #fff; }
@media (min-width: 768px) {
  body.nd #pf-bar #pf-bar-filter { border-color: var(--nd-ink); background: var(--nd-surface); color: var(--nd-ink); }
  body.nd #pf-bar #pf-bar-filter:hover { background: var(--nd-surface-2); }
  /* ciara je na Filtrovat vlavo (presah dolava nerozsiruje scrollWidth tlacidla), Filtrovat uz position: relative ma */
  body.nd #pf-bar #pf-bar-cats + #pf-bar-filter { margin-left: 9px; }
  body.nd #pf-bar #pf-bar-cats + #pf-bar-filter::before {
    content: ""; position: absolute; top: 6px; bottom: 6px; left: -10px; width: 1px; background: var(--nd-line); pointer-events: none;
  }
  body.nd #ad-column-right > .nd-ad-tabs-below { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--nd-line); }
}
@media (max-width: 767px) {
  body.nd #pf-bar #pf-bar-cats { flex-wrap: nowrap; line-height: 1.15; }
}

/* ==== Kompletny zoznam kategorii na konci stranky auta (09.10.2026) ====
   Stefan: text „« « « Kompletny zoznam autodielov na Vase auto najdete v lavom stlpci.“ (stranka auta =
   koren stromu, autodiely/show_parts.php) vyhodit a do stredu dat cierne tlacidlo, ktore otvori bocny panel
   s kategoriami ako Kategorie dielov nad obsahom (nd_parts_cats_button v bootstrap.php - klikne na #pf-bar-cats).
   Vzhlad ako Kategorie dielov (tmave, ikona mriezky). Bez listy #pf-bar na stranke by nic neotvorilo - skryte. */
body.nd .nd-cats-all { display: flex; justify-content: center; margin: 28px 0 24px; }
body.nd .nd-cats-all__btn {
  display: inline-flex; align-items: center; gap: 8px; height: 44px; margin: 0; padding: 0 22px;
  border: 1px solid var(--nd-ink); border-radius: var(--nd-r); background: var(--nd-ink);
  font-family: inherit; font-size: var(--nd-fs-15); font-weight: 600; line-height: 1; color: #fff; white-space: nowrap; cursor: pointer;
}
body.nd .nd-cats-all__btn:hover, body.nd .nd-cats-all__btn:focus-visible { border-color: var(--nd-dark); background: var(--nd-dark); color: #fff; }
body.nd:not(:has(#pf-bar-cats)) .nd-cats-all { display: none; }

/* ---- Citajte viac / Skryt popis bez bieleho pasu (template/default/page.php, 13.10.2026) ----
   Stary dizajn dava obalom .citajte_viac_wrapper a .citajte_menej_wrapper biele pozadie cez celu sirku obsahu
   (respo/css/comco.css). V nd je stranka siva (--nd-surface-2), takze pod zbalenym popisom ostal biely pas.
   Prechod zbaleneho popisu robi mask-image do priehladna (.description_wrapper.collapsed), splyva s farbou
   stranky sam - staci zrusit pozadie obalu, tlacidlo ostava v strede. Stranky: kategorie s dlhym popisom
   (napr. castrol-a323, autochemia-autokozmetika-a406), Kosik a Objednavka (page_basket, page_order). */
body.nd .citajte_viac_wrapper, body.nd .citajte_menej_wrapper { background: transparent; }

/* ---- Objednavka: radio a checkbox na strede prveho riadku labelu (template/default/order.php, 13.10.2026) ----
   Stary dizajn posuva .form.order .checkbox (float) natvrdo o top 3px (respo/css/comco.css), co sedi len na riadok
   18px. V nd ma label vacsie pismo aj riadok (15px / 22.5px, na mobile zdedenych 32.64px z .panel-body .input 1.7em)
   a ako inline-block sedi na zakladnej ciare riadku obalu s inym pismom, takze radio bolo o 3.5 px (desktop) az
   7 px (mobil) vyssie nez text. Label dostane presnu vysku riadku a vertical-align top (prvy riadok zacina hore
   v obale), radio posun (vyska riadku - velkost radia) / 2 - plati aj pre dvojriadkovy label a label s cenou.
   Doprava: tabulka .delivery_tr (radio a label v roznych bunkach, bunka labelu mala vertical-align middle),
   platba: .delivery_tr_p, checkboxy Rovnaka s fakturacnou adresou, Vytvorit konto, Newsletter: input.checkbox
   + label.label-inline. Suhlasy (opt_in, dotaznik_confirm) a Objednat na firmu sedia, tie sa nemenia. */
body.nd #order_form { --nd-opt-fs: var(--nd-fs-14-5); --nd-opt-lh: 1.5; --nd-opt-box: 18px; } /* radio aj checkbox maju vlastny vzhlad 18 px (bloky Radio a Checkbox na konci) */
body.nd #order_form :is(.delivery, .payment) { --nd-opt-fs: var(--nd-fs-15); }
body.nd #order_form .delivery_tr > td { vertical-align: top; }
body.nd #order_form :is(.delivery_tr label, input.checkbox ~ label).label-inline {
  font-size: var(--nd-opt-fs); line-height: var(--nd-opt-lh); vertical-align: top;
}
body.nd #order_form input.checkbox:is([type=radio], [type=checkbox]) {
  width: var(--nd-opt-box); height: var(--nd-opt-box); top: calc((var(--nd-opt-lh) * var(--nd-opt-fs) - var(--nd-opt-box)) / 2);
}
/* platba: radio a text na jednom riadku aj pri dlhom nazve (14.10.2026). Label je inline-block vedla floatu radia
   a ked sa text nezmesti do zvysku riadku (Platba kartou, V hotovosti / kartou na predajni na 1024 px), cely label
   spadne pod radio. Flex: radio pevne, label berie zvysok a zalomi sa vo vnutri; nbsp medzi nimi ostava ako medzera.
   Test: tablet_cart_order_test.js (radio na riadku textu), order_radio_align_test.js (stred na prvom riadku). */
body.nd #order_form .delivery_tr_p { display: flex; align-items: flex-start; }
body.nd #order_form .delivery_tr_p > input.checkbox { float: none; flex: none; }
body.nd #order_form .delivery_tr_p > .label-inline { flex: 1 1 0; width: auto; min-width: 0; }

/* ---- Radio: jednotny vzhlad vsetkych viditelnych radii v nd (13.10.2026) ----
   Kruh 18 px, biely, sivy ramik; hover zlaty ramik; vybrane = zlaty ramik 2 px a tmava bodka 8 px (zlto-cierna ako
   znacka), focus z klavesnice = svetlozlty prstenec, disabled = priehladne a bez hoveru. Bodka je vnutorny tien
   (inset 3 px farby pozadia na tmavom pozadi), takze je ostra v Chromiu aj Firefoxe.
   Kde su radia (inventar 13.10.2026): objednavka doprava .delivery_tr a platba .delivery_tr_p (template/default/
   order.php), filter Dostupnost vo vypise TecDoc #parts-filter .pf-opt a v kategorii #ntf-filter .ntf-opt (aj kopia
   v rozbaleni .nd-fdd__pop), suhlas so zmenami objednavky .customer_disagree_option (core/include/helpers.php),
   formulare simpleform.js. Skryte radio delivery_0 (display none) sa nemeni - pravidlo nemeni display.
   Vynimka: trieda nd-radio-native (alebo sr-only, visually-hidden) necha radio tak, ako je - pre buduce radia
   skryte pod vlastnym vzhladom labelu (zalozky, dlazdice, hviezdicky).
   Okraj a vertical-align maju nulovu specificitu (:where), aby vyhrali existujuce rozlozenia (gap vo filtroch,
   float v objednavke). Rozmer 18 px: objednavka cez --nd-opt-box (blok vyssie), filtre maju 17 px s id -
   prebite nizsie. Checkboxy sa nemenia. */
:where(body.nd) input[type=radio] { margin: 0 8px 0 0; vertical-align: -4px; }
body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden) {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  box-sizing: border-box; width: 18px; height: 18px; flex: 0 0 auto; padding: 0;
  border: 1.5px solid var(--nd-muted-2); border-radius: 50%; background: var(--nd-surface); box-shadow: none;
  color: var(--nd-ink); cursor: pointer; outline: none;
  transition: border-color .15s, border-width .15s, background-color .15s, box-shadow .15s;
}
body.nd :is(#parts-filter .pf-opt, #ntf-filter .ntf-opt, .nd-fdd__pop .pf-opt, .nd-fdd__pop .ntf-opt) input[type=radio]:not(.nd-radio-native) {
  width: 18px; height: 18px;
}
body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden, :disabled):is(:hover, label:hover > *, label:hover *),
body.nd :is(.delivery_tr, .delivery_tr_p):has(label:hover) input[type=radio]:not(.nd-radio-native, :disabled) {
  border-color: var(--nd-accent);
}
body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden):checked {
  border: 2px solid var(--nd-accent); background: var(--nd-ink); box-shadow: inset 0 0 0 3px var(--nd-surface);
}
body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden):focus-visible {
  outline: none; border-color: var(--nd-accent); box-shadow: 0 0 0 3px var(--nd-accent-soft);
}
body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden):checked:focus-visible {
  box-shadow: inset 0 0 0 3px var(--nd-surface), 0 0 0 3px var(--nd-accent-soft);
}
body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden):disabled { opacity: .45; cursor: not-allowed; }
/* objednavka: vypnuty riadok .order-opt-off uz ma opacity .5 (respo/css/comco-templates.css), radio by bolo dvakrat bledsie */
body.nd .order-opt-off input[type=radio]:disabled { opacity: 1; }
/* vysoky kontrast (Windows): tiene sa nekreslia, bodka by zmizla - natyvne radio */
@media (forced-colors: active) {
  body.nd input[type=radio]:not(.nd-radio-native, .sr-only, .visually-hidden) { -webkit-appearance: radio; appearance: auto; }
}

/* ---- Checkbox: jednotny vzhlad vsetkych viditelnych checkboxov v nd, rovnako ako blok Radio (13.10.2026) ----
   Stvorec 18 px, rohy 4 px, biely, sivy ramik; hover zlaty ramik (aj cez label - obalujuci, nasledujuci za
   checkboxom alebo v susednej bunke tabulky); zaskrtnuty = zlaty ramik 2 px a tmava fajka (SVG v pozadi, farba
   --nd-ink natvrdo, premenna sa do data URI vlozit neda); neurcity stav = vodorovna ciarka; focus z klavesnice =
   svetlozlty prstenec; disabled = priehladne a bez hoveru; vysoky kontrast = natyvny checkbox.
   Kde su checkboxy (inventar 13.10.2026): objednavka - Rovnaka s fakturacnou adresou, Vytvorit konto, Newsletter
   (input.checkbox, rozmer a posun cez --nd-opt-box v bloku Objednavka vyssie), suhlasy opt_in a dotaznik_confirm
   (tabulka .table-order-confirm), Objednat na firmu; registracia a nastavenia uctu (customer_settings.php);
   filtre vo vypise TecDoc #parts-filter .pf-opt a v kategorii #ntf-filter .ntf-opt aj kopia v .nd-fdd__pop
   (17 px s id - prebite nizsie); suhlas v okne newsletter a strazny pes (.newsletter-checkbox, .watchdog-checkbox).
   Kosik, prihlasenie, titulka, paticka, menu ani zasuvky .nd-drawer checkbox nemaju.
   Vynimky: prepinace cookie listy .c-tgl (vlastny vzhlad cez label, skryte), trieda nd-checkbox-native (alebo
   sr-only, visually-hidden) - pre buduce checkboxy skryte pod vlastnym vzhladom labelu (prepinace, dlazdice).
   Pravidlo nemeni display ani opacity, skryte checkboxy ostavaju skryte. Okraj a vertical-align ako pri radiu
   s nulovou specificitou (:where), existujuce rozlozenia (gap vo filtroch, float v objednavke) vyhravaju. */
:where(body.nd) input[type=checkbox]:where(:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden)) { margin: 0 8px 0 0; vertical-align: -4px; }
/* ramik cez premenne --nd-cb-bw a --nd-cb-bc: stavy (hover, zaskrtnuty, focus) menia len premenne, takze ich
   prevezme aj prebitie s id nizsie (okna newsletter a strazny pes) */
body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden) {
  --nd-cb-bw: 1.5px; --nd-cb-bc: var(--nd-muted-2);
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  box-sizing: border-box; width: 18px; height: 18px; flex: 0 0 auto; padding: 0;
  border: var(--nd-cb-bw) solid var(--nd-cb-bc); border-radius: 4px; box-shadow: none;
  background-color: var(--nd-surface); background-image: none; background-repeat: no-repeat; background-position: center; background-size: 14px 14px;
  color: var(--nd-ink); cursor: pointer; outline: none;
  transition: border-color .15s, border-width .15s, background-color .15s, box-shadow .15s;
}
body.nd :is(#parts-filter .pf-opt, #ntf-filter .ntf-opt, .nd-fdd__pop .pf-opt, .nd-fdd__pop .ntf-opt) input[type=checkbox]:not(.nd-checkbox-native) {
  width: 18px; height: 18px;
}
body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden, :disabled):is(:hover, label:hover *, :has(+ label:hover)),
body.nd tr:has(> td > label:hover) > td > input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, :disabled) {
  --nd-cb-bc: var(--nd-accent);
}
body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden):checked {
  --nd-cb-bw: 2px; --nd-cb-bc: var(--nd-accent);
  background-image: url('data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 14 14%27%3E%3Cpath d=%27M3.2 7.3 5.9 10l5-5.6%27 fill=%27none%27 stroke=%27%2326282b%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E');
}
body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden):indeterminate {
  --nd-cb-bw: 2px; --nd-cb-bc: var(--nd-accent);
  background-image: linear-gradient(var(--nd-ink), var(--nd-ink)); background-size: 8px 2px;
}
body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden):focus-visible {
  --nd-cb-bc: var(--nd-accent); outline: none; box-shadow: 0 0 0 3px var(--nd-accent-soft);
}
body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden):disabled { opacity: .45; cursor: not-allowed; }
/* okna newsletter a strazny pes (blocks/footer_tail.php, watchdog_form.php): comco.css #newsletter-form input
   (s id) dava sive pozadie, sivy ramik 1 px a padding 4 px; label suhlasu ma position relative a top 6 px,
   text bol o 4.5 px (desktop) az 6 px (mobil) nizsie nez checkbox */
body.nd :is(#newsletter-form, #watchdog-form, #vinbox-form) input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden) {
  padding: 0; border: var(--nd-cb-bw) solid var(--nd-cb-bc); background-color: var(--nd-surface);
}
body.nd :is(#newsletter-form, #watchdog-form) :is(.newsletter-checkbox-label, .watchdog-checkbox-label) { top: 0; }
/* registracia a nastavenia uctu (template/default/customer_settings.php): za Rovnaka s fakturacnou adresou je
   v HTML nbsp a medzera - bez okraja je odstup k textu ako pri Newsletteri; suhlas v bunke .cust-optin-check
   bol o 2 az 2.5 px nizsie nez prvy riadok textu */
body.nd form.customer #shipping_as_billing { margin-right: 0; }
body.nd .cust-optin-check > input[type=checkbox] { vertical-align: -2px; }
/* vysoky kontrast (Windows): pozadie sa nekresli, fajka by zmizla - natyvny checkbox */
@media (forced-colors: active) {
  body.nd input[type=checkbox]:not(.c-tgl, .nd-checkbox-native, .sr-only, .visually-hidden) { -webkit-appearance: checkbox; appearance: auto; }
}

/* ---- Objednavka: hlaska v paneli Platba (13.10.2026) ----
   Ked zakaznik vyberie dopravu, ktora vybratu platbu nepripusta, front.js platbu odznaci a do .nd-pay-hint
   (role status, vytvara ho front.js len v nd nad zoznamom platieb) napise preco. Prazdny kontajner sa nezobrazuje.
   Jemne upozornenie: svetlozlte pozadie, zlaty pruh vlavo, bezna farba textu; text sa lame, na mobile nepretecie. */
body.nd .nd-pay-hint {
  display: flex; align-items: flex-start; gap: 8px; margin: 0 0 12px; padding: 8px 12px;
  background: var(--nd-accent-soft); border-left: 3px solid var(--nd-accent); border-radius: var(--nd-r);
  color: var(--nd-ink); font-size: var(--nd-fs-14); line-height: 1.45; overflow-wrap: anywhere;
}
body.nd .nd-pay-hint:empty { display: none; }
body.nd .nd-pay-hint .fa { flex: 0 0 auto; color: var(--nd-accent-ink); font-size: 16px; line-height: inherit; }
body.nd .nd-pay-hint span { min-width: 0; }

/* ---- Objednavka: poznamka o zaokruhleni hotovosti pod nazvom platby (17.10.2026) ----
   Pri dobierke a platbe pri osobnom odbere (helpers_payment_is_cash) je v labeli platby div.payment-cash-note
   (order.php, order_payment.php): maly sivy text pod nazvom a cenou, nie tucny. Klik na nu vyberie platbu ako klik
   na nazov; vypnuta platba (order-opt-off) ju stlmi spolu s nazvom. */
body.nd .payment .payment-cash-note {
  margin-top: 2px; color: var(--nd-muted); font-size: var(--nd-fs-13); line-height: 1.4; font-weight: 400;
}

/* ---- Objednavka: suhrn v bielej karte ako panely nad nim (13.10.2026) ----
   Stefan: zoznam produktov, sucty a celkova cena sedeli priamo na sivej stranke (--nd-surface-2), sucty mali
   to iste sive pozadie. Karta = div.basket (ramik --nd-line, zaoblenie --nd-r-lg, bez tiena ako #order_form .panel),
   riadok hlavicky stlpcov ostava v farbach zahlavia panelov. Suhlasy a tlacidlo Dokoncit objednavku (.buttons hned
   za .basket) su spodna cast tej istej karty oddelena ciarou. Obsah odsadeny od ramika ako v .panel-body:
   desktop 5 px riadok + 15 px stlpec Bootstrapu, mobil 20 px. Mobil: sucty ako flex (cena vpravo nepretecie).
   Len CSS; stary dizajn bez zmeny, obsah ani poradie riadkov sa nemenia. */
body.nd #order_form .basket {
  margin: 0; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg); background: var(--nd-surface); box-shadow: none;
}
body.nd #order_form .basket:has(+ .buttons) { border-bottom: 0; border-radius: var(--nd-r-lg) var(--nd-r-lg) 0 0; }
body.nd #order_form .basket > .row-fluid { padding-left: 5px; padding-right: 5px; }
body.nd #order_form .basket .basket-products-title { border-top: 0; border-radius: calc(var(--nd-r-lg) - 1px) calc(var(--nd-r-lg) - 1px) 0 0; }
body.nd #order_form .basket .basket-products { border-top-color: var(--nd-line); }
body.nd #order_form .basket .basket-products.gray-bg, body.nd #order_form .basket .basket-products.total { background: var(--nd-surface); }
body.nd #order_form .basket .basket-products.total-last { padding-top: 8px; padding-bottom: 12px; border-top: 1px solid var(--nd-line) !important; border-radius: 0; } /* .noborder ma !important */
body.nd #order_form .basket .basket-products:has(+ .total-last) { padding-bottom: 8px; }
body.nd #order_form .basket + .buttons {
  margin: 0; padding: 14px 5px; border: 1px solid var(--nd-line); border-radius: 0 0 var(--nd-r-lg) var(--nd-r-lg); background: var(--nd-surface);
}
@media (max-width: 767px) {
  body.nd #order_form .basket .basket-products-title, body.nd #order_form .basket .basket-products:not(.gray-bg):not(.total) { padding-left: 20px; padding-right: 20px; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) { display: flex; align-items: baseline; padding: 5px 20px 0; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total)::before, body.nd #order_form .basket .basket-products:is(.gray-bg, .total)::after { content: none; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > div { float: none; width: auto; min-height: 0; padding: 0; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > :first-child { flex: 1 1 auto; min-width: 0; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > :last-child { flex: 0 0 auto; min-width: 84px; padding-left: 12px; white-space: nowrap; }
  body.nd #order_form .basket .basket-products.total-last { padding-top: 8px; padding-bottom: 12px; }
  body.nd #order_form .basket + .buttons { padding: 14px 5px 16px; }
}

/* ---- Objednavka a zmena platby: Doprava, Platba a kupon ako polozky, pod nimi suhrn (Stefan 18.10.2026) ----
   order.php: riadky #order_delivery_row, #order_payment_row a pevny kupon (.order-line-row) su za tovarom ako dalsie polozky:
   ciara medzi riadkami ako medzi produktmi, popis vlavo od stlpca nazvu (mobil od laveho okraja ako kupon v kosiku), cena
   v stlpci Celkom (gray-bg ostava kvoli rozlozeniu dvojstlpcovych riadkov - mobil flex, tablet sirky; pozadie je biele).
   Posledna polozka ma ciaru a medzeru pod sebou, suhrn (Zaokruhlenie DPH, Celkom bez DPH, DPH, Celkom k uhrade) ostava ako bol.
   order_payment.php (tabulka .tablewrap): rovnaky princip - Objednavka (tovar), Doprava, Platba, kupon ako polozky, suhrn vpravo;
   td.label ma z Bootstrapu .label (inline, biele pismo 75 %) a tr.voucher z comco.css .basket .voucher (ramik, inline-block). */
body.nd #order_form .basket .basket-products.order-line-row > :first-child { text-align: left; }
body.nd #order_form .basket .basket-products.order-line-row:not(:has(+ .order-line-row)) { margin-bottom: 10px; border-bottom: 1px solid var(--nd-line); }
@media (min-width: 768px) {
  body.nd #order_form .basket .basket-products.order-line-row { padding-bottom: 5px; }
}
@media (min-width: 992px) {
  body.nd #order_form .basket .basket-products.order-line-row > :first-child { padding-left: calc(8.333% + 15px); } /* za obrazok col-md-1 */
}
@media (min-width: 768px) and (max-width: 991px) {
  body.nd #order_form .basket .basket-products.order-line-row > :first-child { padding-left: calc(16.667% + 15px); } /* obrazok col-sm-2 */
  body.nd #order_form:has(.basket-products > .price-before) .basket .basket-products.order-line-row > :first-child { padding-left: calc(12.5% + 15px); }
}
/* Objednavka 992-1199 px (kontajner 970 px): stlpec col-md-1 ma 77 px, bez paddingu 47 px (.price bez laveho 62 px).
   Text sirsi ako stlpec prehliadac zarovna zlava a vytecie vpravo: #total (22 px) bol o 1.7-3.7 px vpravo od ostatnych
   sum, hlavicka Mnozstvo (58 px) o 5.3 px vpravo od stredu mnozstva tovaru (test 18.10.2026). Hlavicka Mnozstvo bez
   bocneho paddingu (stred = stred stlpca ako pri tovare), Celkom tovaru a hlavicky bez laveho paddingu (pravy okraj
   ostava, miesta 62 px), sucty ako flex: cena ma aspon sirku stlpca, sirsia cena odsunie popis dolava namiesto
   vytecenia vpravo. Od 1200 px (kontajner 1170) sa zmesti, tam bez zmeny.
   Test: claude_notes/novy_dizajn_overenie/suhrn_zakaznik_test.js (ALIGN pri 992 a 1280) */
@media (min-width: 992px) and (max-width: 1199px) {
  body.nd #order_form .basket .basket-products-title > .quantity { padding-left: 0; padding-right: 0; }
  body.nd #order_form .basket :is(.basket-products-title, .basket-products:not(.gray-bg):not(.total)) > :last-child { padding-left: 0; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) { display: flex; align-items: flex-start; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total)::before, body.nd #order_form .basket .basket-products:is(.gray-bg, .total)::after { content: none; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > :first-child { flex: 1 1 0; width: auto; min-width: 0; }
  body.nd #order_form .basket .basket-products:is(.gray-bg, .total) > .price { flex: 0 0 auto; width: auto; min-width: 8.333%; white-space: nowrap; }
}
@media (max-width: 767px) {
  body.nd #order_form .basket .basket-products.order-line-row { padding: 10px 20px; }
  body.nd #order_form .basket .basket-products.order-line-row > :last-child { font-weight: 700; color: var(--nd-ink); } /* ako Celkom produktu */
}
body.nd .form.order .basket .tablewrap table { width: 100%; margin-top: 16px; border-collapse: collapse; }
body.nd .form.order .basket .tablewrap td { padding: 4px 12px; border: 0; vertical-align: baseline; }
body.nd .form.order .basket .tablewrap td:first-child { width: 1%; padding-right: 0; } /* prazdna bunka - popis zacina hned vlavo */
body.nd .form.order .basket .tablewrap td.label {
  display: table-cell; border-radius: 0; font-size: inherit; font-weight: 400; line-height: inherit; color: var(--nd-ink); text-align: right; white-space: normal;
}
body.nd .form.order .basket .tablewrap td.value { width: 1%; text-align: right; white-space: nowrap; }
body.nd .form.order .basket .tablewrap tr.voucher { display: table-row; padding: 0; border: 0; background: none; }
body.nd .form.order .basket .tablewrap tr.order-line-row > td { padding-top: 10px; padding-bottom: 10px; border-top: 1px solid var(--nd-line); }
body.nd .form.order .basket .tablewrap tr.order-line-row > td.label { text-align: left; }
body.nd .form.order .basket .tablewrap tr.order-line-row > td.value { font-weight: 700; }
body.nd .form.order .basket .tablewrap tr.order-line-row:not(:has(+ tr.order-line-row)) > td { border-bottom: 1px solid var(--nd-line); }
/* medzera pod poslednou polozkou: prvy riadok suhrnu, skryte Zaokruhlenie DPH (display none) sa preskoci */
body.nd .form.order .basket .tablewrap tr.order-line-row + tr:not(.order-line-row) > td,
body.nd .form.order .basket .tablewrap tr.order-line-row + tr.rounding-row[style*="none"] + tr > td { padding-top: 14px; }
body.nd .form.order .basket .tablewrap tr.total > td { padding-top: 10px; padding-bottom: 12px; border-top: 1px solid var(--nd-line); font-weight: 700; }
body.nd .form.order .basket .tablewrap tr.total > td.value { font-family: var(--nd-font-display); font-size: 22px; color: var(--nd-ink); }

/* ==== VIN katalog: Kategorie ako strom TecDoc, VIN v boxe Vase vozidlo a v pase auta (14.10.2026) ====
   nd/vin_cats.php: strom z laximo_comco.php dostane triedy pf-tree a nd-vin-tree, nad obsahom je lista #pf-bar s tlacidlom
   Kategorie dielov. Panel je ten isty ako na TecDoc (comco-templates.css mobil, tu blok TecDoc katalog bez laveho stlpca).
   Lavy stlpec je zruseny (karta Vase vozidlo nizsie). Navyse len pre VIN strom:
   - prepinac ukazat / skryt v nadpise je pri paneli zbytocny (TecDoc ma svoj skryty v comco-templates.css),
   - klik na nadpis (vin_js.php, .ad-tree-xs-trigger) by v otvorenom paneli strom zbalil, ostava rozbaleny. */
body.nd .ad-tree.nd-vin-tree > .ad-tree-xs-trigger > .pull-right { display: none; }
body.nd #ad-column-left .ad-tree.nd-vin-tree > .ad-tree-xs-trigger { cursor: default; }
body.nd.pf-open-cats #ad-column-left .ad-tree.nd-vin-tree > .ad-structure-wrapper { display: block !important; }
/* VIN v boxe Vase vozidlo (laximo_comco_car_form.php, v comco.css 1.4em): 17 znakov sa do stlpca 768 az 1199 px nezmestilo,
   trcalo cez okraj boxu a na 768 prekryvalo nazov auta. Uzsie pismo nadpisov, velkost podla sirky boxu (cqi), pri
   nedostatku miesta sa zalomi. Plati len ked box ostal v stlpci (nd_vin_cats nenasiel jeho markup, karta nizsie nie je). */
body.nd #ad-column-left .ad-car-select-vin > .panel-body { container-type: inline-size; }
body.nd #ad-column-left .ad-car-select-vin span.vin {
  font-family: var(--nd-font-display); font-size: clamp(13px, 11cqi, 1.4em); font-weight: 600; line-height: 1.2; overflow-wrap: anywhere;
}
/* pas auta s VIN (car_bar.php, .car-bar__vin) na 768 az 991 px: nazov, VIN a akcie su v jednom riadku a nezmestili sa,
   stranka sa posuvala do stran a Ine auto? bolo orezane. Nazov sa skrati (cely je v title), VIN aj akcie ostanu cele.
   Pas bez VIN sa nemeni. */
@media (min-width: 768px) and (max-width: 991px) {
  body.nd #car-bar .car-bar__in:has(> .car-bar__vin) > a.car-bar__name { flex: 0 1 auto; }
}
/* VIN katalog bez laveho stlpca (14.10.2026, Stefan: lavy stlpec zrusit, obsah na celu sirku, Vase vozidlo na vrch).
   nd_vin_cats() presunie box Vase vozidlo zo stlpca ako kartu .nd-vin-car na zaciatok obsahu (nad h2 s cestou). V stlpci
   ostane len strom (mimo toku, bocny panel z listy Kategorie dielov), stlpec je prazdny - na kazdej sirke bez vysky
   a obsah ide na celu sirku. Podmienka je karta v obsahu: ked ju nd_vin_cats nevytvori, stlpec ostava ako predtym. */
body.nd .row:has(> #ad-column-right .nd-vin-car) > #ad-column-left { float: none; width: auto; min-height: 0; margin: 0; padding: 0; }
body.nd .row:has(> #ad-column-right .nd-vin-car) > #ad-column-right { float: none; width: 100%; }
/* karta: ikona auta, nadpis boxu, nazov s VIN v cipe, udaje ako stitky, tlacidlo vpravo (panel-body bez vlastneho boxu,
   jeho deti su bunky mriezky karty) */
body.nd #ad-column-right-inner > .nd-vin-car {
  position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto;
  grid-template-areas: "ico head btn" "ico title btn" "ico specs btn"; align-items: center; gap: 2px 18px;
  margin: 12px 0 22px; padding: 16px 20px; border: 1px solid var(--nd-line); border-radius: var(--nd-r-lg);
  background: var(--nd-surface); box-shadow: var(--nd-shadow-sm);
}
body.nd #ad-column-right-inner > .nd-vin-car > .panel-body { display: contents; }
body.nd #ad-column-right-inner > .nd-vin-car > .nd-vin-car__ico {
  grid-area: ico; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px;
  border-radius: var(--nd-r); background: var(--nd-accent-soft); font-size: 22px; line-height: 1; color: var(--nd-on-accent); /* tmavá ikona na svetlozlatom (Štefan 15.10.2026) */
}
body.nd #ad-column-right-inner > .nd-vin-car > .panel-heading {
  grid-area: head; margin: 0; padding: 0; border: 0; border-radius: 0; background: none;
  font-family: var(--nd-font-body); font-size: var(--nd-fs-12); font-weight: 700; line-height: 1.3; letter-spacing: .06em;
  text-transform: uppercase; color: var(--nd-muted);
}
body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__title { grid-area: title; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-width: 0; }
body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__title > h2 {
  min-width: 0; margin: 0; padding: 0; font-family: var(--nd-font-display); font-size: 25px; font-weight: 700; line-height: 1.15;
  letter-spacing: 0; text-transform: none; color: var(--nd-ink); overflow-wrap: anywhere;
}
body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__title > span.vin {
  display: inline-flex; align-items: center; gap: 7px; max-width: 100%; margin: 0; padding: 3px 9px;
  border: 1px solid var(--nd-line); border-radius: var(--nd-r-sm); background: var(--nd-surface-2);
  font-family: var(--nd-font-mono); font-size: var(--nd-fs-13); font-weight: 500; line-height: 1.45; letter-spacing: .04em;
  text-align: left; color: var(--nd-ink-2); white-space: nowrap;
}
body.nd #ad-column-right-inner > .nd-vin-car span.vin > .fa { font-size: .95em; color: var(--nd-muted); }
body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__specs { grid-area: specs; display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__spec {
  display: inline-block; padding: 3px 10px; border-radius: var(--nd-r-pill); background: var(--nd-surface-2);
  font-size: var(--nd-fs-13); line-height: 1.45; color: var(--nd-ink); white-space: nowrap;
}
body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__spec > b { font-weight: 500; color: var(--nd-muted); }
body.nd #ad-column-right-inner > .nd-vin-car a.btn {
  grid-area: btn; display: inline-flex; align-items: center; justify-content: center; height: 44px; margin: 0; padding: 0 22px;
  border-radius: var(--nd-r); font-size: var(--nd-fs-14); line-height: 1; white-space: nowrap;
}
/* loader (vin_comco_car_form_js.php, v comco.css 222 x 120 vlavo hore) - cez celu kartu */
body.nd #ad-column-right-inner > .nd-vin-car .ad-frm-ajax-loader-vin { inset: 0; width: auto; height: auto; margin: 0; padding: 0; border-radius: inherit; }
body.nd #ad-column-right-inner > .nd-vin-car .ad-frm-ajax-loader-vin img { position: absolute; top: 50%; left: 50%; margin: -32px 0 0 -32px; }
/* mobil: kompaktne - ikona a nadpis s tlacidlom hore, nazov s VIN pod nimi, stitky na celu sirku */
@media (max-width: 767px) {
  body.nd #ad-column-right-inner > .nd-vin-car {
    grid-template-columns: 40px minmax(0, 1fr) auto; grid-template-areas: "ico head btn" "ico title title" "specs specs specs";
    gap: 2px 10px; margin: 10px 0 16px; padding: 12px 14px 14px;
  }
  body.nd #ad-column-right-inner > .nd-vin-car > .nd-vin-car__ico { align-self: start; width: 40px; height: 40px; font-size: 18px; }
  body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__title { gap: 4px 8px; }
  body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__title > h2 { font-size: 20px; }
  body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__title > span.vin { padding: 2px 7px; font-size: var(--nd-fs-12); }
  body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__specs { gap: 5px; margin: 10px 0 0; }
  body.nd #ad-column-right-inner > .nd-vin-car .nd-vin-car__spec { padding: 2px 9px; font-size: var(--nd-fs-12-5); }
  body.nd #ad-column-right-inner > .nd-vin-car a.btn { height: 36px; padding: 0 12px; font-size: var(--nd-fs-13); }
}
/* vykres a zoznam pozicii (laximo_comco.php: #vin_image_wrap a #vin_subgroups_wrap, col-md-6 col-sm-12): na celej sirke
   by na 768 az 991 px bol vykres cez celu sirku (asi 720 x 650 px) a zoznam az pod nim - tu su vedla seba ako od 992 px,
   vykres 7/12. Klik na vykres (vin_comco_car_form_js.php) col-md-6 odoberie a vykres ide na celu sirku ako predtym. */
@media (min-width: 768px) and (max-width: 991px) {
  body.nd .row:has(> #ad-column-right .nd-vin-car) #vin_image_wrap.col-md-6 { float: left; width: 58.33333%; }
  body.nd .row:has(> #ad-column-right .nd-vin-car) #vin_subgroups_wrap.col-md-6 { float: left; width: 41.66667%; }
}
/* stranka po odoslani objednavky (page.php pre PAGE_ORDER_FINISH, jediny krok postupu s hotovym tretim krokom): uvodny text
   ma v obsahu inline font-size 14px (rezervacia na predajni: lang.php order_finish_reservation_text, objednavka: popis
   stranky 4 z adminu), pod nadpisom pusobi malo. Stefan 14.10.: vacsi aj na mobile (17 px, od 768 px 18 px, od 1200 px
   19 px), nie na celu sirku (riadok najviac asi 75 znakov) a vpravo od textu velka zelena fajka (::before, farba --nd-ok);
   na mobile ju text obteka (float), od 768 px stoji vpravo vedla textu (absolute).
   Stary dizajn bez zmeny (pravidlo je len v nd). */
body.nd .mainContainer:has(> .order-progress > .progress-wizard-step:last-child.complete) > p {
  position: relative; font-size: 17px !important; line-height: 1.55;
}
body.nd .mainContainer:has(> .order-progress > .progress-wizard-step:last-child.complete) > p::before {
  content: ""; float: right; width: 56px; height: 56px; margin: 6px 6px 6px 16px; border-radius: 50%;
  box-shadow: 0 0 0 6px var(--nd-ok-soft);
  background: var(--nd-ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 58% no-repeat;
}
@media (min-width: 768px) {
  body.nd .mainContainer:has(> .order-progress > .progress-wizard-step:last-child.complete) > p { max-width: calc(34em + 170px); min-height: 136px; padding-right: 170px; font-size: 18px !important; }
  body.nd .mainContainer:has(> .order-progress > .progress-wizard-step:last-child.complete) > p::before { position: absolute; top: 50%; right: 18px; width: 112px; height: 112px; margin: -56px 0 0; box-shadow: 0 0 0 10px var(--nd-ok-soft); }
}
@media (min-width: 1200px) {
  body.nd .mainContainer:has(> .order-progress > .progress-wizard-step:last-child.complete) > p { font-size: 19px !important; }
}
/* platobne instrukcie (payment.info z adminu) na dakovacej stranke a v konte, obal div.order-payment-info v order_summary.php:
   text je ten isty ako v maile, kde stlpce td.nd-col na mobile zlozi pod seba media query obalu mailu; tu to iste */
@media (max-width: 599px) {
  body.nd .order-payment-info td.nd-col { display: block; width: 100% !important; padding: 0 !important; }
  body.nd .order-payment-info td.nd-col + td.nd-col { padding-top: 16px !important; }
}
/* sila hesla pod input[data-pw-meter] a nezhoda pod input[data-pw-match] (front.js, COMCO-98 F46): 4 dieliky ako
   v prototype pages-register.jsx; skore <= 1 cervena, 2 oranzova, 3+ zelena, nevyplnene sive. Pod nimi zoznam
   poziadaviek .pw-req (vidiet aj pri prazdnom poli): nesplnena sivo s kruzkom, splnena zelene s fajkou */
body.nd .pw-meter { margin-top: 8px; }
body.nd .pw-meter__bar { display: flex; gap: 4px; margin-bottom: 6px; }
body.nd .pw-meter__bar[hidden] { display: none; }
body.nd .pw-meter__bar span { flex: 1; height: 4px; border-radius: 4px; background: var(--nd-surface-3); }
body.nd .pw-meter[data-score="1"] .pw-meter__bar span.is-on { background: var(--nd-danger); }
body.nd .pw-meter[data-score="2"] .pw-meter__bar span.is-on { background: var(--nd-warn); }
body.nd .pw-meter[data-score="3"] .pw-meter__bar span.is-on,
body.nd .pw-meter[data-score="4"] .pw-meter__bar span.is-on { background: var(--nd-ok); }
body.nd .pw-req { font-size: var(--nd-fs-12-5); line-height: 1.45; color: var(--nd-muted); text-align: left; overflow-wrap: anywhere; }
body.nd .pw-req__head { margin: 0; font-weight: 600; color: var(--nd-ink-2); display: flex; gap: 6px; }
body.nd .pw-req p.pw-req__sub { margin: 2px 0 0; font-size: inherit; font-weight: 400; color: var(--nd-muted); }
body.nd .pw-req p.pw-req__sub.is-met { color: var(--nd-ok); }
/* automaticke vyplnenie hesla prehliadacom: animacia na :autofill je jediny signal, ktory front.js zachyti (animationstart) */
@keyframes pwAutofill { from { opacity: 1; } to { opacity: 1; } }
input[data-pw-meter]:-webkit-autofill, input[data-pw-match]:-webkit-autofill { animation: pwAutofill 1ms; }
input[data-pw-meter]:autofill, input[data-pw-match]:autofill { animation: pwAutofill 1ms; }
body.nd .pw-req__list { list-style: none; margin: 2px 0 0; padding: 0; }
body.nd .pw-req__item { display: flex; gap: 6px; margin: 0; padding: 0; }
body.nd .pw-req__item::before { content: none; }
body.nd .pw-req__ico { flex: none; width: 1em; text-align: center; }
body.nd .pw-req__ico::before { content: "\25CB"; }
body.nd .pw-req__head .pw-req__ico { display: none; }
body.nd .pw-req .is-met { color: var(--nd-ok); }
body.nd .pw-req .is-met > .pw-req__ico { display: inline; }
body.nd .pw-req .is-met > .pw-req__ico::before { content: "\2713"; font-weight: 700; }
body.nd .pw-req__sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
body.nd .pw-match { margin-top: 6px; font-size: var(--nd-fs-12-5); line-height: 1.4; color: var(--nd-danger); }
body.nd .pw-match:empty { display: none; }