/* ========================================================
   LUSTRE MANAGEMENT SYSTEM - CORE TOKENS & LAYOUT
   ======================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap');

:root {
  /* --- Superficies y Fondos --- */
  --lustre-bg: #f9f9f9;
  --lustre-surface-white: #ffffff;
  --lustre-surface-low: #f3f3f3;
  --lustre-surface-container: #eeeeee;
  --lustre-surface-variant: #e2e2e2;
  --lustre-border-subtle: #E5E5E5;

  /* --- Colores de Acción --- */
  --lustre-primary: #000000;
  --lustre-on-primary: #ffffff;
  --lustre-text-main: #1a1c1c;
  --lustre-text-muted: #444748;

  /* --- Semáforo de Estado --- */
  --lustre-success: #10B981;
  --lustre-warning: #FBBF24;
  --lustre-alert: #F97316;
  --lustre-critical: #EF4444;

  /* --- Tipografía --- */
  --lustre-font-display: 'Geist', 'Inter', sans-serif;
  --lustre-font-body: 'Inter', sans-serif;
  --lustre-font-mono: 'JetBrains Mono', monospace;
}

/* --- Clases de Utilidad para Componentes --- */

/* Tarjetas de Datos / KPI */
.lustre-kpi-card {
    background-color: var(--lustre-surface-white);
    border: 1px solid var(--lustre-border-subtle);
    border-radius: 0.5rem; /* 8px */
    padding: 24px;
}
.lustre-kpi-title {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lustre-text-muted);
    margin-bottom: 8px;
}
.lustre-kpi-value {
    font-family: var(--lustre-font-display);
    font-size: 32px;
    font-weight: 600;
    color: var(--lustre-primary);
}

/* Píldoras del Semáforo (Status Badges) */
.lustre-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 600;
}
.lustre-badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.lustre-badge-vigente { background-color: rgba(16, 185, 129, 0.1); color: var(--lustre-success); }
.lustre-badge-vigente::before { background-color: var(--lustre-success); }

.lustre-badge-atrasada { background-color: rgba(251, 191, 36, 0.1); color: var(--lustre-warning); }
.lustre-badge-atrasada::before { background-color: var(--lustre-warning); }

.lustre-badge-deuda { background-color: rgba(249, 115, 22, 0.1); color: var(--lustre-alert); }
.lustre-badge-deuda::before { background-color: var(--lustre-alert); }

.lustre-badge-cobranza { background-color: rgba(239, 68, 68, 0.1); color: var(--lustre-critical); }
.lustre-badge-cobranza::before { background-color: var(--lustre-critical); }

/* Tablas con JetBrains Mono alineado */
.lustre-table {
    width: 100%;
    border-collapse: collapse;
    background-color: var(--lustre-surface-white);
    border: 1px solid var(--lustre-border-subtle);
    border-radius: 0.5rem;
}
.lustre-table th {
    background-color: var(--lustre-bg);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lustre-text-muted);
    padding: 16px;
    text-align: left;
    border-bottom: 1px solid var(--lustre-border-subtle);
}
.lustre-table td {
    padding: 16px;
    border-bottom: 1px solid var(--lustre-border-subtle);
    font-size: 14px;
}
.lustre-table .num-data {
    font-family: var(--lustre-font-mono);
    font-weight: 500;
}