/* Кожата на ANLORADELUX — мостът между темата и дизайна.
 *
 * РАЗДЕЛЕНИЕ НА ТРУДА, за да не се дублира работа:
 *
 *   koja-anloradelux-dizajn.css  — дизайнът дословно, всички класове `adl-*`.
 *                                  Произвежда се с tools/vzemi-dizajn.py и НЕ
 *                                  се редактира. Важи за началната страница.
 *   този файл                    — токените на ТЕМАТА, пренастроени към
 *                                  палитрата на марката, плюс поправките по
 *                                  общите части: шапка, каталог, карти,
 *                                  бутони. Те си остават на разметката на
 *                                  anlora, защото носят количката, чекаута и
 *                                  куриерските кутии.
 *
 * Тук НЕ се пишат правила за `adl-*` класове. Ако нещо на началната страница
 * не изглежда вярно, поправя се в дизайна и се взима наново.
 */

/* Onest носи текста вместо Manrope. Подрязан с кирилица, tools/build_onest.py */
@font-face{font-family:'Onest';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/onest-400.woff2') format('woff2')}
@font-face{font-family:'Onest';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/onest-500.woff2') format('woff2')}
@font-face{font-family:'Onest';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/onest-600.woff2') format('woff2')}
@font-face{font-family:'Onest';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/onest-700.woff2') format('woff2')}
/* Резервен с изравнени метрики (виж бележката в main.css): Arial, разпънат
   до ширината на Onest, за да няма разместване при смяната. */
@font-face{font-family:'Onest Fallback';src:local('Arial');size-adjust:102.88%;ascent-override:94.29%;descent-override:29.65%;line-gap-override:0%}

/* Playfair Display носи заглавията. Дотук идваше по @import от Google:
   чужда заявка на всяко зареждане, IP на посетителя навън и блокирано
   рендиране. Файловете стоят локално отдавна - ползваме тях. */
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/playfairdisplay-400.woff2') format('woff2')}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/playfairdisplay-400i.woff2') format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/playfairdisplay-500.woff2') format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/playfairdisplay-600.woff2') format('woff2')}

:root{
  /* --- Хартия: топло неутрално, не кремаво. Страницата е БЯЛА. --- */
  --paper-50:#FCFBFA;
  --paper-100:#F7F5F2;
  --paper-200:#F1EEEA;
  --paper-300:#E6E2DC;
  --paper-400:#D6D1C9;
  --paper-500:#A8A29A;

  /* --- Мастило --- */
  --ink-900:#1C1917;
  --ink-800:#2E2A26;
  --ink-700:#4A453F;
  --ink-600:#6B655D;
  --ink-500:#857F76;
  --ink-400:#A8A29A;

  /* --- Акцент: лилавото на марката. Само призиви, връзки и фокус. --- */
  --clay-50:#F7F3FB;
  --clay-100:#EEE6F6;
  --clay-200:#DCCDEC;
  --clay-400:#7B52AB;
  --clay-500:#66438E;
  --clay-600:#513672;

  /* --- Повърхности --- */
  --surface-page:#FFFFFF;
  --surface-card:#FFFFFF;
  --surface-raised:#FFFFFF;
  --surface-sunken:var(--paper-100);
  --surface-dark:var(--ink-900);
  --surface-tint:var(--clay-50);
  --surface-scrim:rgba(28,25,23,.44);

  /* --- Текст ---
     ВНИМАНИЕ: дизайнът дава #857F76 за приглушения текст, но върху бяло той
     е 3,94:1 и пада на WCAG AA за дребен шрифт. Понеже се ползва точно за
     12-те пиксела под името на модела, тук стои с една стъпка по-тъмно
     (#6B655D, 5,77:1). Разликата не се вижда, провалът се вижда. */
  --text-body:var(--ink-600);
  --text-strong:var(--ink-900);
  --text-muted:var(--ink-600);
  --text-subtle:var(--ink-500);
  --text-inverse:#FFFFFF;
  --text-accent:var(--clay-400);
  --text-link:var(--clay-400);
  --text-link-hover:var(--clay-500);

  /* --- Линии --- */
  --line-hairline:var(--paper-300);
  --line-default:var(--paper-400);
  --line-strong:var(--paper-400);
  --line-inverse:rgba(255,255,255,.12);
  --line-focus:var(--clay-400);

  /* --- Действия --- */
  --action-primary:var(--clay-400);
  --action-primary-hover:var(--clay-500);
  --action-primary-fg:#FFFFFF;

  /* --- Типография: Playfair остава, текстът минава на Onest --- */
  --font-sans:'Onest',system-ui,-apple-system,sans-serif;

  /* --- Заобленост и сенки --- */
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --shadow-sm:0 1px 3px rgba(26,26,26,.07);
  --shadow-md:0 4px 14px rgba(26,26,26,.08);
  --shadow-lg:0 10px 30px rgba(26,26,26,.11);
}

/* Тъмните ивици носят свой прочит на приглушеното, иначе надписите падат
   под прага върху мастиленото поле. Този капан вече ни е хапал веднъж. */
.koja-anloradelux .section--dark,
.koja-anloradelux .site-footer{
  --text-body:#D6D1C9;
  --text-muted:#D6D1C9;
  --text-subtle:#A8A29A;
  --line-hairline:rgba(255,255,255,.12);
  --line-default:rgba(255,255,255,.16);
}

/* Заглавията са с нормална дебелина: Playfair носи тежестта с формата си. */
.koja-anloradelux h1,
.koja-anloradelux h2,
.koja-anloradelux h3,
.koja-anloradelux .h1,
.koja-anloradelux .h2{
  font-weight:400;
  letter-spacing:-.015em;
}

/* Цената е в серифа — единственото число, което заслужава внимание. */
.koja-anloradelux .price,
.koja-anloradelux .woocommerce-Price-amount{
  font-family:var(--font-display);
  font-weight:500;
}

.koja-anloradelux :focus-visible{
  outline:2px solid var(--clay-400);
  outline-offset:2px;
}

/* ── Общите части: шапка и контейнер ─────────────────────────────────
 * Тези важат на ВСЯКА страница, не само на началната.
 */

body.koja-anloradelux .band{ padding-inline:48px }

body.koja-anloradelux .site-header{
  background:var(--surface-card);
  border-bottom:1px solid var(--line-hairline);
}

body.koja-anloradelux .site-header__inner{
  min-height:80px;
  height:80px;
  padding-block:0;
}

body.koja-anloradelux a.nav__link:not(.btn){ font-size:14px; font-weight:500 }

body.koja-anloradelux .icon-btn{
  width:40px;
  height:40px;
  border-radius:var(--radius-sm);
}

body.koja-anloradelux .icon-btn:hover{ background:var(--paper-100) }

body.koja-anloradelux .logo__mark{ height:30px; width:auto; display:block }
body.koja-anloradelux .site-footer .logo__mark{ filter:brightness(0) invert(1); height:28px }

/* ── Кои връзки са лилави и кои НЕ ───────────────────────────────────
 * Правилото на дизайна: акцентът е за призиви, връзки и фокус — никога за
 * заглавие. Основният файл има `.woocommerce a:not(.btn):not(.button)`,
 * което при Loralux боядисваше в теракота и минаваше незабелязано. Лилавото
 * не прощава: логото, менюто, филтрите и имената на моделите излизаха
 * лилави наведнъж.
 *
 * Тежестта е нарочна — за да мине пред тяхното правило.
 */
body.koja-anloradelux a.logo:not(.btn),
body.koja-anloradelux a.nav__link:not(.btn),
body.koja-anloradelux a.menu-link:not(.btn),
body.koja-anloradelux a.filter-row:not(.btn),
body.koja-anloradelux .woocommerce-breadcrumb,
body.koja-anloradelux .woocommerce-breadcrumb a:not(.btn){
  color:var(--text-body);
}

body.koja-anloradelux a.nav__link:not(.btn):hover,
body.koja-anloradelux a.menu-link:not(.btn):hover,
body.koja-anloradelux a.filter-row:not(.btn):hover,
body.koja-anloradelux .woocommerce-breadcrumb a:not(.btn):hover{
  color:var(--text-strong);
}

body.koja-anloradelux a.icon-btn:not(.btn),
body.koja-anloradelux button.icon-btn{ color:var(--text-strong) }

/* ── Бутоните на темата (каталог, продукт, количка, чекаут) ─────────── */

.koja-anloradelux .btn{
  border-radius:var(--radius-sm);
  height:48px;
  font-size:14px;
  font-weight:600;
  gap:10px;
}

.koja-anloradelux .btn--tall{height:56px;font-size:16px}
.koja-anloradelux .btn--md{height:44px;font-size:14px}
.koja-anloradelux .btn--sm{height:36px;font-size:13px}

/* Посетеният основен бутон НЕ потъмнява. Темата го прави заради Loralux,
   но тук клиентът го чете като друг бутон, а не като същия. */
.koja-anloradelux .btn--primary,
.koja-anloradelux .btn--primary:visited{
  background:var(--action-primary);
  color:var(--action-primary-fg);
  box-shadow:none;
}

.koja-anloradelux .btn--primary:hover{background:var(--action-primary-hover);color:var(--action-primary-fg)}
.koja-anloradelux .btn--primary:active{background:var(--clay-600)}

.koja-anloradelux .btn--add{
  border-radius:var(--radius-sm);
  border:0;
  background:var(--action-primary);
  color:var(--action-primary-fg);
  font-weight:600;
}

.koja-anloradelux .btn--add:hover{
  background:var(--action-primary-hover);
  color:var(--action-primary-fg);
  border-color:transparent;
}

/* Мостът за плочките на началната: там бутонът носи `adl-btn`, но и `button`,
   а main.css лови `.woocommerce a.button` с по-голяма тежест и го пребоядисва.
   Тук се връща видът на дизайна с една степен отгоре. */
body.koja-anloradelux .woocommerce ul.products li.product a.button{
  background:var(--action-primary);
  color:#FFFFFF;
  border:0;
  border-radius:var(--radius-sm);
}

body.koja-anloradelux .woocommerce ul.products li.product a.button:hover{
  background:var(--action-primary-hover);
  color:#FFFFFF;
}

/* ── Каталогът: картите там си остават на разметката на темата ─────── */

.koja-anloradelux .grid--4,
.koja-anloradelux .grid--3{ gap:32px }

.koja-anloradelux .product-card{
  border:1px solid var(--line-hairline);
  background:var(--surface-card);
  border-radius:var(--radius-md);
  overflow:hidden;
  box-shadow:none;
  transition:transform 220ms cubic-bezier(.16,1,.3,1),
             box-shadow 220ms cubic-bezier(.16,1,.3,1),
             border-color 150ms;
}

.koja-anloradelux .product-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
  border-color:var(--line-default);
}

