/* ============================================================
   Антим Клима — v2 style system (shared)
   Light "frost" surface + the logo's two colours. One job per colour:
   cyan = info / navigation, red = price / buy, yellow = deals,
   green = call, navy = structure (top bar, nav, help bands, footer).
   Type: Sofia Sans (UI, body) + Sofia Sans Condensed (headings, prices).
   Loads on every coded page, after home.css (legacy base: layout +
   the .ak-desktop/.ak-mobile switch) and before the page's own CSS.
   Holds tokens, type, buttons, icons, product card, chips, chrome,
   footer, tabbar and the mobile search overlay. Page-specific rules
   live in home-v2.css / category.css / product.css / … .
   ============================================================ */

body:is(.ak-home-body, .ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body, .ak-services-body),
.ak {
  --frost: #f2f6f9;
  --paper: #ffffff;
  --night: #0b2a4a;
  --night-2: #123a63;
  --cold: #00a0dc;
  --cold-ink: #0072a8;
  --cold-50: #e6f5fc;
  --cold-100: #c9eaf8;
  --hot: #d7141b;
  --hot-ink: #b30f15;
  --hot-50: #fdeded;
  --ink: #0f2133;
  --ink-2: #3d4f61;
  --muted: #627386;
  --line: #dce5ec;
  --ok: #12804a;
  --ok-ink: #0e6b3d;
  --ok-50: #e6f4ec;
  --wait: #9a5600;
  --wait-50: #fff2df;
  --deal: #ffd400;
  --deal-ink: #1b1c1e;
  --r-card: 16px;
  --r-btn: 12px;
  --r-sm: 8px;
  --shadow-card: 0 1px 2px rgba(11,42,74,.06), 0 6px 18px -8px rgba(11,42,74,.12);
  --shadow-pop: 0 24px 50px -16px rgba(11,42,74,.35);
}

body:is(.ak-home-body, .ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body, .ak-services-body) {
  margin: 0; background: var(--frost); color: var(--ink);
}

/* Standard (RUS) Cyrillic forms for any face that draws Bulgarian ones
   under lang="bg-BG" — the system-ui fallback during font swap, a
   plugin's own font (TBI's Inter). Our AK Sofia Sans files already
   default to the standard forms (fonts.css), so this only reaches other
   faces, and only where supported (not Safari). Every element + !important:
   any `font:` shorthand silently resets it. */
body:is(.ak-home-body, .ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body, .ak-services-body),
body:is(.ak-home-body, .ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body, .ak-services-body) *,
body:is(.ak-home-body, .ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body, .ak-services-body) *::before,
body:is(.ak-home-body, .ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body, .ak-services-body) *::after {
  font-language-override: "RUS" !important;
}

/* home.css token names → v2 values */
.ak {
  --cyan: var(--cold);
  --cyan-deep: var(--cold-ink);
  --brand: var(--cold-ink);
  --brand-2: var(--cold);
  --accent: var(--hot);
  --red: var(--hot);
  --red-deep: var(--hot-ink);
  --navy: var(--night);
  --navy-2: var(--night-2);
  --surface: var(--frost);
  --surface-2: var(--cold-50);
  --green: var(--ok);
  --radius: var(--r-card);
  --radius-sm: var(--r-sm);
  --font-head: var(--ak-font-d);
  font-family: var(--ak-font);
  font-size: 16px;
  line-height: 1.45;
  color: var(--ink);
}

/* ---------- type ---------- */
/* no colour here: headings inherit, so they stay white inside navy bands */
.ak h1, .ak h2, .ak h3, .ak h4 { font-family: var(--ak-font-d); font-weight: 800; letter-spacing: -.01em; }
.ak .d-secth { align-items: baseline; margin-bottom: 20px; }
.ak .d-secth h2 { font-size: 36px; letter-spacing: -.015em; }
.ak .d-secth .more,
.ak .sect-h .more {
  color: var(--cold-ink); font-weight: 700; font-size: 15px;
  text-decoration: underline; text-decoration-color: var(--cold-100); text-underline-offset: 4px; text-decoration-thickness: 2px;
}
.ak .d-secth .more:hover, .ak .sect-h .more:hover { text-decoration-color: currentColor; }
/* eyebrows: sentence case, no tracking (home.css draws them all-caps) */
.ak .eyebrow { font-size: 15px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--cold-ink); }

/* ---------- icons: one stroke weight everywhere ---------- */
.ak svg[stroke-width="1.8"] { stroke-width: 2; }
.ak .v2-ic {
  width: 44px; height: 44px; flex: 0 0 auto; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--cold-50); color: var(--cold-ink);
}

