/* ==========================================================================
   Brastos Sodas — cookie consent (banner, settings dialog, the shared form) + the footer company line
   --------------------------------------------------------------------------
   Every value is a token (tokens.css). The banner is a bottom sheet: --surface, the one sheet shadow,
   at most 30 % of the viewport (it scrolls inside itself beyond that), never covering the drawer
   (z: --z-header < --z-scrim < --z-sheet). Three equal buttons — the same .btn--secondary face, so
   refusing is exactly as easy as accepting. Entrance = a short transform, --t-fade (0 under reduced
   motion; base.css also stops the keyframe).
   ========================================================================== */

/* ---------- banner ---------- */
.consent { position: fixed; inset-inline: 0; bottom: 0; z-index: var(--z-header); max-height: 30dvh; overflow-y: auto; overscroll-behavior: contain;
  padding-block: var(--sp-4) max(var(--sp-4), env(safe-area-inset-bottom)); padding-inline: env(safe-area-inset-left) env(safe-area-inset-right);
  background: var(--surface); color: var(--ink); border-top: 1px solid var(--line); box-shadow: var(--shadow-sheet);
  animation: consent-in var(--t-fade) var(--ease-out); }
.consent__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3) var(--sp-6); }
.consent__text { flex: 1 1 auto; min-width: 0; max-width: var(--measure); font-size: var(--fz-meta); line-height: var(--lh-body); color: var(--ink-soft); }
.consent__title { margin-bottom: var(--sp-1); font-family: var(--ff-body); font-size: var(--fz-ui); font-weight: 600; line-height: var(--lh-tight); color: var(--ink); }
.consent__text a, .consent-dlg a, .consent-page a { color: var(--link); text-underline-offset: 3px; }
.consent__text a:hover, .consent-dlg a:hover, .consent-page a:hover { color: var(--link-hover); }
.consent__actions { flex: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-2); }
.consent__actions .btn, .consent-actions .btn { min-height: var(--target-min); }
/* the page can still be scrolled to its last line while the sheet is up */
body[data-consent] { padding-bottom: var(--consent-h, 0); }

@keyframes consent-in { from { transform: translateY(var(--sp-4)); } to { transform: none; } }   /* transform only: a throttled background tab never paints a half-transparent sheet */

@media (max-width: 899px) {
  .consent__inner { flex-direction: column; align-items: stretch; }
  .consent__actions .btn { padding-inline: var(--sp-2); white-space: normal; text-align: center; }
}
@media (max-width: 599px) {
  .consent { padding-top: var(--sp-3); }
  .consent__inner { gap: var(--sp-3); }
}

/* ---------- settings dialog (native <dialog>: top layer, inert page, Escape) ---------- */
.consent-dlg { width: min(600px, 100% - 2 * var(--gutter)); max-height: calc(100dvh - 2 * var(--sp-5)); margin: auto; padding: var(--sp-5) var(--sp-6) var(--sp-6);
  border: 0; border-radius: var(--rad-l); background: var(--surface); color: var(--ink); box-shadow: var(--shadow-sheet); overscroll-behavior: contain; }
.consent-dlg[open] { animation: consent-in var(--t-fade) var(--ease-out); }
.consent-dlg::backdrop { background: var(--scrim); }
.consent-dlg__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-2); }
.consent-dlg__head h2 { font-size: var(--fz-h3); line-height: var(--lh-tight); }
.consent-dlg__close { display: grid; place-items: center; flex: none; width: var(--target-min); height: var(--target-min); margin-right: calc(-1 * var(--sp-2)); border: 0; border-radius: var(--rad-pill); background: transparent; color: var(--ink);
  transition: background-color var(--t-colour) var(--ease-out), transform var(--t-press) var(--ease-out); }
.consent-dlg__close:hover { background: var(--page); }
.consent-dlg__close:active { transform: scale(.97); }
.consent-dlg__close svg { width: 20px; height: 20px; }
.consent-dlg__intro { margin-bottom: var(--sp-4); font-size: var(--fz-meta); color: var(--ink-soft); }
.consent-dlg__more { margin-top: var(--sp-4); font-size: var(--fz-meta); }
@media (max-width: 599px) { .consent-dlg { padding: var(--sp-4) var(--sp-5) var(--sp-5); } }

/* ---------- the form (dialog + /slapukai/) ---------- */
.consent-cats { border-top: 1px solid var(--line); }
.consent-cat { padding-block: var(--sp-4); border-bottom: 1px solid var(--line); }
.consent-cat__head { display: flex; align-items: center; gap: var(--sp-3); }
.consent-cat__label { flex: 1 1 auto; font-size: var(--fz-ui); font-weight: 600; line-height: var(--lh-tight); cursor: pointer; }
.consent-cat__always { font-size: var(--fz-meta); color: var(--ink-soft); }
.consent-switch { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--forest); cursor: pointer; }
.consent-switch:disabled { cursor: not-allowed; }
.consent-cat__desc { margin-top: var(--sp-1); max-width: var(--measure-lead); font-size: var(--fz-meta); line-height: var(--lh-body); color: var(--ink-soft); }
.consent-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-2); margin-top: var(--sp-5); }
.consent-actions .btn { padding-inline: var(--sp-2); white-space: normal; text-align: center; }
@media (max-width: 599px) { .consent-actions { grid-template-columns: minmax(0, 1fr); } }

/* ---------- placeholders (company facts the client has not supplied) ---------- */
mark.ph { padding: 0 var(--sp-1); border-radius: var(--rad-s); background: var(--warn-tint); color: var(--warn-ink); }
/* footer legal row: the company line under the copyright; on the dark band yellow is the text colour that speaks */
.foot__copy { display: flex; flex-direction: column; gap: var(--sp-1); }
.foot__legal .foot__legalid { margin-top: 0; }
.foot__legalid mark.ph { padding: 0; background: transparent; color: var(--butter); }