/* Снимката ЗАПЪЛВА рамката, дори когато трябва да се реже. Преди тук
   стоеше contain и легналите модели (50×40) висяха с бяло поле под себе
   си — картата зейваше и решетката изглеждаше счупена. Отвесните 3:4
   съвпадат точно с рамката и не губят нищо; при легналите се отрязват
   краищата, а целият кадър се вижда на страницата на продукта. */
.koja-anloradelux .product-card__media{
  display:block;
  aspect-ratio:3/4;
  background:var(--paper-200);
  overflow:hidden;
}

.koja-anloradelux .product-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

body.koja-anloradelux .product-card a.product-card__name:not(.btn){
  display:block;
  font-family:var(--font-sans);
  font-size:14px;
  font-weight:500;
  line-height:1.45;
  padding:16px 16px 0;
  color:var(--text-strong);
}

body.koja-anloradelux .product-card a.product-card__name:not(.btn):hover{ color:var(--text-accent) }

.koja-anloradelux .product-card__meta{
  font-size:12px;
  color:var(--text-muted);
  padding:6px 16px 0;
  margin:0;
}

.koja-anloradelux .product-card__foot{
  flex-direction:column;
  align-items:stretch;
  gap:10px;
  padding:10px 16px 16px;
}

.koja-anloradelux .product-card .price{ font-size:18px }

