/*
Theme Name:        La Cale
Theme URI:         https://lacale.ma
Description:       Premium dark theme for La Cale — Listening Bar & Club, Rabat, Morocco. Dual identity: warm analog listening bar meets industrial club.
Version:           1.0.0
Author:            La Cale Studio
Author URI:        https://lacale.ma
Text Domain:       lacale
Requires at least: 6.0
Tested up to:      6.5
Requires PHP:      8.0
*/

/* ============================================================
   DESIGN TOKENS — Material You dark scheme + brand extensions
   ============================================================ */
:root {
  /* ── Core surfaces ── */
  --color-background:              #241f20;
  --color-surface:                 #241f20;
  --color-surface-dim:             #1e191a;
  --color-surface-container-low:   #2a2425;
  --color-surface-container:       #2f292a;
  --color-surface-container-high:  #342d2e;
  --color-surface-container-highest: #3e3738;
  --color-surface-bright:          #433d3e;
  --color-surface-container-lowest: #1a1617;

  /* ── On-surface text ── */
  --color-on-surface:              #eae0e1;
  --color-on-surface-variant:      #d1c4bb;
  --color-on-background:           #eae0e1;

  /* ── Primary (warm ivory/cream) ── */
  --color-primary:                 #fffcff;
  --color-primary-container:       #f7dbc5;
  --color-primary-fixed:           #faddc7;
  --color-primary-fixed-dim:       #dcc2ac;
  --color-on-primary:              #3e2d1e;
  --color-on-primary-container:    #745f4d;
  --color-on-primary-fixed:        #27190b;
  --color-on-primary-fixed-variant: #564333;
  --color-inverse-primary:         #6f5a49;

  /* ── Secondary (neutral warm grey) ── */
  --color-secondary:               #cec4c5;
  --color-secondary-container:     #504a4b;
  --color-secondary-fixed:         #eae0e1;
  --color-secondary-fixed-dim:     #cec4c5;
  --color-on-secondary:            #352f30;
  --color-on-secondary-container:  #c3b9ba;
  --color-on-secondary-fixed:      #1f1a1b;
  --color-on-secondary-fixed-variant: #4b4546;

  /* ── Accent / Brand orange ── */
  --color-accent:                  #fe7a2e;
  --color-accent-muted:            #9f4200;
  --color-surface-tint:            #dcc2ac;

  /* ── Tertiary ── */
  --color-tertiary:                #fcfcff;
  --color-tertiary-container:      #d5e1ee;
  --color-on-tertiary:             #26323b;
  --color-on-tertiary-container:   #58646f;
  --color-tertiary-fixed:          #d8e4f1;
  --color-tertiary-fixed-dim:      #bcc8d4;

  /* ── Utility ── */
  --color-outline:                 #9a8f86;
  --color-outline-variant:         #4e453e;
  --color-inverse-surface:         #eae0e1;
  --color-inverse-on-surface:      #352f30;
  --color-surface-variant:         #393334;
  --color-on-surface-variant-alt:  #4e453e;
  --color-error:                   #ffb4ab;
  --color-error-container:         #93000a;

  /* ── Brand gradient ── */
  --gradient-silk:                 linear-gradient(135deg, #F7DBC5 0%, #DCC2AC 100%);
  --gradient-dark-fade:            linear-gradient(to top, var(--color-surface) 0%, rgba(36,31,32,0.5) 50%, transparent 100%);

  /* ── Typography scale ── */
  --font-serif:    'Noto Serif', 'Georgia', serif;
  --font-sans:     'Space Grotesk', system-ui, sans-serif;
  --font-mono:     'Space Mono', 'Courier New', monospace;

  /* ── Spacing rhythm ── */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  2rem;
  --space-xl:  4rem;
  --space-2xl: 8rem;

  /* ── Border radius ── */
  --radius-sm:   0.125rem;
  --radius-md:   0.25rem;
  --radius-lg:   0.5rem;
  --radius-full: 0.75rem;

  /* ── Transitions ── */
  --transition-fast:   150ms cubic-bezier(0.2, 0, 0, 1);
  --transition-base:   300ms cubic-bezier(0.2, 0, 0, 1);
  --transition-slow:   500ms cubic-bezier(0.2, 0, 0, 1);

  /* ── Layout ── */
  --nav-height:        56px;
  --side-label-width:  64px;
  --max-content:       1280px;
}