/*
  Плашка про cookie. Отдельный файл, потому что подключается и к страницам
  с дизайном сайта (главная, платформа), и к юридическим страницам - у них
  разные таблицы стилей, а плашка должна выглядеть одинаково.

  Специально не опирается на переменные --violet/--body: на части страниц
  их нет, и плашка молча осталась бы без цвета.
*/
#ksi-cookie{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;
  max-width:720px;margin:0 auto;
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;
  padding:16px 18px;border-radius:16px;
  background:#1E1B3F;color:#fff;
  font:14px/1.45 "Onest",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  /* стартовое состояние для появления; класс .show ставится из JS */
  opacity:0;transform:translateY(12px);
  transition:opacity .35s ease,transform .35s ease;
}
#ksi-cookie.show{opacity:1;transform:none}

#ksi-cookie .ksi-cookie-text{flex:1 1 320px}
#ksi-cookie a{color:#B9B3FF}
#ksi-cookie a:hover{color:#fff}

.ksi-cookie-btns{display:flex;gap:10px;flex:0 0 auto}
#ksi-cookie-no{
  flex:0 0 auto;background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55);border-radius:10px;
  padding:10px 18px;font:600 14px/1 inherit;cursor:pointer;transition:border-color .2s,background .2s;
}
#ksi-cookie-no:hover{border-color:#fff;background:rgba(255,255,255,.08)}
#ksi-cookie-no:focus-visible{outline:2px solid #B9B3FF;outline-offset:2px}
#ksi-cookie-ok{
  flex:0 0 auto;
  background:#4438CA;color:#fff;border:0;border-radius:10px;
  padding:10px 18px;font:600 14px/1 inherit;cursor:pointer;
  transition:background .2s,transform .2s;
}
#ksi-cookie-ok:hover{background:#5648E8;transform:translateY(-1px)}
#ksi-cookie-ok:focus-visible{outline:2px solid #B9B3FF;outline-offset:2px}

/* На узком экране кнопка занимает всю ширину - иначе она прижимается к
   правому краю и до неё неудобно дотягиваться большим пальцем */
@media (max-width:560px){
  #ksi-cookie{left:10px;right:10px;bottom:10px;padding:14px 16px;gap:12px}
  .ksi-cookie-btns{width:100%}
  #ksi-cookie-ok,#ksi-cookie-no{flex:1 1 0;min-height:44px}
}

/* Уважаем системную настройку «меньше движения» */
@media (prefers-reduced-motion:reduce){
  #ksi-cookie{transition:none;opacity:1;transform:none}
}