.koja-anloradelux .product-card .btn--add{
  width:100%;
  height:44px;
  font-size:14px;
}

/* „НОВО“ е очертан, не плътен: плътният силен цвят е запазен за намалението. */
body.koja-anloradelux .badge--new{
  background:transparent;
  color:var(--text-strong);
  border:1px solid var(--line-default);
  backdrop-filter:blur(4px);
}

body.koja-anloradelux .badge--sale,
body.koja-anloradelux .onsale{
  background:#B4453C;
  color:#FFFFFF;
  border:0;
}

@media (max-width:600px){
  body.koja-anloradelux .band{ padding-inline:24px }
  .koja-anloradelux .grid--4,
  .koja-anloradelux .grid--3{ gap:16px }
}

@media (prefers-reduced-motion:reduce){
  .koja-anloradelux .product-card{ transition:none }
  .koja-anloradelux .product-card:hover{ transform:none }
}

/* ── Мостът към нашия WebP път ───────────────────────────────────────
 * ЕДИНСТВЕНОТО място в този файл, което пипа `adl-*` класове, и то по
 * необходимост, а не по дизайн.
 *
 * Изходният буфер на темата обвива ВСЕКИ `<img>` в `<picture>`, за да
 * подаде WebP. Затова правилата на дизайна, писани като
 * `.adl-mat__frame > img`, изобщо не достигат снимката: тя е внуче, не
 * дете. Паспартуто оставаше без размер, а рязането на щампования номер
 * не се случваше.
 *
 * Тук същите правила се повтарят през `<picture>`. Стойностите са
 * дословно тези на дизайна — не се променят, само се пренасочват.
 */
