/* «Согласие на cookies». Цвета и радиусы — из токенов темы, со своими запасными значениями.
   Широкий экран — строка: текст слева, кнопки справа; узкий — текст сверху, кнопки во всю ширину. */
.cc {
  --cc-text: var(--color-text, #0f1a2b);
  --cc-muted: var(--color-text-muted, #5c6e85);
  --cc-surface: var(--color-bg-page, #fff);
  --cc-border: var(--color-border-card, #e7ecf3);
  --cc-accent: var(--color-accent-button, #1f6f5a);
  --cc-accent-hover: var(--color-accent-text, #185a49);
  --cc-radius: var(--radius-lg, 14px);
  --cc-radius-sm: var(--radius-sm, 8px);
  position: fixed; z-index: 10000; inset-inline: 16px; inset-block-end: 16px;
  display: flex; align-items: center; gap: 16px;
  max-inline-size: 960px; margin-inline: auto; padding: 14px 18px;
  border: 1px solid var(--cc-border); border-radius: var(--cc-radius);
  background: var(--cc-surface); color: var(--cc-text);
  box-shadow: 0 16px 40px -18px rgba(15, 26, 43, 0.45);
  font: inherit; font-size: 14px; line-height: 1.45;
}
.cc[hidden], .cc__choices[hidden], .cc__button[hidden] { display: none; }
.cc__body { display: grid; gap: 8px; min-inline-size: 0; }
.cc__text { margin: 0; }
.cc__more { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.cc__choices { display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--cc-muted); }
.cc__choices label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.cc__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-inline-start: auto; }
.cc__button {
  min-block-size: 38px; padding: 8px 16px;
  border: 1px solid var(--cc-border); border-radius: var(--cc-radius-sm);
  background: var(--cc-surface); color: var(--cc-text);
  font: inherit; font-weight: 600; cursor: pointer;
}
.cc__button:hover { border-color: var(--cc-muted); }
.cc__button--primary { border-color: var(--cc-accent); background: var(--cc-accent); color: #fff; }
.cc__button--primary:hover { border-color: var(--cc-accent-hover); background: var(--cc-accent-hover); }
.cc__button:focus-visible, .cc-settings:focus-visible { outline: 2px solid var(--cc-accent); outline-offset: 2px; }
.cc-settings {
  position: fixed; z-index: 9999; inset-inline-end: 16px; inset-block-end: 16px;
  display: inline-grid; place-items: center; inline-size: 40px; block-size: 40px; padding: 0;
  border: 1px solid var(--color-border-card, #e7ecf3); border-radius: 50%;
  background: var(--color-bg-page, #fff); color: var(--color-text, #0f1a2b); cursor: pointer;
  box-shadow: 0 8px 20px -12px rgba(15, 26, 43, 0.45);
}
.cc:not([hidden]) ~ .cc-settings { display: none; }
@media (max-width: 700px) {
  .cc { flex-direction: column; align-items: stretch; inset-inline: 12px; inset-block-end: 12px; padding: 14px; }
  .cc__actions { margin-inline-start: 0; }
  .cc__button { flex: 1 1 0; }
}