/* Cookie banner: bottom left on desktop, full-width sheet on phones. No blur or backdrop effects (kept cheap for phones). */
.cc {
  position: fixed;
  left: 20px;
  bottom: 16px;
  z-index: 1000;
  width: min(460px, calc(100vw - 40px));
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  padding: 22px 22px 18px;
  border: 1px solid rgba(253, 241, 225, 0.28);
  border-radius: 22px;
  color: #fdf1e1;
  background: #14243a;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  text-align: left;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 260ms ease, transform 260ms ease;
}
.cc[hidden] { display: none; }
.cc.is-in { opacity: 1; transform: none; }
.cc:focus { outline: none; }

.cc-title {
  margin: 0 0 8px;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.1;
  color: #e8b86a;
}
.cc-text { margin: 0 0 16px; max-width: none; font-size: 0.92rem; line-height: 1.5; opacity: 0.92; }
.cc-text a { color: inherit; text-underline-offset: 3px; }

.cc-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cc-btn {
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid #fdf1e1;
  border-radius: 999px;
  color: #111411;
  background: #fdf1e1;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 160ms ease, transform 160ms ease;
}
.cc-btn:hover { background: #fff8ee; transform: translateY(-1px); }
.cc-btn:focus-visible,
.cc-link:focus-visible,
.cc-switch input:focus-visible + .cc-track { outline: 2px solid #e8b86a; outline-offset: 3px; }

.cc-more { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; margin-top: 12px; font-size: 0.85rem; }
.cc-link { padding: 4px 0; border: 0; color: inherit; background: none; font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; opacity: 0.9; }
.cc-link:hover { opacity: 1; }
.cc-legal a { color: inherit; opacity: 0.7; text-underline-offset: 3px; }
.cc-legal a + a::before { content: "·"; margin: 0 6px; }

/* settings view */
.cc-options { display: grid; gap: 10px; margin: 0 0 16px; padding: 0; border: 0; }
.cc-option {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 14px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid rgba(253, 241, 225, 0.2);
  border-radius: 16px;
  background: rgba(253, 241, 225, 0.05);
}
.cc-option b { font-size: 0.95rem; font-weight: 600; }
.cc-option p { grid-column: 1 / -1; margin: 0; max-width: none; font-size: 0.82rem; line-height: 1.45; opacity: 0.8; }
.cc-switch { position: relative; display: inline-block; width: 46px; height: 26px; }
.cc-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.cc-switch input:disabled { cursor: not-allowed; }
.cc-track { position: absolute; inset: 0; border-radius: 999px; background: rgba(253, 241, 225, 0.28); transition: background-color 160ms ease; pointer-events: none; }
.cc-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fdf1e1; transition: transform 160ms ease; }
.cc-switch input:checked + .cc-track { background: #e8b86a; }
.cc-switch input:checked + .cc-track::after { transform: translateX(20px); background: #111411; }
.cc-switch input:disabled + .cc-track { opacity: 0.6; }

@media (max-width: 640px) {
  .cc { left: 10px; right: 10px; bottom: 10px; width: auto; padding: 18px 16px 14px; border-radius: 20px; }
  .cc-title { font-size: 1.3rem; }
  .cc-text { font-size: 0.88rem; }
}
@media (prefers-reduced-motion: reduce) {
  .cc, .cc-btn, .cc-track, .cc-track::after { transition: none; }
}