body.koja-anloradelux .adl-mat__frame > picture{
  display:block;
  width:100%;
  height:100%;
}

body.koja-anloradelux .adl-mat__frame > picture > img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform 360ms cubic-bezier(.16,1,.3,1);
}

/* Долните ~12% от картината падат: там стои щампованият номер. */
body.koja-anloradelux .adl-mat__frame--crop-stamp > picture > img{
  height:114%;
  object-position:center top;
}

body.koja-anloradelux .adl-cat:hover .adl-mat__frame > picture > img{
  transform:scale(1.035);
}

body.koja-anloradelux .woocommerce ul.products li.product .adl-mat__frame > picture{
  display:block;
  width:100%;
  height:100%;
}

@media (prefers-reduced-motion:reduce){
  body.koja-anloradelux .adl-mat__frame > picture > img{ transition:none }
  body.koja-anloradelux .adl-cat:hover .adl-mat__frame > picture > img{ transform:none }
}

/* ── Поправки от прегледа на Никола ─────────────────────────────────── */

/* БУТОНЪТ БЕШЕ ПРАЗЕН, не голям: текстът излизаше ЛИЛАВ ВЪРХУ ЛИЛАВО.
   Правилото `.woocommerce a:not(.btn):not(.button)` в основния файл хваща
   `.btn--add`, защото той няма нито класа `btn`, нито `button` — при
   Loralux даваше теракота върху бяло и никой не забеляза. Тежестта тук е
   с една степен отгоре. */
/* Тежестта е нарочна и повтаря формата на отсрещното правило.
   ПЪРВИЯТ ми опит беше `body.koja-anloradelux .woocommerce a.btn--add` и
   НЕ работеше: WooCommerce слага класа `woocommerce` ВЪРХУ тялото, а този
   селектор търси елемент с този клас ВЪТРЕ в него. Броеше се само
   по-слабата половина и лилавото оставаше. */
body.koja-anloradelux a.btn--add:not(.btn),
body.koja-anloradelux a.btn--add:not(.btn):visited,
body.koja-anloradelux a.btn--add:not(.btn):hover,
body.koja-anloradelux a.btn--add:not(.btn):focus{
  color:var(--action-primary-fg);
}

/* --- Редът с приложените филтри ---
   Нямаше никакъв стил: чиповете и „Изчисти всички“ стояха слепени в един
   ред без въздух. */
