/* ===================================================================
   PRISM THEME - YOUR COLORS
   ===================================================================
   This is the only file you need to edit to match the theme to your
   brand. It is also the only file left untouched when you update the
   theme, so your colors survive every new version.

   Change a value, save, reload the page. Nothing else to do.
   =================================================================== */

html:root {

  /* =================================================================
     1. YOUR MAIN COLOR
     -----------------------------------------------------------------
     Paste your brand hex here. Buttons, links, prices, active states,
     icons, focus rings, shadows and every soft background in the
     theme are built from this one value.
     ================================================================= */

  --brand-primary: #164ac8;


  /* =================================================================
     2. YOUR SECOND COLOR (optional)
     -----------------------------------------------------------------
     The theme uses two colors in its gradients: headers, primary
     buttons and the accent bar on cards all run from the second color
     into the first.

     Leave the line below commented out and the theme derives the
     second color from the first, a darker version of the same hue.
     That works when your brand is one color.

     Uncomment it and set your own when your brand has two distinct
     colors in its gradient, for example a blue that runs into a
     purple, or a green into a teal.
     ================================================================= */

  --brand-secondary: #0d2665;


  /* =================================================================
     3. FINE TUNING (rarely needed)
     -----------------------------------------------------------------
     The greys below are deliberately neutral so they sit under any
     brand color. Uncomment and change them only if your brand needs
     warm greys instead of cool ones.
     ================================================================= */

  /* --text:        #1e293b; */  /* main text */
  /* --text-muted:  #64748b; */  /* subtitles and descriptions */
  /* --text-faint:  #94a3b8; */  /* hints and small print */
  /* --border:      #e2e8f0; */  /* card and input borders */
  /* --surface-page: #f8f9fa; */ /* page background */

  /* Status colors. Green for paid, red for overdue, amber for
     pending. Changing these changes what the states mean, so most
     brands should leave them alone. */

  /* --success: #16a34a; */
  /* --danger:  #ef4444; */
  /* --warning: #f59e0b; */

}

/* ===================================================================
   WHY html:root AND NOT :root

   This file has to win over the theme's own defaults no matter which
   stylesheet the browser reads last, and on order pages the cart
   stylesheet loads after the theme. Matching html:root instead of
   :root raises the specificity just enough to settle that, without
   a single !important.
   =================================================================== */