/**
 * Page /legals/cookies — surcouche design system .pfcustom-* (templates/custom).
 * Complète structure/legal/cookies.css (noyau) sans le remplacer.
 * Typo .cookie-info h2 : headings.css. Liens : core-bridge.css.
 */

#portfolio_page.portfolio-font .cookie-preferences-form {
  --cookie-toggle-track-off: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pfcustom-card-bg) 88%, var(--pfcustom-text-muted) 6%) 0%,
    color-mix(in srgb, var(--pfcustom-text-muted) 12%, var(--pfcustom-bg-elevated) 100%) 100%
  );
  --cookie-toggle-track-on: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pfcustom-accent) 90%, #ffffff) 0%,
    var(--pfcustom-accent) 100%
  );
  --cookie-toggle-focus-ring: color-mix(in srgb, var(--pfcustom-accent) 35%, transparent);
  --cookie-toggle-border-off: color-mix(
    in srgb,
    var(--pfcustom-glass-border-color) 90%,
    var(--pfcustom-text-muted) 8%
  );
  --cookie-toggle-border-on: color-mix(in srgb, var(--pfcustom-accent) 25%, transparent);
  --cookie-toggle-thumb-bg: linear-gradient(
    180deg,
    color-mix(in srgb, #ffffff 88%, var(--pfcustom-bg-elevated) 12%) 0%,
    color-mix(in srgb, var(--pfcustom-bg-elevated) 40%, #ffffff) 100%
  );
  --cookie-toggle-thumb-border: color-mix(
    in srgb,
    var(--pfcustom-glass-border-color) 70%,
    var(--pfcustom-rgba-black-045) 8%
  );
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-group {
  background: var(--pfcustom-form-surface-bg);
  border: var(--pfcustom-page-border);
  border-radius: var(--pfcustom-radius-card);
  box-shadow: var(--pfcustom-card-shadow);
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-info h2 {
  color: var(--pfcustom-text) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-info p {
  color: var(--pfcustom-text-muted) !important;
  opacity: 1 !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action .toggle-switch {
  background: var(--cookie-toggle-track-off) !important;
  border: 1px solid var(--cookie-toggle-border-off) !important;
  box-shadow:
    inset 0 1px 1px color-mix(in srgb, #ffffff 14%, transparent),
    inset 0 -1px 1px color-mix(in srgb, var(--pfcustom-rgba-black-045) 35%, transparent),
    var(--pfcustom-glass-shadow-xs) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action .toggle-switch::after {
  background: var(--cookie-toggle-thumb-bg) !important;
  border: 1px solid var(--cookie-toggle-thumb-border) !important;
  box-shadow:
    var(--pfcustom-glass-shadow-xs),
    inset 0 0 0 1px color-mix(in srgb, #ffffff 28%, transparent) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input[type="checkbox"] + label.toggle-switch:hover {
  border-color: color-mix(in srgb, var(--pfcustom-glass-border-color-luminous) 72%, var(--pfcustom-text-muted) 10%) !important;
  background: var(--cookie-toggle-track-off) !important;
  box-shadow:
    inset 0 1px 1px color-mix(in srgb, #ffffff 16%, transparent),
    inset 0 -1px 1px color-mix(in srgb, var(--pfcustom-rgba-black-045) 30%, transparent),
    var(--pfcustom-glass-shadow-sm) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input[type="checkbox"]:checked + label.toggle-switch,
#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:checked + .toggle-switch {
  background: var(--cookie-toggle-track-on) !important;
  border-color: var(--cookie-toggle-border-on) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #ffffff 18%, transparent),
    0 2px 10px color-mix(in srgb, var(--pfcustom-accent) 42%, transparent),
    var(--pfcustom-glass-shadow-xs) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input[type="checkbox"]:checked + label.toggle-switch:hover,
#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:checked + .toggle-switch:hover {
  border-color: color-mix(in srgb, var(--pfcustom-accent) 35%, transparent) !important;
  background: var(--cookie-toggle-track-on) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #ffffff 22%, transparent),
    0 3px 14px color-mix(in srgb, var(--pfcustom-accent) 48%, transparent),
    var(--pfcustom-glass-shadow-xs) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input[type="checkbox"]:focus-visible + .toggle-switch,
#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:checked:focus-visible + .toggle-switch {
  box-shadow:
    inset 0 1px 1px color-mix(in srgb, #ffffff 14%, transparent),
    var(--pfcustom-glass-shadow-xs),
    0 0 0 3px var(--cookie-toggle-focus-ring) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:checked + .toggle-switch::after {
  border-color: color-mix(in srgb, #ffffff 40%, var(--pfcustom-text-muted) 60%) !important;
  box-shadow:
    var(--pfcustom-glass-shadow-sm),
    inset 0 0 0 1px color-mix(in srgb, #ffffff 24%, transparent) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input[type="checkbox"]:disabled + label.toggle-switch:hover {
  opacity: 0.55 !important;
  background: var(--pfcustom-bg-elevated) !important;
  border-color: var(--pfcustom-rgba-border-on-dark-medium) !important;
  box-shadow: inset 0 1px 2px color-mix(in srgb, var(--pfcustom-rgba-black-045) 25%, transparent) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:disabled + .toggle-switch {
  background: color-mix(in srgb, var(--pfcustom-bg-elevated) 92%, var(--pfcustom-text-muted) 8%) !important;
  border-color: var(--pfcustom-rgba-border-on-dark-medium) !important;
  box-shadow: inset 0 1px 2px color-mix(in srgb, var(--pfcustom-rgba-black-045) 20%, transparent) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:disabled:checked + .toggle-switch {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pfcustom-text-muted) 70%, #ffffff) 0%,
    var(--pfcustom-text-muted) 100%
  ) !important;
  border-color: var(--pfcustom-rgba-border-on-dark-medium) !important;
  opacity: 0.88;
  box-shadow: inset 0 1px 1px color-mix(in srgb, #ffffff 14%, transparent) !important;
}

#portfolio_page.portfolio-font .cookie-preferences-form .cookie-action input:disabled + .toggle-switch::after {
  box-shadow: var(--pfcustom-glass-shadow-xs) !important;
}