.koja-anloradelux .applied-filters{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin:0 0 28px;
  padding:14px 16px;
  background:var(--paper-100);
  border-radius:var(--radius-md);
}

.koja-anloradelux .chip--applied{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:32px;
  padding:0 6px 0 12px;
  background:var(--surface-card);
  border:1px solid var(--line-hairline);
  border-radius:999px;
  font-size:13px;
  color:var(--text-strong);
}

.koja-anloradelux .chip--applied .chip__x{
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:999px;
  color:var(--text-muted);
  transition:background 150ms,color 150ms;
}

.koja-anloradelux .chip--applied .chip__x:hover{
  background:var(--paper-200);
  color:var(--text-strong);
}

body.koja-anloradelux .applied-filters a.link-arrow:not(.btn){
  color:var(--text-accent);
  font-size:13px;
  margin-left:4px;
}

/* --- Броячът и подредбата на един ред, подравнени по средата --- */
.koja-anloradelux .section-head .row--wrap{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:16px;
}

.koja-anloradelux .woocommerce-result-count{
  margin:0;
  font-size:14px;
  color:var(--text-muted);
  line-height:40px;
}

.koja-anloradelux .woocommerce-ordering{ margin:0 }

.koja-anloradelux .woocommerce-ordering select.orderby{
  height:40px;
  border-radius:var(--radius-sm);
  border:1px solid var(--line-default);
  background-color:var(--surface-card);
  font-size:14px;
  padding:0 34px 0 14px;
}

.koja-anloradelux .filters-toggle{ height:40px }

/* --- Полето за търсене в колоната с филтрите --- */
.koja-anloradelux .filter-search__pole{
  display:flex;
  align-items:center;
  gap:6px;
  height:42px;
  padding:0 6px 0 12px;
  background:var(--surface-card);
  border:1px solid var(--line-default);
  border-radius:var(--radius-sm);
  transition:border-color 150ms;
}

.koja-anloradelux .filter-search__pole:focus-within{ border-color:var(--clay-400) }

.koja-anloradelux .filter-search__pole input{
  flex:1 1 auto;
  min-width:0;
  border:0;
  background:transparent;
  font:inherit;
  font-size:14px;
  color:var(--text-strong);
  outline:none;
}

.koja-anloradelux .filter-search__pole input::placeholder{ color:var(--text-subtle) }

.koja-anloradelux .filter-search__pole button{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:0;
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
  transition:background 150ms,color 150ms;
}

.koja-anloradelux .filter-search__pole button:hover{
  background:var(--paper-100);
  color:var(--text-strong);
}

/* Групите във филтъра дишат повече. */
.koja-anloradelux .filters .filter-group{ margin-bottom:28px }
.koja-anloradelux .filters .label-caps{ margin-bottom:12px }

/* --- Бутонът „Купи“ на плочките ------------------------------------
 * Три поправки наведнъж, всичките забелязани от Никола:
 *
 * 1. Текстът стоеше ГОРЕ, не в средата. Основният файл слага
 *    `display:block` върху `.woocommerce a.button`, а `align-items:center`
 *    от дизайна не върши нищо върху блоков елемент.
 * 2. Бутонът се разтягаше на цял ред. В референцията е 84×48 — компактен.
 *    README-то на дизайна казва „full-width“, но самият макет показва
 *    друго; вярваме на макета, него е гледал клиентът.
 * 3. Височината идва от дизайна: 48 px, шрифт 14/600, ъгъл 8.
 */
body.koja-anloradelux .woocommerce ul.products li.product a.button,
body.koja-anloradelux a.btn--add:not(.btn){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  justify-self:start;
  width:auto;
  height:48px;
  padding:0 24px;
  font-size:14px;
  font-weight:600;
  line-height:1;
  border-radius:var(--radius-sm);
}

/* В тесните карти на каталога бутонът пак не бива да излиза извън тях. */
body.koja-anloradelux .product-card a.btn--add:not(.btn){
  max-width:100%;
}

