/* ============================================================
   theme.css — Edit this file to restyle the entire app
   ============================================================ */

:root {
  /* Brand colors */
  --color-primary:        #fc0001;   /* Main accent (buttons, active tab) */
  --color-primary-dark:   #1E293B;   /* Hover / pressed state */
  --color-secondary:      #000000;   /* Muted text, inactive icons */

  /* Backgrounds */
  --color-bg:             #fefefe;   /* Page background */
  --color-surface:        #FFFFFF;   /* Cards, panels */
  --color-header-bg:      #fefefe;   /* Fixed top header */
  --color-tab-bg:         #FFFFFF;   /* Bottom tab bar */

  /* Text */
  --color-text:           #1E293B;   /* Body text */
  --color-text-muted:     #94A3B8;   /* Secondary / placeholder text */
  --color-text-on-dark:   #FFFFFF;   /* Text on dark backgrounds */

  /* Borders & dividers */
  --color-border:         #E2E8F0;

--breakout1:#004b9b;
--breakout2:#e32013;
--breakout3:#fbbb00;

  /* Feedback */
  --color-success:        #22C55E;
  --color-warning:        #F59E0B;
  --color-error:          #EF4444;

  /* Sizing helpers (not colors, but global) */
  --header-height:        80px;
  --tab-height:           64px;
  --sponsor-bar-height:   30px;
  --border-radius:        12px;
}