/*
 * Camelia Flowers — токены оформления.
 * Единственный источник значений: clients/camelia-flowers/design.md §4–§6.
 * Все контрасты посчитаны по формуле WCAG, минимум по тексту 4,62 при норме 4,5.
 *
 * Здесь только слой токенов и правила, которые Elementor не умеет выразить
 * настройкой (bidi, запрет синтетических начертаний, кольцо фокуса).
 * Вёрстка секций живёт в Elementor, а не тут.
 */

:root{
  /* --- поверхности --- */
  --cml-bumaga:        #F7F3F1;  /* полотно страницы */
  --cml-kartochka:     #FFFFFF;  /* карточки, формы, панели */
  --cml-polosa:        #FCF9F7;  /* секции-разделители, шапки таблиц */

  /* --- текст --- */
  --cml-zagolovok:     #1B1726;  /* 15,91 к бумаге */
  --cml-tekst:         #66646E;  /* 5,27 к бумаге */
  --cml-prigl:         #6F6C79;  /* 4,65 к бумаге — единственный приглушённый */

  /* --- акценты. Три плашки — подпись шаблона --- */
  --cml-siren:         #755EC0;  /* 5,10 с белым */
  --cml-siren-hover:   #6950BB;  /* 6,06 с белым */
  --cml-lajm:          #C2CD4A;  /* фон плашки, надпись только тёмная */
  --cml-rozovyj:       #F6B6CC;  /* фон плашки, надпись только тёмная */

  /* --- служебные --- */
  --cml-granica-polya: #8A8699;  /* 3,20 к бумаге, порог нетекста 3,0 */
  --cml-oshibka:       #A32A22;
  --cml-uspeh:         #2E6B4F;
  --cml-fokus:         #1B1726;  /* одно кольцо проходит на всех фонах сайта */
  --cml-linii:         #E7E1DD;  /* только декор, текстом не бывает */

  /* --- форма --- */
  --cml-radius-knopki: 30px;     /* капсула по шаблону */
  --cml-radius-bloka:  8px;
  --cml-perehod:       180ms;    /* только смена состояний, 150–200 мс */

  /* --- гарнитуры --- */
  --cml-antikva: 'Camelia Serif', 'Frank Ruhl Libre', Georgia, 'Times New Roman', serif;
  --cml-grotesk: 'Camelia Sans', 'Rubik', Arial, sans-serif;
}

/* ⚠ Синтетический жир и синтетический курсив запрещены.
   Ивритского курсива не существует — браузер обязан не выдумывать его. */
html, body, input, select, textarea, button{
  font-synthesis: none;
  -webkit-font-synthesis: none;
}

body{
  background-color: var(--cml-bumaga);
  color: var(--cml-tekst);
  font-family: var(--cml-antikva);
}

/* Числа, цены, даты и телефоны внутри ивритского текста — через <bdi>.
   Без изоляции «₪ 250» и «054-3160601» рассыпаются на RTL-строке. */
bdi{ unicode-bidi: isolate; }

/* Кольцо фокуса видимое на всех четырёх фонах сайта.
   Убирать outline без замены запрещено — ת"י 5568 AA. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible{
  outline: 2px solid var(--cml-fokus);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Тап-цели: 48×48 и промежуток 8 px. */
@media (pointer: coarse){
  :where(a.button, button, .elementor-button, input[type="submit"]){
    min-height: 48px;
    min-width: 48px;
  }
}

/* Движение — только переходы состояний. Уважаем настройку системы. */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Светлые плашки шаблона: цвет плашки не тронут, надпись тёмная.
   Лайм — 10,13, розовая — 10,43 при норме 4,5. */
.cml-plashka-lajm{    background: var(--cml-lajm);    color: var(--cml-zagolovok); }
.cml-plashka-rozovaya{background: var(--cml-rozovyj); color: var(--cml-zagolovok); }
.cml-plashka-siren{   background: var(--cml-siren);   color: #FFFFFF; }

/* Мелкая прописная метка — единственное место гротеска в содержании. */
.cml-metka{
  font-family: var(--cml-grotesk);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--cml-prigl);
}

/* Цена читается, а не кричит: вес 500, не 700. */
.cml-cena{ font-family: var(--cml-antikva); font-weight: 500; }

/* ============================================================
   Собственные кнопки темы Kava — на те же токены.
   Elementor красит только свои виджеты, а у темы остаётся её
   заводская синяя кнопка: на любом кадре сайта она спорит
   с принятой палитрой. Это применение токенов, а не вёрстка
   страниц: сами страницы собираются в Elementor.
   ============================================================ */
.btn, .button, button, input[type="submit"], input[type="button"],
.wp-block-button__link, .woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit{
  background-color: var(--cml-siren);
  border-color: var(--cml-siren);
  color: #FFFFFF;
  border-radius: var(--cml-radius-knopki);
  font-family: var(--cml-grotesk);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .7px;
  text-transform: uppercase;
  transition: background-color var(--cml-perehod) ease, border-color var(--cml-perehod) ease;
}
.btn:hover, .button:hover, button:hover, input[type="submit"]:hover,
.wp-block-button__link:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce #respond input#submit:hover{
  background-color: var(--cml-siren-hover);
  border-color: var(--cml-siren-hover);
  color: #FFFFFF;
}

/* Ссылки — один сиреневый на весь сайт, второго нет нигде. */
a{ color: var(--cml-siren); }
a:hover, a:focus{ color: var(--cml-siren-hover); }

/* Поля ввода: капсула и граница, прошедшая порог нетекстовых 3,0. */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"],
input[type="number"], input[type="password"], select, textarea{
  border: 1px solid var(--cml-granica-polya);
  border-radius: var(--cml-radius-knopki);
  background: var(--cml-kartochka);
  color: var(--cml-zagolovok);
  font-family: var(--cml-antikva);
  font-size: 17px;
}
textarea{ border-radius: var(--cml-radius-bloka); }