/*
 * Global Design Standards v2.1 base layer (CEO-approved 2026-10-22).
 * Loaded after main.css. Additive only: tokens, focus, press, motion and hit-area rules.
 */
:root {
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-2xl: 1.75rem;
  --text-display: 2.5rem;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --motion-fast: 150ms;
  --motion-base: 250ms;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --tap-min: 44px;
  --text-muted-aa: #475569; /* 7.6:1 on white */
}

/* Keyboard focus: one definition for every interactive element */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--brand-primary, #00bfa5);
  outline-offset: 2px;
}

/* Press feedback is primary (works on touch) */
button:not(:disabled):active,
[role="button"]:active,
.pwa-tab-item:active {
  transform: scale(.98);
}

/* Hover lift is a pointer-only enhancement, never on touch */
@media (hover: none) {
  .btn:hover,
  .btn-brand:hover,
  .btn-primary:hover,
  .btn-brand-outline:hover,
  .btn-outline-primary:hover,
  .btn-secondary:hover {
    transform: none;
  }
}

/* Reduced motion: honour the user's OS setting everywhere */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Hit areas: expand to 44px without changing the visual size */
.pwa-tab-item {
  min-height: var(--tap-min);
  min-width: var(--tap-min);
}

/* AA contrast for light-mode secondary text (was #94a3b8, about 2.6:1) */
.notif-item-time {
  color: var(--text-muted-aa);
}
body.dark-mode .notif-item-time {
  color: #94a3b8;
}