/* Cookie Policy page-specific styles (kept lean; base.css handles most layout/typography) */
.policy-hero {
  padding-block: var(--space-12) var(--space-8);
  border-bottom: 1px solid var(--color-border);
  background: linear-gradient(180deg, color-mix(in oklab, var(--color-primary) 6%, transparent) 0%, transparent 30%);
}
.policy-hero .lead {  color: var(--gray-700); }
.page-actions { margin-top: var(--space-5); display: flex; gap: var(--space-3); flex-wrap: wrap; }
.policy-meta { margin-top: var(--space-4); color: var(--gray-600); font-size: var(--text-sm); }

/* Preferences form */
#cookie-prefs-form { margin-top: var(--space-4); }
.prefs-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--space-5); padding-block: var(--space-3); }
.prefs-info p { margin: 0; color: var(--gray-700); }
.prefs-actions { display: flex; gap: var(--space-3); margin-top: var(--space-5); flex-wrap: wrap; }
.legal-note { color: var(--gray-600); margin-top: var(--space-3); }

/* Accessible toggle switch */
.toggle { display: inline-flex; align-items: center; gap: var(--space-3); }
.toggle input[type="checkbox"] {
  appearance: none; -webkit-appearance: none; width: 48px; height: 28px;
  background: var(--gray-300); border-radius: var(--radius-full); position: relative; outline: none;
  transition: background var(--transition-base) var(--ease-in-out), box-shadow var(--transition-base) var(--ease-in-out);
}
.toggle input[type="checkbox"]::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: var(--radius-full);
  background: #fff; box-shadow: var(--shadow-sm); transition: transform var(--transition-base) var(--ease-in-out);
}
.toggle input[type="checkbox"]:checked { background: var(--color-primary); }
.toggle input[type="checkbox"]:checked::after { transform: translateX(20px); }
.toggle input[type="checkbox"]:focus-visible { box-shadow: var(--ring-primary); }
.toggle label { user-select: none; cursor: pointer; color: var(--gray-700); }

/* Sections spacing */
main > section { padding-block: var(--space-9); }

@media (max-width: 640px) {
  .prefs-row { grid-template-columns: 1fr; gap: var(--space-3); }
}