/* ============================================================
   Плавающий cookie-баннер — компактная карточка в левом нижнем углу
   Подключить в <head>: <link rel="stylesheet" href="/css/cookie-banner.css">
   ============================================================ */

/* --- Позиционирование карточки --- */
#cookie-banner {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 9999;
  max-width: 400px;
  width: calc(100% - 48px);   /* на мобильных — не шире экрана */
}

/* --- Сама карточка --- */
.cb-card {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.16), 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 20px 22px;
  font: 14px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  color: #1a1a1a;
}

/* --- Шапка карточки --- */
.cb-card__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.cb-card__icon {
  flex: 0 0 auto;
  display: inline-flex;
}
.cb-card__title {
  font-size: 16px;
  font-weight: 700;
}

/* --- Текст --- */
.cb-card__text {
  margin: 0 0 8px;
  font-size: 13.5px;
  color: #444;
}
.cb-card__text--link {
  margin-bottom: 14px;
}
.cb-card__text a {
  color: #0077cc;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 119, 204, 0.35);
}
.cb-card__text a:hover {
  border-bottom-color: #0077cc;
}

/* --- Кнопки --- */
.cb-card__actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cb-btn {
  padding: 9px 16px;
  border-radius: 10px;
  border: 1px solid transparent;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.cb-btn--primary {
  background: #1a5cff;
  color: #ffffff;
  margin-left: auto;            /* прижимаем к правому краю */
}
.cb-btn--primary:hover {
  background: #1548cc;
}
.cb-btn--ghost {
  background: transparent;
  color: #1a5cff;
  border-color: #c9d6f2;
}
.cb-btn--ghost:hover {
  background: #eef3ff;
  border-color: #1a5cff;
}
.cb-btn--full {
  width: 100%;
  margin-top: 12px;
}

/* --- Блок настроек --- */
.cb-settings {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #eceff4;
}
.cb-check {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 8px 0;
  font-size: 13.5px;
  cursor: pointer;
}
.cb-check input {
  margin-top: 3px;
  accent-color: #1a5cff;
}
.cb-check em {
  display: block;
  font-style: normal;
  font-size: 12px;
  color: #8a8f99;
}

/* --- На мобильных: карточка снизу на всю ширину минус отступы --- */
@media (max-width: 480px) {
  #cookie-banner {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
    max-width: none;
  }
  .cb-card { padding: 16px; }
  .cb-btn--primary { margin-left: 0; width: 100%; }
  .cb-card__actions { flex-direction: column; }
}