/* ============================================================================
   Плашка cookie. Замена попапа Elementor 4059.
   Значения — только из tokens.css.

   Это полоса внизу экрана, а не модальное окно: без затемнения, без
   блокировки прокрутки, страницу можно читать и не нажимая «Хорошо».
   position: fixed — появление плашки не двигает контент, CLS остаётся 0.
   ========================================================================== */

.dkCookie {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  /* Ниже окна записи (.dkZ, z-index 90) и выше всего остального:
     открытая форма записи обязана перекрывать плашку, а не наоборот. */
  z-index: 80;
  padding: 12px var(--gutter);
  /* Полоса жестов iPhone: без этого кнопка уезжает под неё. */
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid var(--line);
  /* Тень синяя — серых в системе нет. */
  box-shadow: 0 -6px 18px rgba(0, 60, 110, .10);
  font-family: var(--font-body);
  color: var(--body);
}

.dkCookie,
.dkCookie *,
.dkCookie *::before,
.dkCookie *::after { box-sizing: border-box; }

.dkCookie__wrap {
  max-width: var(--max);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 24px;
}

.dkCookie__text {
  /* 320px — базис, а не ширина: на узком экране строка переносится,
     на широком текст и кнопка стоят в одну линию. */
  flex: 1 1 320px;
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

/* Два класса в селекторе — иначе kit Elementor (.elementor-kit-N a)
   перекрасит ссылку в свой голубой, и без !important это не лечится. */
.dkCookie .dkCookie__link {
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.dkCookie .dkCookie__link:hover { color: var(--cyan); }

.dkCookie .dkCookie__link:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
  border-radius: 2px;
}

.dkCookie__form {
  flex: 0 0 auto;
  margin: 0;
}

/* Тоже два класса: одиночный .dkCookie__btn гасится правилами kit. */
.dkCookie .dkCookie__btn {
  min-height: 44px;
  padding: 0 28px;
  border: 1px solid var(--accent);
  border-radius: var(--r-pill);
  background: var(--accent);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}

.dkCookie .dkCookie__btn:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}

.dkCookie .dkCookie__btn:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
}

/* Плашка перекрывает низ подвала, а там обязательные оговорки про
   противопоказания. Отступ задан на первой отрисовке, до первого кадра,
   поэтому сдвига не даёт: CLS считает изменения ПОСЛЕ отрисовки.
   :has() не поддержан — отступа не будет, плашка просто ляжет поверх;
   это ухудшение вида, а не поломка.

   env(...) обязан быть и здесь, а не только в самой плашке: на iPhone
   с полосой жестов плашка становится на высоту инсета выше, и резерв
   без него оказывается меньше плашки — замер headless Chrome при инсете
   34 px: плашка 152 px против резерва 148 px на 375–430 px и 171,5 против
   148 на 320 px. Перекрывался низ подвала — там оговорка о противопоказаниях.
   Голые числа: замерено на этой же вёрстке — 69 px на десктопе (резерв 84)
   и 118–137,5 px на мобильном (резерв 148). */
html:has(.dkCookie) body { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }

@media (max-width: 640px) {
  .dkCookie__wrap { gap: 10px; }
  .dkCookie__text { flex: 1 1 100%; font-size: 13px; }
  .dkCookie__form { width: 100%; }
  .dkCookie .dkCookie__btn { width: 100%; }
  html:has(.dkCookie) body { padding-bottom: calc(148px + env(safe-area-inset-bottom, 0px)); }
}

@media print {
  .dkCookie { display: none; }
  html:has(.dkCookie) body { padding-bottom: 0; }
}