/* ===== badges.css ===== */
/* =========================================
   BADGES / STATUS PILLS
========================================= */

.status-pill,
.badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:32px;
    padding:6px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.02em;
    line-height:1;
    border:1px solid transparent;
    white-space:nowrap;
    box-shadow:none;
    backdrop-filter:none;
}

/* ---------- DARK MODE ---------- */

/* azul — recibido */
.badge-info{
    color:#d7e7ff;
    background:rgba(25, 170, 219, .20);
    border-color:rgba(25, 170, 219, .36);
}

/* turquesa — asignado */
.badge-success{
    color:#ccf5ec;
    background:rgba(13, 148, 136, .20);
    border-color:rgba(13, 148, 136, .38);
}

/* naranja — contacto inicial */
.badge-review{
    color:#fde8cc;
    background:rgba(234, 107, 14, .20);
    border-color:rgba(234, 107, 14, .38);
}

/* morado — vinculado */
.badge-primary{
    color:#ead8ff;
    background:rgba(124, 58, 237, .20);
    border-color:rgba(124, 58, 237, .38);
}

/* verde — cerrado */
.badge-cerrado{
    color:#d1fae5;
    background:rgba(5, 150, 105, .20);
    border-color:rgba(5, 150, 105, .36);
}

.badge-warning{
    color:#f7e7b2;
    background:rgba(244, 181, 25, .18);
    border-color:rgba(244, 181, 25, .34);
}

.badge-danger{
    color:#ffd9d2;
    background:rgba(254, 46, 46, .18);
    border-color:rgba(254, 46, 46, .34);
}

.badge-azul-marino{
    color:#bfdbfe;
    background:rgba(30,58,138,.28);
    border-color:rgba(59,130,246,.40);
}

.badge-muted{
    color:#d5dbe7;
    background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.14);
}

.badge-rosa{
    color:#ffd6ec;
    background:rgba(236, 72, 153, .18);
    border-color:rgba(236, 72, 153, .38);
}

/* ---------- LIGHT MODE ---------- */

body.light .status-pill,
body.light .badge{
    box-shadow:none;
}

/* azul — recibido */
body.light .badge-info{
    color:#0a4fb3;
    background:#dbeafe;
    border-color:#a9c4ea;
}

/* turquesa — asignado */
body.light .badge-success{
    color:#0f6b5e;
    background:#ccfbf1;
    border-color:#5eead4;
}

/* naranja — contacto inicial */
body.light .badge-review{
    color:#7a3200;
    background:#fdecd4;
    border-color:#f0b07a;
}

/* morado — vinculado */
body.light .badge-primary{
    color:#5b21b6;
    background:#ede9fe;
    border-color:#c4b5fd;
}

/* verde — cerrado */
body.light .badge-cerrado{
    color:#065f46;
    background:#d1fae5;
    border-color:#6ee7b7;
}

body.light .badge-warning{
    color:#7a5600;
    background:#f7ebc8;
    border-color:#dbc07a;
}

body.light .badge-danger{
    color:#9b1111;
    background:#f7e2dd;
    border-color:#d9b0a6;
}

body.light .badge-muted{
    color:#556070;
    background:#e6ebf1;
    border-color:#c6d0db;
}

body.light .badge-rosa{
    color:#a3286b;
    background:rgba(236, 72, 153, .12);
    border-color:rgba(236, 72, 153, .40);
}

/* =========================================
   CONTEXTOS ESPECIALES
   Mantener mismo tono en tablas y modales
========================================= */

.data-table .status-pill,
.data-table .badge,
.modal-card .status-pill,
.modal-card .badge,
.metric-card .status-pill,
.panel .status-pill{
    box-shadow:none;
    filter:none;
}

/* =========================================
   TAMAÑOS OPCIONALES
========================================= */

.badge-sm{
    min-height:26px;
    padding:4px 10px;
    font-size:11px;
}

.badge-lg{
    min-height:36px;
    padding:8px 14px;
    font-size:13px;
}

/* =========================================
   UI BADGES / STATUS ACTUALES
   Reutilizables entre modulos. No definirlos dentro de CSS de modulo.
========================================= */

.ui-badge{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    padding:7px 11px;
    font-size:12px;
    font-weight:900;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.07);
}

.ui-badge.is-blue{color:#d7e7ff;}
.ui-badge.is-green{color:#d9f5e6;}
.ui-badge.is-orange{color:#f7e7b2;}
.ui-badge.is-pink{color:#ffe1ef;}
.ui-badge.is-purple{color:#eadcff;}
.ui-badge.is-gray{color:#d5dbe7;}

.ui-status{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    padding:6px 10px;
    font-size:12px;
    font-weight:900;
}

.ui-status.is-active{
    color:#7cf2b2;
    background:rgba(124,242,178,.1);
}

.ui-status.is-inactive{
    color:#ffcf7a;
    background:rgba(255,207,122,.1);
}

body.light .ui-badge{
    border-color:rgba(13,72,130,.16);
    background:rgba(255,255,255,.72);
}

body.light .ui-status.is-active{
    color:#047857;
    background:rgba(16,185,129,.12);
}

body.light .ui-status.is-inactive{
    color:#92400e;
    background:rgba(245,158,11,.14);
}