@media (max-width:600px){
  body.koja-anloradelux .woocommerce ul.products li.product a.button,
  body.koja-anloradelux a.btn--add:not(.btn){
    height:44px;
    padding:0 18px;
  }
}

/* Предпазна мрежа за паспартуто: снимката запълва рамката НЕЗАВИСИМО колко
   обвивки има около нея. Дизайнът пише `> img`, буферът за WebP добавя
   <picture>, а веднъж се получи и picture в picture — и всяко ново ниво
   чупеше запълването тихо.

   ЛЕГНАЛИТЕ СНИМКИ. `height:100%` не стигаше: рамката държи височината си
   от `aspect-ratio`, а процентната височина през нея не се разрешаваше и
   снимката падаше на СВОЕТО съотношение. При изправените (3:4) то съвпада
   с рамката и всичко изглеждаше наред; при легналите (5:4) снимката ставаше
   230×184 в рамка 230×307 и отдолу зееше бяло поле - точно каквото Никола
   видя при 141 и 158. `object-fit:cover` не помага, защото режи вътре в
   размера на самата снимка, а той вече е грешен.

   Затова снимката се закача за рамката с `position:absolute; inset:0`:
   размерът ѝ идва от рамката, не от собственото ѝ съотношение, и е без
   значение колко обвивки има между двете. */
body.koja-anloradelux .adl-mat__frame{ position:relative }

body.koja-anloradelux .adl-mat__frame > picture{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
}

body.koja-anloradelux .adl-mat__frame img{
  position:absolute;
  inset:0;
  width:100%;
  /* `!important` е тук по НЕОБХОДИМОСТ, не от мързел: без него височината
     идва от `aspect-ratio` на атрибутите width/height, които WordPress
     слага на всяка снимка, и легналите падат на 230×184 в рамка 230×307.
     Проверено на живо - със същия селектор без `!important` височината
     остава 184 px, с него става 307. Останалите свойства от правилото се
     прилагат нормално, тоест не е въпрос на специфичност на селектора. */
  height:100% !important;
  object-fit:cover;
  display:block;
}

/* Долните ~12% падат: там стои щампованият номер. `inset:0` дава и долен
   ръб, който би сплескал 114-те процента - затова се пуска. */
body.koja-anloradelux .adl-mat__frame--crop-stamp img{
  bottom:auto;
  height:114% !important;
  object-position:center top;
}

/* --- Бутоните на началната лягат на една линия ----------------------
   Имената са с различен брой редове и бутонът под тях подскачаше нагоре-
   надолу от карта на карта. Плочката става колона, а бутонът се залепя за
   дъното ѝ: в решетка картите в един ред са еднакво високи, значи и
   бутоните лягат на една линия. */
body.koja-anloradelux .woocommerce ul.products li.product{
  display:flex;
  flex-direction:column;
  align-items:stretch;
}

body.koja-anloradelux .woocommerce ul.products li.product a.button{
  margin-top:auto;
  align-self:start;
}

body.koja-anloradelux .woocommerce ul.products li.product .price{
  margin-top:6px;
  margin-bottom:12px;
}

/* --- Колонтитулът: буквите бели, не лилави --------------------------
   Връзките наследяваха --text-link (лилаво), което върху мастиленото поле
   чете като крещящо. По желание на Никола са бели; заглавията на колоните
   остават приглушени за йерархия. */
body.koja-anloradelux .site-footer a:not(.btn){
  color:#FFFFFF;
}

body.koja-anloradelux .site-footer a:not(.btn):hover{
  color:#FFFFFF;
  text-decoration:underline;
}

body.koja-anloradelux .site-footer .site-footer__col h2,
body.koja-anloradelux .site-footer .site-footer__col h3{
  color:#A8A29A;
}

/* Кръгчетата на социалните също не бива да са лилави. */
body.koja-anloradelux .site-footer .social a:not(.btn){
  color:#D6D1C9;
  border-color:rgba(255,255,255,.2);
}

