/* ===========================================================================
   NOP — THEME COLOR PALETTE  (single source of truth)
   ---------------------------------------------------------------------------
   Use these CSS variables for ALL new UI so the site stays visually consistent.
   The approved palette is restricted to three families only:

       1. BLUE  (primary)   — the header/nav gradient #5285b2 -> #366388
       2. ORANGE (accent)   — calls-to-action, highlights, totals
       3. GRAY  (neutral)   — backgrounds, borders, body text

   DO NOT introduce maroon / red / green / purple. Pick the closest variable
   below. Example usage:
       color: var(--c-blue);
       background: var(--grad-blue);
       border: 1px solid var(--c-border);

   Reference implementation: views/site/cart.php
   =========================================================================== */

:root{
	/* ---- BLUE (primary brand) ---- */
	--c-blue-light:   #5285b2;   /* gradient top, hover tints            */
	--c-blue:         #366388;   /* gradient bottom, primary text/links  */
	--c-blue-deep:    #2d5273;   /* darker text on light blue surfaces   */
	--grad-blue:      linear-gradient(#5285b2, #366388);  /* nav/header/section titles */
	--c-blue-tint:    #f6fafe;   /* very light blue row hover / panels   */
	--c-blue-tint-2:  #eef5fb;   /* light blue hover for inputs/labels   */
	--c-table-head-1: #dde8f0;   /* table header gradient top            */
	--c-table-head-2: #cfe0ee;   /* table header gradient bottom         */
	--grad-table-head: linear-gradient(#dde8f0, #cfe0ee);

	/* ---- ORANGE (accent / CTA) ---- */
	--c-orange-light: #f39c12;   /* CTA gradient top                     */
	--c-orange:       #e67e22;   /* badges, icons, default accent        */
	--c-orange-deep:  #d35400;   /* totals, amounts, hover/active accent */
	--grad-orange:    linear-gradient(#f39c12, #d35400);  /* checkout / primary CTA */

	/* ---- GRAY (neutral) ---- */
	--c-page-bg:      #f3f3f4;   /* body / page background               */
	--c-surface:      #ffffff;   /* cards, panels, table rows            */
	--c-border:       #dcdcdc;   /* panel & card borders                 */
	--c-border-soft:  #eeeeee;   /* inner cell borders / dividers        */
	--c-border-dash:  #e2e2e2;   /* dashed summary dividers              */
	--c-text:         #333333;   /* primary body text                    */
	--c-text-muted:   #525b6e;   /* secondary / label text               */
	--c-text-faint:   #888888;   /* hints, fine print                    */
	--c-gray:         #7a7f87;   /* neutral badge / muted button text    */
	--c-gray-deep:    #525b6e;   /* neutral button hover background       */

	--c-on-dark:      #ffffff;   /* text/icons placed on blue or orange  */
}
