/* ─────────────────────────────────────────────────────────
   Ikigai — override de marca sobre app.css
   Cargar DESPUÉS de app.css. Reasigna valores, no renombra:
   las variables --teal-* ahora contienen PÚRPURA de marca.
   Los colores semánticos (red/amber/green) NO se tocan.
───────────────────────────────────────────────────────── */
:root {
  /* Chrome oscuro: navy → azul-noche Ikigai (#1a1a2e) */
  --navy-950: #0d0d18; --navy-900: #14142a; --navy-800: #1a1a2e;
  --navy-700: #252540; --navy-600: #333356; --navy-400: #6a6a99;
  --navy-200: #b5b5d4; --navy-100: #d8d8ea; --navy-50:  #f0f0f8;

  /* Acento: teal → púrpura de marca (#9b13f2) */
  --teal-700: #7a0fc0; --teal-600: #9b13f2; --teal-500: #a83af5;
  --teal-400: #b968f7; --teal-100: #ede0fd; --teal-50:  #f8f7ff;

  /* Superficies y texto */
  --bg-page: #f8f7ff;
  --border: #e5e7eb; --border-strong: #d4d4e0;
  --text-primary: #2d2d3a; --text-secondary: #55556b;
  --text-muted: #9494a8; --text-placeholder: #c4c4d4;

  /* Sidebar */
  --sb-text: #a9a9c8; --sb-text-active: #ece8f8;
  --sb-active-bg: rgba(155,19,242,.18);
  --sb-icon-muted: #6a6a99;

  /* Sombras con tinte de marca */
  --shadow-sm: 0 1px 4px rgba(155,19,242,.09),0 1px 2px rgba(155,19,242,.05);
  --shadow-md: 0 4px 12px rgba(155,19,242,.10),0 2px 4px rgba(155,19,242,.06);
  --shadow-lg: 0 10px 30px rgba(155,19,242,.14),0 4px 10px rgba(155,19,242,.07);
}

/* Sombra del logo: el teal quedó hardcodeado en app.css línea 78 */
.sb-logo { box-shadow: 0 2px 10px rgba(155,19,242,.32); }

/* Sidebar vertical, patrón unificado Ikigai */
.sb-brand { flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.sb-logo-img { width: 100%; max-width: 165px; height: auto; display: block; }
.sb-brand-label { font-size: 10px; letter-spacing: 2px; text-transform: uppercase;
                  color: var(--sb-icon-muted); font-weight: 500; }

/* Login: marca vertical (app.css la define horizontal) */
.auth-brand { flex-direction: column; align-items: flex-start; gap: 0; }