/* Natural One brand tokens. Linked before css/portal.css. */

:root {
  --lpdh-color-brand-500: #fa4616;
  --lpdh-color-brand-interactive: #d33005;
  --lpdh-color-brand-interactive-hover: #b52904;
  --lpdh-color-brand-interactive-active: #972204;
  --lpdh-color-semantic-success: #207929;
  --lpdh-color-semantic-danger: #dd000c;
  --lpdh-color-semantic-danger-interactive: #c9000b;
  --lpdh-color-semantic-info: #0087ce;
  --lpdh-color-semantic-info-interactive: #006ca5;

  --lpdh-font-family-body: "Poppins", system-ui, sans-serif;
  --lpdh-font-family-display: "Plus Jakarta Sans", system-ui, sans-serif;
  --lpdh-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --lpdh-space-1: 4px;
  --lpdh-space-2: 8px;
  --lpdh-space-3: 12px;
  --lpdh-space-4: 16px;
  --lpdh-space-6: 24px;
  --lpdh-space-8: 32px;
  --lpdh-space-12: 48px;
  --lpdh-space-16: 64px;
  --lpdh-space-24: 96px;

  --lpdh-radius-sm: 6px;
  --lpdh-radius-md: 8px;
  --lpdh-radius-lg: 12px;
  --lpdh-radius-xl: 16px;

  --lpdh-motion-duration-fast: 0.15s;
  --lpdh-motion-duration-base: 0.25s;
  --lpdh-motion-easing-standard: cubic-bezier(0.4, 0, 0.2, 1);

  --lpdh-color-media-bg: #221c16;
  --lpdh-color-media-text-muted: #b3a089;
  --lpdh-color-brand-overlay: rgba(211, 48, 5, 0.5);
  --lpdh-color-tina-accent: #0f6b4f;
  --lpdh-color-tina-soft-bg: #cfe6d9;
  --lpdh-color-tina-soft-text: #0c5a42;

  /* Same brand-interactive color at other opacities, also raw literals in the shared
     stylesheet before this move: the login glow, its focus ring and the nav badge. */
  --lpdh-color-brand-overlay-soft: rgba(211, 48, 5, 0.16);
  --lpdh-color-brand-overlay-transparent: rgba(211, 48, 5, 0);
  --lpdh-color-brand-overlay-strong: rgba(211, 48, 5, 0.9);
}

:root,
[data-theme="light"] {
  --lpdh-color-bg: #ede9de;
  --lpdh-color-surface: #e4ddcd;
  --lpdh-color-surface-2: #dbd2bd;
  --lpdh-color-border: #cdc0a2;
  --lpdh-color-border-strong: #927e4f;
  --lpdh-color-text-secondary: #605234;
  --lpdh-color-ink: #322b1b;
  --lpdh-color-overlay: #322b1b8c;
  --lpdh-color-inverse-surface: #3b3126;
  --lpdh-color-inverse-text: #f1ede9;
  --lpdh-color-brand-soft-bg: #e9c3b9;
  --lpdh-color-brand-soft-text: #a52504;
  --lpdh-color-semantic-success-text: #1c6924;
  --lpdh-color-semantic-success-soft-bg: #c2e0c5;
  --lpdh-color-semantic-success-soft-text: #1d6d25;
  --lpdh-color-semantic-danger-text: #ba000a;
  --lpdh-color-semantic-danger-soft-bg: #eab8bb;
  --lpdh-color-semantic-danger-soft-text: #a80009;
  --lpdh-color-semantic-info-text: #006093;
  --lpdh-color-semantic-info-soft-bg: #b8d9ea;
  --lpdh-color-semantic-info-soft-text: #006194;
  --lpdh-shadow-sm: 0 1px 2px #322b1b14, 0 1px 1px #322b1b0f;
  --lpdh-shadow-md: 0 4px 8px #322b1b1f, 0 2px 4px #322b1b14;
  --lpdh-shadow-lg: 0 12px 24px #322b1b2e, 0 4px 8px #322b1b1a;
  /* The page background at two opacities, raw literals in the shared stylesheet before this
     move: the sticky topbar over scrolling content, and the veil over a locked certificate. */
  --lpdh-color-topo-bg: rgba(237, 233, 222, 0.92);
  --lpdh-color-cortina-bg: rgba(237, 233, 222, 0.55);
  /* The next session's label: in lists it reuses the brand soft pair, and on the
     next-session card it is white over a white veil. Values the shared stylesheet held
     before each label got its own tokens. */
  --lpdh-color-etiqueta-proxima-bg: #e9c3b9;
  --lpdh-color-etiqueta-proxima-text: #a52504;
  --lpdh-color-selo-vivo-bg: rgba(255, 255, 255, 0.18);
  --lpdh-color-selo-vivo-text: #fff;
}