/* keeps a phrase on one line (e.g. «Понеделник–Петък 9:00–19:00») */
.ak .ak-nowrap { white-space: nowrap; }

/* ---------- buttons (each restates its hover: partdo's .btn:not(.link):hover greys) ---------- */
.ak .btn {
  min-height: 48px; padding: 13px 20px; gap: 8px; border-radius: var(--r-btn);
  font-family: var(--ak-font); font-weight: 800; font-size: 16px; letter-spacing: 0;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.ak .btn.lg { min-height: 54px; padding: 15px 24px; font-size: 17px; }
.ak .v2-btn-hot { background: var(--hot); color: #fff; box-shadow: 0 8px 18px -10px rgba(215,20,27,.7); }
.ak .v2-btn-hot:hover { background: var(--hot-ink); color: #fff; }
.ak .v2-btn-call { background: var(--ok); color: #fff; }
.ak .v2-btn-call:hover { background: var(--ok-ink); color: #fff; }
.ak .v2-btn-ghost { background: #fff; color: var(--ink); border: 1.5px solid var(--line); }
.ak .v2-btn-ghost:hover { background: #fff; color: var(--ink); border-color: var(--ink-2); }
.ak .v2-btn-light { background: #fff; color: var(--night); }
.ak .v2-btn-light:hover { background: var(--cold-50); color: var(--night); }
/* outline pill — secondary actions */
.ak .v2-pill {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px; border-radius: 999px;
  border: 1.5px solid var(--cold-ink); background: #fff; color: var(--cold-ink);
  font-family: var(--ak-font); font-size: 15px; font-weight: 800; line-height: 1; white-space: nowrap; cursor: pointer;
  transition: background-color .15s, color .15s;
}
.ak .v2-pill svg { stroke: currentColor; flex: 0 0 auto; }
.ak .v2-pill:hover { background: var(--cold-ink); color: #fff; }

.ak a:focus-visible,
.ak button:focus-visible,
.ak input:focus-visible,
.ak select:focus-visible,
.ak textarea:focus-visible,
.ak summary:focus-visible,
.ak [tabindex]:focus-visible { outline: 3px solid var(--cold); outline-offset: 2px; }

/* ---------- product card ---------- */
.ak .pcard {
  border: 1px solid var(--line); border-radius: var(--r-card); padding: 12px;
  box-shadow: var(--shadow-card); transition: border-color .15s, box-shadow .15s;
}
.ak .pcard:hover { border-color: var(--cold-100); box-shadow: 0 1px 2px rgba(11,42,74,.06), 0 16px 32px -16px rgba(11,42,74,.3); }
.ak .pcard .media {
  background: #fff; aspect-ratio: 5 / 4; padding: 30px 6px 6px; margin-bottom: 10px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
}
.ak .pcard .pimg { width: 100%; height: 100%; align-items: center; }
.ak .pcard .pimg img { width: 100%; height: 100%; object-fit: contain; }
.ak .pcard .topbadges { top: 8px; left: 8px; right: 8px; }
.ak .badge-disc {
  background: var(--deal); color: var(--deal-ink); border-radius: 6px; padding: 4px 7px;
  font-family: var(--ak-font-d); font-weight: 800; font-size: 15px; letter-spacing: 0;
}
.ak .pcard .plabel { box-shadow: none; border-radius: 6px; font-size: 11.5px; padding: 4px 7px; }
.ak .pcard .plabel.warranty { background: var(--ok-50); color: var(--ok-ink); }
.ak .pcard .plabel.wifi { background: var(--cold-50); color: var(--cold-ink); }
.ak .pcard .plabel svg { stroke: currentColor; }
.ak .pcard .brand-k { text-transform: none; letter-spacing: 0; font-size: 13px; font-weight: 700; color: var(--cold-ink); }
.ak .pcard .name {
  font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--ink);
  -webkit-line-clamp: 3; min-height: calc(3 * 1.3em);
}
.ak .pcard .name:hover { color: var(--cold-ink); }
.ak .pcard .pspecs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.ak .pcard .pspec { padding: 4px 6px; font-size: 12px; }
.ak .pcard .stockpill { background: none; padding: 0; margin-top: 9px; font-size: 13px; font-weight: 700; }
.ak .pcard .stockpill svg { stroke: currentColor; }
.ak .pcard .stockpill.instock { background: none; color: var(--ok); }
.ak .pcard .stockpill.order { background: none; color: var(--wait); }
.ak .pcard .pricerow { margin-top: auto; padding-top: 8px; margin-bottom: 8px; gap: 2px 8px; align-items: baseline; }
.ak .pcard .price { font-family: var(--ak-font-d); font-size: 25px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); }
.ak .pcard .pricerow:has(.old) .price { color: var(--hot); }
.ak .pcard .old { font-size: 13px; color: #8a97a6; }
.ak .pcard .pricerow .ak-energy { margin-left: auto; }
.ak .pcard .pextra { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 12px; font-size: 13px; font-weight: 700; color: var(--cold-ink); }
.ak .pcard .pextra span { display: inline-flex; align-items: center; gap: 5px; }
.ak .pcard .pextra svg { stroke: currentColor; flex: 0 0 auto; }
.ak .pcard .add {
  margin-top: 0; min-height: 44px; border-radius: 10px; font-size: 15.5px; font-weight: 800; background: var(--hot); color: #fff;
  transition: background-color .15s;
}
.ak .pcard .add:hover { background: var(--hot-ink); color: #fff; }
.ak .pcard { container-type: inline-size; }

/* ---------- chips ---------- */
.ak .pspec {
  display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 6px;
  background: var(--cold-50); color: var(--cold-ink); font-size: 12.5px; font-weight: 700; line-height: 1.1; white-space: nowrap;
}
.ak .pspec.ic { padding: 4px 5px; }
.ak .pspec.ok { background: var(--ok-50); color: var(--ok-ink); }
.ak .pspec svg { stroke: currentColor; flex: 0 0 auto; }
.ak .v2-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 14px; }
.ak .v2-chips .pspec { font-size: 13.5px; padding: 5px 9px; }

/* ---------- breadcrumb (light pages) ---------- */
.ak .ak-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 14px; font-weight: 600; color: var(--muted); }
.ak .ak-crumbs a { color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; }
.ak .ak-crumbs a:hover { color: var(--cold-ink); text-decoration-color: currentColor; }
.ak .ak-crumbs svg { color: #9aa8b6; flex: 0 0 auto; }
.ak .ak-crumbs .cur { color: var(--ink); }

/* ============================================================
   DESKTOP CHROME — template-parts/desktop-topbar.php,
   desktop-chrome.php, desktop-nav.php
   ============================================================ */
/* utility bar */
.ak .d-top { background: var(--night); color: rgba(255,255,255,.86); font-size: 13.5px; font-weight: 600; }
.ak .d-top .dwrap { height: 38px; }
.ak .d-top-hours { display: inline-flex; align-items: center; gap: 8px; }
.ak .d-top-links { display: flex; gap: 24px; }
.ak .d-top a { color: inherit; }
.ak .d-top a[href]:hover { opacity: 1; color: #fff; }
.ak .d-top .d-top-phone { font-weight: 800; }

/* header */
.ak .v2-head { background: #fff; border-bottom: 1px solid var(--line); }
.ak .d-head { padding: 14px 0; gap: 28px; }
.ak .v2-logo { display: flex; flex: 0 0 auto; }
.ak .v2-logo img { height: 64px; width: auto; }
.ak .d-search {
  max-width: 660px; background: var(--frost); border: 1.5px solid var(--line); border-radius: 12px; padding: 4px 4px 4px 18px;
  transition: border-color .15s, box-shadow .15s;
}
.ak .d-search:focus-within { border-color: var(--cold); box-shadow: 0 0 0 4px var(--cold-50); background: #fff; }
.ak .d-search .go { width: 44px; height: 44px; border-radius: 9px; background: var(--cold-ink); }
.ak .d-search .go:hover { background: var(--night); }
.ak .d-search .ak-catpick::after { background: var(--line); }
.ak .d-search .ak-catpick-btn { color: var(--ink-2); font-size: 14.5px; }
.ak .d-search .ak-catpick-btn:hover { background: transparent; color: var(--ink); }
.ak .d-search .ak-catpick-btn svg { stroke: currentColor; }
.ak .ak-catpick-panel { border: 1px solid var(--line); box-shadow: var(--shadow-pop); }
.ak .ak-catpick-opt { font-size: 14.5px; }
.ak .ak-catpick-opt:hover { background: var(--frost); color: var(--cold-ink); }
.ak .ak-catpick-opt.is-active { color: var(--cold-ink); }
.ak .ak-search-results { background: #fff; border: 1px solid var(--line); color: var(--ink); box-shadow: var(--shadow-pop); }
.ak .ak-search-results .ak-sr-row,
.ak .ak-search-results .ak-sr-row .nm,
.ak .ak-search-results .ak-sr-row .pr .e { color: var(--ink); }
.ak .ak-search-results .ak-sr-row:hover { background: var(--frost); }
.ak .ak-search-results .ak-sr-row .thumb { border: 1px solid var(--line); }
.ak .ak-search-results .ak-sr-empty { color: var(--muted); }
.ak .d-head .acts { gap: 24px; }
.ak .d-act .ic { width: 44px; height: 44px; background: var(--frost); border: 1px solid var(--line); color: var(--ink); }
.ak .d-act .ic svg { stroke: currentColor; }
.ak .d-act .ic .count { background: var(--hot); }
.ak .d-act .lbl small { color: var(--muted); font-size: 12.5px; }
.ak .d-act .lbl b { color: var(--ink); font-size: 15px; font-weight: 800; }
.ak .d-act:hover .ic { border-color: var(--ink-2); }
.ak .v2-call .ic { background: var(--ok-50); border-color: transparent; color: var(--ok); }

/* nav */
.ak .d-nav { background: var(--night); border: 0; }
.ak .d-nav .dwrap { height: 54px; gap: 2px; }
.ak .d-navlink {
  color: rgba(255,255,255,.92); text-transform: none; letter-spacing: 0; font-size: 15.5px; font-weight: 700; padding: 9px 12px;
}
.ak .d-navlink:hover { background: rgba(255,255,255,.1); color: #fff; }
.ak .d-navlink svg { stroke: currentColor; }
.ak .d-finance {
  text-transform: none; letter-spacing: 0; font-size: 15px; border-radius: 10px; padding: 9px 14px; margin: 0 8px;
  background: var(--deal); color: var(--deal-ink);
}
.ak .d-finance:hover { background: #ffe14d; color: var(--deal-ink); }
.ak .d-finance svg { stroke: currentColor; }
.ak .d-subnav-card { border: 1px solid var(--line); box-shadow: var(--shadow-pop); }
.ak .d-subnav-row { font-size: 15px; }
.ak .d-subnav-row:hover { background: var(--frost); color: var(--cold-ink); }
/* service page still being built (ak_is_wip_slug()): greyed out, not a link */
.ak .d-subnav-row.is-wip, .ak .d-subnav-row.is-wip:hover { color: var(--muted); opacity: .6; background: none; cursor: default; }

/* mega menu (template-parts/mega-panels.php): the home page's category menu and
   the "Всички продукти" dropdown on every other page. Base layout in home.css. */
.ak .mnav-mega { grid-template-columns: 300px minmax(0, 1fr) 290px; border: 1px solid var(--line); border-radius: 20px; }
.ak .mnav-rail { background: #f7fafc; border-right: 1px solid var(--line); padding: 10px; }
.ak .mnav-railrow { padding: 11px 12px; border-radius: 12px; gap: 13px; }
.ak .mnav-railrow:hover { background: #fff; }
.ak .mnav-railrow.on { box-shadow: none; }
.ak .mnav-railic { width: 40px; height: 40px; color: var(--cold-ink); }
.ak .mnav-railic svg { width: 36px; height: 36px; }
.ak .mnav .mnav-raillbl { font-family: var(--ak-font); font-weight: 700; font-size: 16.5px; line-height: 1.2; color: var(--ink); } /* "Вентилационни системи" wraps → keep the row compact */
.ak .mnav-panelhead h3 { font-size: 26px; }
.ak .mnav-panelhead span { font-size: 14px; color: var(--muted); }
.ak .mnav-seeall { color: var(--cold-ink); font-size: 15px; }
.ak .mnav .mnav-sublink { font-size: 15.5px; color: var(--ink-2); }
.ak .mnav .mnav-sublink:hover { color: var(--cold-ink); }
.ak .mnav .mnav-grp-h { text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 800; color: var(--ink); }
.ak .mnav .mnav-grp-link { font-family: var(--ak-font); color: var(--ink); }
.ak .mnav-empty a { color: var(--cold-ink); font-weight: 700; }
/* category sold as a service (VRF): a line of text + a link to its service page */
.ak .mnav-service { flex: 1; padding: 20px 0; max-width: 56ch; }
.ak .mnav-service p { margin: 0 0 14px; font-size: 15.5px; line-height: 1.55; color: var(--ink-2); }
.ak .mnav .mnav-service a { font-size: 15.5px; font-weight: 700; color: var(--cold-ink); }
.ak .mnav .mnav-service a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ak .mnav-brandlbl { font-size: 13px; }
.ak .mnav-promo { background: #fff; }
.ak .v2-art { height: 176px; display: flex; align-items: center; justify-content: center; background: var(--cold-50); color: var(--cold-ink); }
.ak .v2-art.hot { background: var(--hot-50); color: var(--hot); }
.ak .v2-art.has-photo { background: var(--cold-50); }
.ak .v2-art.has-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.ak .mnav-promo-eyebrow { text-transform: none; letter-spacing: 0; font-size: 13.5px; color: var(--cold-ink); }
.ak .mnav .mnav-promo-title { font-size: 22px; }
.ak .mnav-promo-cta { color: var(--hot); font-size: 15px; }

/* "Всички продукти" dropdown (desktop-nav.php): hangs from the sticky nav, full
   page width. Hover opens it after a short delay, so moving the mouse across
   the bar doesn't flash it; keyboard focus opens it at once.
   .is-shut = closed with Escape (home.js). */
.ak .d-nav .d-prods { position: static; align-self: stretch; } /* full bar height: no hover gap above the menu */
.ak .d-prodmenu {
  position: absolute; left: 0; right: 0; top: 100%; z-index: 70; pointer-events: none;
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .14s ease .1s, transform .14s ease .1s, visibility 0s linear .24s;
}
.ak .d-prods:hover .d-prodmenu {
  opacity: 1; visibility: visible; transform: none;
  transition: opacity .14s ease .12s, transform .14s ease .12s, visibility 0s linear .12s;
}
.ak .d-prods:focus-within .d-prodmenu { /* keyboard: no delay, so the next Tab already lands in the menu */
  opacity: 1; visibility: visible; transform: none;
  transition: opacity .14s ease, transform .14s ease, visibility 0s;
}
.ak .d-prods:not(.is-shut):hover > .d-navlink,
.ak .d-prods:not(.is-shut):focus-within > .d-navlink { background: rgba(255,255,255,.1); color: #fff; } /* stays lit while the pointer is in the menu */
.ak .d-prods.is-shut .d-prodmenu { opacity: 0; visibility: hidden; transition: none; }
.ak .d-prods.is-shut .subchev { transform: none; }
.ak .d-prodmenu-in { max-width: 1440px; margin: 0 auto; padding: 10px 40px 0; pointer-events: auto; } /* = .dwrap; the top padding bridges the gap */
.ak .d-prodmenu .mnav-mega { box-shadow: var(--shadow-pop); max-height: calc(100vh - 54px - 24px); overflow: hidden auto; overscroll-behavior: contain; }
.ak .d-prodmenu .mnav-railrow { color: var(--ink); }
.ak .d-prodmenu .mnav-railrow:focus-visible { outline: 2px solid var(--cold); outline-offset: -2px; }

/* footer (template-parts/desktop-footer.php) */
.ak .v2-foot { background: var(--night); margin-top: 60px; }
.ak .d-foot { color: rgba(255,255,255,.76); font-size: 15px; }
.ak .d-foot h4 { font-family: var(--ak-font-d); text-transform: none; letter-spacing: 0; font-size: 19px; color: #fff; }
.ak .d-foot a { color: rgba(255,255,255,.82); opacity: 1; }
.ak .d-foot a:hover { color: #fff; }
.ak .d-foot-logo { display: flex; align-items: center; justify-content: center; width: 76px; height: 76px; margin-bottom: 16px; border-radius: 50%; background: #fff; }
.ak .d-foot-logo img { width: 64px; height: 64px; border-radius: 50%; }
.ak .d-foot-about { line-height: 1.6; margin: 0; }
.ak .d-foot .d-foot-phone { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 0; font-weight: 800; color: #fff; }
.ak .d-foot-phone svg { stroke: var(--cold); }
.ak .d-foot-bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0 30px; border-top: 1px solid rgba(255,255,255,.12); font-size: 13.5px; }
.ak .ak-pay { display: flex; align-items: center; gap: 8px; }
.ak .ak-pay-chip { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 6px; background: rgba(255,255,255,.1); font-weight: 700; }
.ak .ak-pay-chip.is-visa { background: #fff; font-style: italic; font-weight: 900; font-size: 15px; letter-spacing: .02em; color: #1a1f71; }
.ak .ak-pay-chip.is-mc { background: #fff; padding: 0 8px; }

/* narrower desktops */
@media (min-width: 1024px) and (max-width: 1240px) {
  .ak .v2-call { display: none; }
  .ak .d-navlink { padding: 9px 8px; font-size: 14.5px; }
  .ak .d-finance { margin: 0 4px; }
  .ak .mnav-mega { grid-template-columns: 260px minmax(0, 1fr) 250px; }
}

/* ============================================================
   MOBILE CHROME — template-parts/mobile-chrome.php, mobile-tabbar.php
   ============================================================ */
.ak .appbar { background: #fff; padding: 12px 16px 10px; }
.ak .m-logo { display: flex; flex: 0 0 auto; }
.ak .m-logo img { width: auto; height: 40px; }
.ak .appbar .m-search { background: var(--frost); border: 1.5px solid var(--line); color: var(--muted); padding: 10px 14px; }
.ak .appbar .m-search svg { stroke: currentColor; }
.ak .appbar .m-search input[type="search"] { color: var(--ink); }
.ak .appbar .m-search input::placeholder { color: var(--muted); font-size: 15px; }
.ak .appbar .m-search-open:focus-visible { outline: 3px solid var(--cold); }
.ak .appbar .ico-btn { background: var(--frost); border: 1px solid var(--line); width: 44px; height: 44px; color: var(--ink); }
.ak .appbar .ico-btn svg { stroke: currentColor; }
.ak .appbar .ico-btn .count { background: var(--hot); }
.ak .m-prodbar { background: #fff; padding: 0 16px 12px; border-bottom: 1px solid var(--line); }
.ak .m-prodbtn { background: var(--night); color: #fff; font-size: 15.5px; min-height: 46px; }
.ak .m-prodbtn:hover { background: var(--night-2); color: #fff; }
.ak .m-prodbtn svg { stroke: currentColor; }
.ak .m-finance { font-size: 15px; min-height: 46px; background: var(--deal); color: var(--deal-ink); }
.ak .m-finance:hover { background: #ffe14d; color: var(--deal-ink); }
.ak .m-finance svg { stroke: currentColor; }
.ak .m-prodmenu { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.ak .m-prodrow { border-bottom-color: var(--line); color: var(--cold-ink); }
.ak .m-prodrow svg { stroke: currentColor; }
.ak .m-prodrow .nm { color: var(--ink); font-size: 15.5px; }
.ak .m-prodrow .m-prodchev { color: var(--muted); }
.ak .m-prodrow.is-wip { cursor: default; }
.ak .m-prodrow.is-wip .nm { color: var(--muted); opacity: .6; }

/* Продукти / Услуги / Промоции on one row: Продукти takes the spare width.
   Label widths in AK Sofia Sans: ≈350px with both icons, 327 without the %,
   302 without either, so narrower phones drop .m-barico (Промоции's % first). */
.ak .m-prodbar { gap: 8px; }
.ak .m-prodbtn, .ak .m-finance { padding: 12px; gap: 7px; white-space: nowrap; }
.ak .m-servbtn { flex: none; }
@media (max-width: 409px) {
  .ak .m-finance .m-barico { display: none; }
}
@media (max-width: 389px) {
  .ak .m-prodbtn .m-barico { display: none; }
}
@media (max-width: 359px) {
  .ak .m-prodbar { gap: 6px; }
  .ak .m-prodbtn, .ak .m-finance { padding: 12px 10px; gap: 5px; font-size: 14px; }
  .ak .m-finance { font-size: 13.5px; }
}

/* legal line + tabbar */
.ak .ak-mlegal { color: var(--muted); padding-top: 22px; }
.ak .ak-mlegal-link { color: var(--ink-2); text-decoration-color: var(--line); }
.ak .ak-mlegal-link:hover { color: var(--ink); }
.ak .ak-mlegal-link:focus-visible { outline: 3px solid var(--cold); }
.ak .tabbar { border-top-color: var(--line); box-shadow: 0 -6px 20px -12px rgba(11,42,74,.25); }
.ak .tabbar .tab { font-size: 11.5px; color: var(--muted); }
.ak .tabbar .tab.on { color: var(--cold-ink); }
.ak .tabbar .tab-call { color: var(--ok); }
.ak .tabbar .ti-call {
  width: 48px; height: 48px; margin: -24px 0 -2px; border-radius: 999px; display: flex; align-items: center; justify-content: center;
  background: var(--ok); border: 4px solid #fff; box-shadow: 0 6px 14px -6px rgba(18,128,74,.7);
}

/* mobile search overlay (built by home.js on <body>, class "ak ak-msearch") */
.ak-msearch { background: var(--frost); color: var(--ink); }
.ak-msearch .msr-head { background: #fff; border-bottom-color: var(--line); }
.ak-msearch .msr-ib { color: var(--ink); }
.ak-msearch .msr-ib:hover { background: var(--frost); color: var(--ink); }
.ak-msearch .msr-ib svg { stroke: currentColor; }
.ak-msearch .msr-form { background: var(--frost); border: 1.5px solid var(--line); }
.ak-msearch .msr-form:focus-within { box-shadow: 0 0 0 3px var(--cold-50); border-color: var(--cold); }
.ak-msearch .msr-form input[type="search"] { color: var(--ink); }
.ak-msearch .msr-form input::placeholder { color: var(--muted); }
.ak-msearch .ak-sr-row, .ak-msearch .ak-sr-row .nm, .ak-msearch .ak-sr-row .pr .e { color: var(--ink); }
.ak-msearch .ak-sr-row:hover { background: #fff; }
.ak-msearch .ak-sr-row .thumb { border: 1px solid var(--line); }
.ak-msearch .msr-status { color: var(--muted); }
.ak-msearch .msr-spin { border-color: var(--line); border-top-color: var(--cold-ink); }
.ak-msearch .msr-all { background: var(--cold-ink); color: #fff; }
.ak-msearch :is(.msr-ib, .ak-sr-row, .msr-all):focus-visible { outline: 3px solid var(--cold); outline-offset: -3px; }

/* partdo's add-to-cart toast (body > .klb-notice-ajax, outside .ak): v2 green
   with readable contrast, parked above the tabbar + product sticky bar on phones */
body:is(.ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body) .klb-notice-ajax .woocommerce-message {
  background: var(--ok); color: #fff; border: 0; border-radius: var(--r-btn);
  font-family: var(--ak-font); font-size: 15px; font-weight: 600; line-height: 1.45;
  box-shadow: 0 16px 36px -12px rgba(11,42,74,.45);
}
body:is(.ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body) .klb-notice-ajax .woocommerce-message a { color: #fff; font-weight: 800; }
@media (max-width: 1023px) {
  body:is(.ak-cat-body, .ak-shop-body, .ak-product-body, .ak-page-body) .klb-notice-ajax {
    bottom: calc(var(--ak-tabbar-h, 0px) + var(--ak-sticky-h, 0px) + 10px + env(safe-area-inset-bottom)) !important;
  }
}

/* store map (ak_store_map): static OSM picture centred on the pin, linking to
   the Google Maps listing. The picture stays at 1:1 pixels (object-fit: none)
   so the pin overlay at the box centre always sits on the store, whatever the
   box size. */
.ak .ak-smap { position: relative; display: block; overflow: hidden; isolation: isolate; background: #eef1ee; border-radius: var(--r-card); cursor: pointer; }
.ak .ak-smap:focus-visible { outline: 3px solid var(--cold); outline-offset: 2px; }
.ak .ak-smap-img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: none; object-position: 50% 50%; transition: filter .2s; }
.ak .ak-smap:hover .ak-smap-img { filter: brightness(.94); }
.ak .ak-smap-attr { position: absolute; top: 0; right: 0; z-index: 2; padding: 1px 6px; border-bottom-left-radius: 6px; background: rgba(255,255,255,.82); color: #3d4f61; font-size: 10.5px; line-height: 1.5; pointer-events: none; }
.ak .ak-smap-pin { position: absolute; left: 50%; top: 50%; z-index: 1; transform: translate(-50%, -100%); color: var(--hot); filter: drop-shadow(0 3px 4px rgba(11,42,74,.35)); pointer-events: none; transition: transform .2s; }
.ak .ak-smap:hover .ak-smap-pin { transform: translate(-50%, calc(-100% - 3px)); }

/* ============================================================
   INSTALLMENT ROWS — ПБ Лични Финанси + TBI, product page and cart
   (the plugins' own markup; order + headings in product.css / cart.css).
   One look for both (owner 2026-11-13), like the payment list at checkout:
   white row, «Купи с …» + the monthly amount on the left, the bank's logo
   on the right, the whole row clickable. Names: TBI's «Buy with» is
   translated (ak_tbi_eur_only_labels()), ПБ's is a ::before. Amount:
   home.js writes «13 вноски по 65,98 €» into data-ak and the ::after shows
   it; the plugin's own text stays in the DOM at font-size 0 (TBI's click
   handler reads the count from it) and shows as is without JS.
   ============================================================ */
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container,
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 {
  position: relative; box-sizing: border-box; width: 100%; min-height: 68px;
  margin: 0; padding: 12px 16px !important; /* beats ПБ's inline padding-top */
  background: #fff; color: var(--ink); border: 1.5px solid var(--line); border-radius: var(--r-btn); box-shadow: none;
  font-family: var(--ak-font); text-align: left; cursor: pointer; transition: box-shadow .15s;
}
/* hover: soft lift + the name in blue (as in the checkout payment list), no dark outline */
@media (hover: hover) {
  .ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container:hover,
  .ak :is(.ak-pd-summary, .cart_totals) #tbi_button:hover .tbi_button_body2 { box-shadow: var(--shadow-card); }
  .ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container:hover tr + tr > .jet_button_table::before,
  .ak :is(.ak-pd-summary, .cart_totals) #tbi_button:hover .tbi_button_body2 > .tbi_button_line:first-child { color: var(--cold-ink); }
}
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container:focus-visible,
.ak :is(.ak-pd-summary, .cart_totals) #tbi_button:focus-visible { outline: 3px solid var(--cold); outline-offset: 2px; }
.ak :is(.ak-pd-summary, .cart_totals) #tbi_button:focus-visible { border-radius: var(--r-btn); }

/* the two lines: name, amount */
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container tr + tr > .jet_button_table::before,
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 > .tbi_button_line:first-child {
  font-family: var(--ak-font); font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--ink);
}
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container .jet_button_table p,
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 > .tbi_button_line:nth-of-type(2) {
  margin: 2px 0 0 !important; padding: 0 !important; background: none !important;
  font-family: var(--ak-font) !important; font-size: 15px !important; font-weight: 500 !important;
  line-height: 1.35 !important; color: var(--ink-2) !important; white-space: normal; text-align: left;
}
.ak :is(.ak-pd-summary, .cart_totals) :is(#jet-product-button-container .jet_button_table p, .tbi_button_body2 > .tbi_button_line:nth-of-type(2))[data-ak] {
  font-size: 0 !important; line-height: 0 !important;
}
/* ПБ prints « x  евро» with empty number slots that its script fills later:
   keep the line's space but show nothing until then */
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container .jet_button_table p:has(> :is(#jet_vnoski_text, #jet_vnoska):empty) {
  visibility: hidden;
}
.ak :is(.ak-pd-summary, .cart_totals) :is(#jet-product-button-container .jet_button_table p, .tbi_button_body2 > .tbi_button_line:nth-of-type(2))[data-ak]::after {
  content: attr(data-ak); content: attr(data-ak) / ""; /* screen readers keep the plugin's text */
  display: block; font-size: 15px; line-height: 1.35;
}

/* ПБ: table → two-column grid. Its click handler sits on the logo <img>
   only, so the (invisible) image is stretched over the whole row and the
   plain logo (its jet_logo.png, as at checkout) is painted in its cell. */
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container .jet_table_img {
  display: block; width: 100% !important; max-width: none !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important;
}
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container .jet_table_img tbody {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 14px;
}
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container .jet_table_img tr { display: contents; }
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container .jet_button_table {
  display: block; padding: 0 !important; border: 0 !important; background: none; text-align: left !important;
}
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container tr:first-child > .jet_button_table {
  grid-column: 2; grid-row: 1 / span 2; width: 70px; height: 32px;
  background: url(../img/payments/pb-lichni-finansi.png) center / contain no-repeat;
}
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container tr + tr > .jet_button_table { grid-column: 1; grid-row: 1 / span 2; }
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container tr + tr > .jet_button_table::before { content: "Купи с ПБ Лични Финанси"; display: block; }
.ak :is(.ak-pd-summary, .cart_totals) #jet-product-button-container img.jet_logo {
  position: absolute; inset: 0; z-index: 1; display: block; width: 100%; height: 100%;
  max-width: none !important; max-height: none !important; margin: 0; opacity: 0;
}

/* TBI: the plugin JS sets an inline display:flex on the container. Its first
   line is «Купи с TBI» + logo: display: contents puts the text in the left
   column and the logo in the right one. Only button style 2 (the plugin's
   BG default, its «Изглед на бутона» setting) is restyled. */
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_container2 { width: 100%; margin: 0; flex-direction: column; }
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button2 { display: block; width: 100%; min-width: 0; max-width: none; margin: 0; }
.ak :is(.ak-pd-summary, .cart_totals) #tbi_button { margin-top: 0; } /* beats the plugin's inline #tbi_button { margin-top: 10px } */
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 14px;
}
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 > .tbi_button_line:first-child { display: contents; }
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 img.tbi_button_logo2 {
  grid-column: 2; grid-row: 1 / span 2; display: block; width: auto; height: 24px; max-height: none; margin: 0;
}
.ak :is(.ak-pd-summary, .cart_totals) .tbi_button_body2 > .tbi_button_line:nth-of-type(2) { display: block; grid-column: 1; grid-row: 2; }

/* spinners keep turning (they carry the "loading" state); decorative motion stops */
@media (prefers-reduced-motion: reduce) {
  .ak *, .ak *::before, .ak *::after { transition: none !important; scroll-behavior: auto !important; }
  .ak .ak-drawer-panel, .ak .ak-slide.is-active { animation: none !important; }
}