/* BRAND-4 theme for Bulwark webmail (MailRelease 2026-10-13; tokens: design/tokens/brand-4.tokens.json,
   rules: .gsd/launch/BRAND-4-GUIDELINES.md, CG §655). Injected into every HTML response by the nginx vhost
   (sub_filter) because Bulwark has no custom-CSS env; Bulwark's own CSS-variable hooks are overridden here,
   so the change propagates through the whole app. Red stays the ONE primary action + focus + links.
   barn-red #a02a23 · barn-red-deep #721c19 · charcoal #211c17 · granite #625d56 · clapboard #f7f2e9
   sunlit #f1e8db · seam #e5dbcd · trim #fbfaf7 · paper #f8f7f3 */
:root {
  --color-background: #f7f2e9;
  --color-foreground: #211c17;
  --color-primary: #a02a23;
  --color-primary-foreground: #fbfaf7;
  --color-secondary: #f1e8db;
  --color-secondary-foreground: #211c17;
  --color-muted: #f1e8db;
  --color-muted-foreground: #625d56;
  --color-accent: #f1e8db;
  --color-accent-foreground: #211c17;
  --color-border: #e5dbcd;
  --color-input: #211c17;
  --color-ring: #a02a23;
  --color-popover: #fbfaf7;
  --color-popover-foreground: #211c17;
  --color-card: #fbfaf7;
  --color-card-foreground: #211c17;
  --color-sidebar: #f1e8db;
  --color-sidebar-foreground: #211c17;
  --color-sidebar-border: #e5dbcd;
  --color-sidebar-accent: #e5dbcd;
  --color-sidebar-accent-foreground: #211c17;
  --color-selection: #f1e8db;
  --color-selection-foreground: #211c17;
  --color-unread: #a02a23;
  --color-info: #625d56;
}
.dark {
  --color-background: #211c17;
  --color-foreground: #f8f7f3;
  --color-primary: #f8f7f3;           /* barn red on charcoal is ~2.6:1 — never for controls; reversed paper */
  --color-primary-foreground: #211c17;
  --color-secondary: #2d2720;
  --color-secondary-foreground: #f8f7f3;
  --color-muted: #2d2720;
  --color-muted-foreground: #b9b2a8;
  --color-accent: #2d2720;
  --color-accent-foreground: #f8f7f3;
  --color-border: rgba(248, 247, 243, 0.18);
  --color-input: rgba(248, 247, 243, 0.45);
  --color-ring: #f8f7f3;
  --color-popover: #2d2720;
  --color-popover-foreground: #f8f7f3;
  --color-card: #272119;
  --color-card-foreground: #f8f7f3;
  --color-sidebar: #211c17;
  --color-sidebar-foreground: #f8f7f3;
  --color-sidebar-border: rgba(248, 247, 243, 0.18);
  --color-sidebar-accent: #2d2720;
  --color-sidebar-accent-foreground: #f8f7f3;
  --color-selection: #2d2720;
  --color-selection-foreground: #f8f7f3;
  --color-unread: #f8f7f3;
  --color-info: #b9b2a8;
}
/* Primary actions: trim label on barn red, 3 px radius, deep red on hover/press. */
button.bg-primary, a.bg-primary { border-radius: 3px; }
button.bg-primary:hover, a.bg-primary:hover { background-color: #721c19; }
.dark button.bg-primary:hover, .dark a.bg-primary:hover { background-color: #e5dbcd; }
/* Stock-blue utilities that bypass the variables (the PWA install prompt): charcoal, not a second red. */
.bg-blue-600 { background-color: #211c17; color: #fbfaf7; border-radius: 3px; }
.hover\:bg-blue-700:hover { background-color: #625d56; }
.dark .bg-blue-600 { background-color: #f8f7f3; color: #211c17; }
.text-blue-600, .text-blue-500, .text-blue-400 { color: #a02a23; }
.dark .text-blue-600, .dark .text-blue-500, .dark .text-blue-400 { color: #f8f7f3; }
/* The login lockup renders at 64 px by default (max-w-16/max-h-16): size it per BRAND-4 (horizontal
   lockup minimum 120 px wide; use 280 px on the sign-in card). Sidebar logo is the 48 px barn. */
img[src*="/login-logo"] { max-width: 280px; max-height: 72px; width: 280px; height: auto; }
/* Neutral-grey utilities in the install prompt ("Not now"): sunlit, not cold grey. */
.bg-neutral-100 { background-color: #f1e8db; border-radius: 3px; }
.hover\:bg-neutral-200:hover { background-color: #e5dbcd; }
.text-neutral-700 { color: #211c17; }
.text-neutral-400 { color: #625d56; }