/* ============================================================
   LM SERVIZI & CONSULENZE IT — Brand Palette
   Versione: 1.0
   ============================================================ */

/* ── ROOT: Dark Mode (default) ─────────────────────────────── */
:root {

  /* Background */
  --lm-bg:          #0C0A08;
  --lm-surface:     #1A1512;
  --lm-border:      #2E2318;

  /* Accenti oro/ambra */
  --lm-gold:        #C8902A;   /* Oro Imperiale — accento primario   */
  --lm-gold-hover:  #E8A820;   /* Ambra Viva — hover / highlight     */
  --lm-gold-deep:   #8B5A10;   /* Oro Profondo — accento secondario  */
  --lm-gold-shadow: #6B3F0A;   /* Bronzo — ombra accento             */

  /* Testo */
  --lm-text:        #F5EFE0;   /* Bianco Caldo — testo primario      */
  --lm-text-muted:  #A8906A;   /* Grigio Ambrato — testo secondario  */
  --lm-text-faint:  #5A4A38;   /* Grigio Scuro — placeholder / muted */

  /* Semantici (standard su tutti i progetti) */
  --lm-success:     #28a745;
  --lm-error:       #dc3545;
  --lm-warning:     #E8A820;
  --lm-info:        #A8906A;

  /* Tipografia */
  --lm-font-display: 'Cormorant Garamond', georgia, serif;
  --lm-font-ui:      'Outfit', system-ui, sans-serif;
  --lm-font-body:    'DM Sans', system-ui, sans-serif;
  --lm-font-mono:    'JetBrains Mono', 'Courier New', monospace;

  /* ── Prodotti — colori primari ── */
  --lm-servizi-primary:   #C8902A;
  --lm-servizi-secondary: #8B5A10;
  --lm-website-primary:   #E8A820;
  --lm-website-secondary: #A87018;
  --lm-academy-primary:   #C8962A;
  --lm-academy-secondary: #7A5810;
  --lm-tickethub-primary:   #D4A017;
  --lm-tickethub-secondary: #96700A;
  --lm-gp-primary:   #B87333;
  --lm-gp-secondary: #7A4820;
}

/* ── LIGHT MODE ─────────────────────────────────────────────── */
[data-theme="light"],
.lm-light,
body.light {
  --lm-bg:          #FAF7F2;   /* Panna Calda                        */
  --lm-surface:     #FFF;      /* Bianco puro                        */
  --lm-border:      #E8DDD0;   /* Sabbia                             */

  /* Accenti — stessa famiglia, hover più scuro per contrasto */
  --lm-gold:        #C8902A;
  --lm-gold-hover:  #8B5A10;   /* Più scuro su sfondo chiaro         */
  --lm-gold-deep:   #8B5A10;
  --lm-gold-shadow: #6B3F0A;

  /* Testo */
  --lm-text:        #1A1512;   /* Marrone Notte                      */
  --lm-text-muted:  #5A4A38;   /* Marrone Medio                      */
  --lm-text-faint:  #A8906A;   /* Grigio Ambrato                     */
}

/* ============================================================
   UTILITY CLASSES — pronti all'uso
   ============================================================ */

.lm-bg          { background-color: var(--lm-bg); }
.lm-surface     { background-color: var(--lm-surface); }
.lm-text        { color: var(--lm-text); }
.lm-text-muted  { color: var(--lm-text-muted); }
.lm-gold        { color: var(--lm-gold); }
.lm-border      { border-color: var(--lm-border); }

/* Accent bar verticale (come nelle icone) */
.lm-accent-bar {
  border-left: 3px solid var(--lm-gold);
  padding-left: 1rem;
}

/* Gradiente gold orizzontale */
.lm-gradient-gold {
  background: linear-gradient(
    135deg,
    var(--lm-gold-hover) 0%,
    var(--lm-gold)       100%
  );
}

/* Gradiente gold verticale */
.lm-gradient-gold-v {
  background: linear-gradient(
    180deg,
    var(--lm-gold-hover) 0%,
    var(--lm-gold-deep)  100%
  );
}

/* Testo con gradiente gold */
.lm-text-gold-gradient {
  background: linear-gradient(135deg, var(--lm-gold-hover), var(--lm-gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Button primario */
.lm-btn {
  background-color: var(--lm-gold);
  color: var(--lm-bg);
  border: none;
  border-radius: 6px;
  padding: 0.6rem 1.4rem;
  font-family: var(--lm-font-ui);
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s;
}
.lm-btn:hover {
  background-color: var(--lm-gold-hover);
}

/* Button outline */
.lm-btn-outline {
  background: transparent;
  color: var(--lm-gold);
  border: 1.5px solid var(--lm-gold);
  border-radius: 6px;
  padding: 0.6rem 1.4rem;
  font-family: var(--lm-font-ui);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
.lm-btn-outline:hover {
  background-color: var(--lm-gold);
  color: var(--lm-bg);
}

/* Card */
.lm-card {
  background-color: var(--lm-surface);
  border: 1px solid var(--lm-border);
  border-radius: 12px;
  padding: 1.5rem;
}