body.koja-anloradelux .site-footer .social a:not(.btn):hover{ color:#FFFFFF }


/* ── Бутонът „Купи" в решетката ──────────────────────────────────────
 *
 * Беше малко хапче вляво: долният ръб на картите излизаше назъбен, а
 * лилавото се повтаряше четири пъти на ред и отслабваше истинските
 * призиви (героя, „Разгледай колекцията", „Към продуктите"). Тук е тих:
 * бял фон, тънка рамка, мастилен текст - и пълна ширина, за да свършва
 * всяка карта на една линия.
 *
 * Текстът се сменя на „Добавено" от main.js без бутонът да мърда,
 * затова височината е фиксирана, а не от съдържанието.
 */
body.koja-anloradelux ul.products li.product a.button,
body.koja-anloradelux ul.products li.product button.button,
body.koja-anloradelux .adl-products a.button{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:44px; margin-top:var(--adl-space-3);
  background:#fff; color:var(--adl-text-strong);
  border:1px solid var(--adl-border-default,#E6E2DC);
  border-radius:var(--adl-radius-control,6px);
  font-weight:600; white-space:nowrap;
}

body.koja-anloradelux ul.products li.product a.button:hover,
body.koja-anloradelux ul.products li.product button.button:hover{
  background:var(--adl-surface-sunken,#F7F5F2);
  border-color:var(--adl-border-strong,#D6D1C9);
}

/* ── Обобщението на поръчката на телефон ─────────────────────────────
 *
 * „(включва 3,69 € ДДС)" стои в един ред със сумата и при 375 px
 * избутваше страницата 43 px навън: последните знаци се губеха извън
 * екрана. Появява се само на сайта с ДДС регистрация, затова дълго
 * изглеждаше, че единият сайт е по-счупен от другия.
 */
.woocommerce-checkout .order-total .includes_tax,
.woocommerce-checkout .includes_tax{
  display:block; white-space:normal; font-size:12px; line-height:1.4;
}


/* ── Щампованият номер на НАЧАЛНАТА страница ─────────────────────────
 *
 * Номерът е отпечатан в долния ляв ъгъл на самата картина - тъмен, с
 * контур, и го няма на всички модели. В магазина върши работа: по него
 * се поръчва по телефона. На началната обаче чете като дефект по
 * платното, а неравномерното му присъствие - като немарливост.
 *
 * Затова кадърът се вдига с 14% и се закача горе: долната лента с
 * номера излиза извън рамката. Само тук - `body.home` пази магазина и
 * страницата на продукта непокътнати.
 *
 * Селекторите са без `>`, защото изходният буфер за WebP слага <picture>
 * между рамката и снимката: `> img` не хваща нищо.
 */
body.koja-anloradelux.home .adl-mat__frame img,
body.koja-anloradelux.home .adl-hero__print img{
  height:114% !important;
  object-fit:cover;
  object-position:center top;
}

/* Разпечатките в героя са позиционирани по съотношение, не по inset:
   вдигането иска и загърбване на височината от aspect-ratio. */
body.koja-anloradelux.home .adl-hero__print img{
  aspect-ratio:auto;
}


/* ── Количка и поръчка на телефон ────────────────────────────────────
 *
 * Обвивката слагаше 24 px отвътре плюс 16 px отвън - 80 px от 375 си
 * отиваха в поле, а полетата за адрес оставаха 130 px и всичко се
 * сгъчкваше. На четящите страници широкото поле е добре, тук пречи.
 */
@media (max-width: 640px) {
  body.koja-anloradelux.woocommerce-checkout .band,
  body.koja-anloradelux.woocommerce-cart .band { padding-inline: 12px }

  body.koja-anloradelux.woocommerce-checkout .checkout,
  body.koja-anloradelux.woocommerce-cart .woocommerce { margin-inline: -4px }
}


/* Клетката с групата е връзка - трябва да личи, без да крещи. */
body.koja-anloradelux .adl-vp--link{
  text-decoration:none; color:inherit;
  transition:color .18s ease, transform .18s ease;
}

body.koja-anloradelux .adl-vp--link:hover{ transform:translateY(-1px) }
body.koja-anloradelux .adl-vp--link:hover .adl-vp__title{ text-decoration:underline; text-underline-offset:3px }