/* =====================================================
   GAZHAL DICTAMEN — Dictámenes Legislativos
   Paleta: navy #1e3a8a + azul #0093C9 + grises
   Compatible con gazhal-dof.css
===================================================== */

:root {
    --gzl-blue:        #0093C9;
    --gzl-navy:        #1e3a8a;
    --gzl-navy-dark:   #0f2f76;
    --gzl-slate:       #334155;
    --gzl-slate-light: #64748b;
    --gzl-bg:          #f8fafc;
    --gzl-white:       #ffffff;
    --gzl-border:      #e2e8f0;
    --gzl-border-soft: #f1f5f9;
}

body {
    background: var(--gzl-bg);
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    margin: 0; overflow-x: hidden; color: var(--gzl-slate);
}

.gzl-dictamen-container {
    width: 100%; max-width: 100%;
    padding: 20px; box-sizing: border-box;
}

/* --- BANNER CAMBIOS RECIENTES --- */
.dictamen-banner {
    background: var(--gzl-navy);
    border-radius: 8px; padding: 14px 20px;
    margin-bottom: 20px; color: white;
}

.banner-label {
    font-size: 10px; font-weight: 800; text-transform: uppercase;
    letter-spacing: 1.5px; opacity: 0.6; margin-bottom: 10px;
    display: flex; align-items: center; gap: 6px;
}

.banner-cambio-item {
    padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    display: flex; align-items: baseline; gap: 10px;
    font-size: 12px; line-height: 1.4;
}
.banner-cambio-item:last-child { border-bottom: none; }

.banner-fecha {
    font-size: 10px; opacity: 0.55; white-space: nowrap; flex-shrink: 0;
}

.banner-estado-chip {
    font-size: 10px; font-weight: 700; opacity: 0.7;
    white-space: nowrap; flex-shrink: 0; text-transform: uppercase;
}

.banner-estado-chip.nuevo {
    opacity: 1; background: rgba(255,255,255,0.15);
    padding: 1px 6px; border-radius: 3px;
}

.banner-titulo {
    flex: 1; opacity: 0.85; line-height: 1.35;
}

/* --- FORMULARIO --- */
.dictamen-form-filtros {
    background: var(--gzl-white); padding: 20px 22px;
    border-radius: 8px; border: 1px solid var(--gzl-border);
    margin-bottom: 20px;
}

.filtro-group  { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.filtro-label  { font-size: 11px; color: var(--gzl-slate-light); font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px; }
.filtro-input  { padding: 9px 11px; border-radius: 5px; border: 1px solid #cbd5e1; background: white; font-size: 13px; font-family: inherit; color: var(--gzl-slate); transition: border-color 0.2s; }
.filtro-input:focus { outline: none; border-color: var(--gzl-blue); }
.filtro-row    { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; }

.btn-consultar {
    background: var(--gzl-navy); color: white; padding: 10px 24px;
    border: none; border-radius: 5px; font-weight: 700; cursor: pointer;
    font-size: 13px; font-family: inherit; white-space: nowrap;
    display: inline-flex; align-items: center; gap: 6px; transition: background 0.15s;
}
.btn-consultar:hover { background: var(--gzl-navy-dark); }

/* --- TABS ESTADO --- */
.dictamen-tabs {
    display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 14px;
}
.dictamen-tab {
    padding: 5px 13px; border-radius: 4px; font-size: 12px; font-weight: 600;
    cursor: pointer; border: 1px solid var(--gzl-border);
    background: var(--gzl-white); color: var(--gzl-slate-light);
    text-decoration: none; transition: all 0.12s;
}
.dictamen-tab:hover  { background: var(--gzl-border-soft); color: var(--gzl-slate); }
.dictamen-tab.active { background: var(--gzl-navy); color: white; border-color: var(--gzl-navy); }

/* --- HEADER COMISIÓN (igual que DOF) --- */
.dictamen-header-comision {
    background-color: var(--gzl-navy); color: #ffffff;
    padding: 10px 20px; font-weight: 800; font-size: 13px;
    letter-spacing: 1px; text-transform: uppercase;
    border-radius: 6px 6px 0 0; margin-top: 20px;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
}

.dictamen-header-categoria {
    background: var(--gzl-border-soft); color: var(--gzl-slate);
    padding: 6px 20px; font-weight: 700; font-size: 11px;
    border-bottom: 1px solid var(--gzl-border);
    text-transform: uppercase; letter-spacing: 0.5px;
}

.dictamen-card {
    background: var(--gzl-white); border: 1px solid var(--gzl-border);
    border-radius: 0 0 6px 6px; overflow: hidden;
}

/* --- ITEM --- */
.dictamen-item {
    border-bottom: 1px solid var(--gzl-border-soft);
    transition: background 0.1s;
}
.dictamen-item:last-child { border-bottom: none; }
.dictamen-item:hover { background: #fafbfc; }

.dictamen-item-inner { padding: 15px 20px 12px; }

/* Título — solo texto, sin link */
.dictamen-titulo {
    font-size: 14px; font-weight: 500; color: #1e293b;
    line-height: 1.55; display: block; margin-bottom: 10px;
}

/* Badge estado — navy/gris únicamente */
.badge-estado {
    display: inline-block;
    padding: 2px 8px; border-radius: 3px;
    font-size: 10px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.3px;
    white-space: nowrap;
}
/* Publicado: verde muy sutil para semáforo de proceso */
.badge-publicado          { background: #e8eef8; color: var(--gzl-navy); }
.badge-aprobado           { background: #e8eef8; color: var(--gzl-navy); }
.badge-aprobado_diputados { background: var(--gzl-border-soft); color: var(--gzl-slate); }
.badge-pendiente_senado   { background: var(--gzl-border-soft); color: var(--gzl-slate-light); }
.badge-en_proceso         { background: var(--gzl-border-soft); color: var(--gzl-slate-light); }

/* Badge categoría — navy sutil */
.badge-cat {
    font-size: 10px; font-weight: 700; text-transform: uppercase;
    color: var(--gzl-navy); background: #e8eef8;
    padding: 1px 6px; border-radius: 3px;
}

/* --- TIMELINE --- */
.dictamen-timeline {
    display: flex; align-items: center;
    gap: 4px; flex-wrap: wrap; margin-bottom: 10px;
}

.tl-paso { display: flex; align-items: center; gap: 4px; font-size: 11px; }
.tl-label {
    background: var(--gzl-border-soft); color: var(--gzl-slate-light);
    padding: 2px 7px; border-radius: 3px; font-weight: 700; white-space: nowrap;
}
.tl-fecha { color: var(--gzl-slate); font-weight: 500; }
.tl-arrow { color: #cbd5e1; font-size: 10px; }

/* Paso con fecha real: más prominente */
.tl-paso.activo .tl-label { background: var(--gzl-navy); color: white; }
/* DOF — ligeramente diferenciado */
.tl-paso.tl-dof .tl-label { background: #1e3a8a; color: #a5f3fc; }

/* --- META --- */
.dictamen-meta {
    display: flex; align-items: center; gap: 10px;
    flex-wrap: wrap; font-size: 11px; color: var(--gzl-slate-light);
    margin-bottom: 10px;
}

/* --- ACCIONES --- */
.dictamen-actions {
    display: flex; align-items: center; gap: 6px;
    flex-wrap: wrap; margin-top: 4px;
}

.btn-accion {
    font-size: 11px; padding: 4px 10px; border-radius: 4px;
    text-decoration: none; font-weight: 600;
    display: inline-flex; align-items: center; gap: 4px;
    border: 1px solid var(--gzl-border); background: var(--gzl-border-soft);
    color: var(--gzl-slate); transition: all 0.12s;
}
.btn-accion:hover { background: var(--gzl-border); color: #1e293b; }

/* DOF Gazhal — ligeramente destacado */
.btn-accion.btn-dof {
    background: #e8eef8; border-color: #c7d2fe; color: var(--gzl-navy);
}
.btn-accion.btn-dof:hover { background: #c7d2fe; }

/* Historial — al final */
.btn-toggle-hist {
    margin-left: auto; font-size: 11px; color: var(--gzl-slate-light);
    background: none; border: 1px solid var(--gzl-border);
    padding: 4px 10px; border-radius: 4px; cursor: pointer;
    font-family: inherit; display: inline-flex; align-items: center; gap: 4px;
    transition: all 0.12s;
}
.btn-toggle-hist:hover  { background: var(--gzl-border-soft); color: var(--gzl-navy); border-color: var(--gzl-navy); }
.btn-toggle-hist.abierto{ background: var(--gzl-navy); color: white; border-color: var(--gzl-navy); }

/* --- PANEL HISTORIAL --- */
.dictamen-historial-panel {
    display: none;
    background: #fafbfc;
    border-top: 1px solid var(--gzl-border);
    padding: 14px 20px 16px;
}
.dictamen-historial-panel.abierto { display: block; }

.hist-panel-titulo {
    font-size: 11px; font-weight: 800; color: var(--gzl-slate-light);
    text-transform: uppercase; letter-spacing: 0.5px;
    margin-bottom: 10px; display: flex; align-items: center; gap: 5px;
}

.hist-tabla {
    width: 100%; border-collapse: collapse; font-size: 12px;
}
.hist-tabla th {
    text-align: left; padding: 5px 10px; font-size: 10px; font-weight: 800;
    text-transform: uppercase; color: var(--gzl-slate-light);
    border-bottom: 2px solid var(--gzl-border); letter-spacing: 0.4px;
    background: var(--gzl-border-soft);
}
.hist-tabla td {
    padding: 8px 10px; border-bottom: 1px solid var(--gzl-border-soft);
    vertical-align: top; color: var(--gzl-slate);
}
.hist-tabla tr:last-child td { border-bottom: none; }
.hist-tabla tr:hover td { background: #f1f5f9; }

/* Fila de cambio de estado — subrayado discreto */
.hist-tabla tr.cambio-estado td {
    border-left: 3px solid var(--gzl-navy);
}
.hist-tabla tr.cambio-estado td:first-child { border-left: 3px solid var(--gzl-navy); }

.hist-campo-badge {
    background: var(--gzl-border); color: var(--gzl-slate);
    padding: 1px 6px; border-radius: 3px; font-size: 10px; font-weight: 700;
    text-transform: uppercase; white-space: nowrap;
}

.hist-val-ant  { color: var(--gzl-slate-light); text-decoration: line-through; font-size: 11px; }
.hist-val-nuevo{ color: var(--gzl-navy); font-weight: 600; }

/* --- PAGINACIÓN --- */
.dictamen-paginacion {
    display: flex; justify-content: center;
    gap: 4px; margin-top: 24px; flex-wrap: wrap;
}
.pag-btn {
    padding: 6px 11px; border-radius: 5px; font-size: 13px; font-weight: 600;
    text-decoration: none; border: 1px solid var(--gzl-border);
    background: white; color: #475569; transition: all 0.12s;
}
.pag-btn:hover  { background: var(--gzl-border-soft); }
.pag-btn.active { background: var(--gzl-navy); color: white; border-color: var(--gzl-navy); }

/* --- EMPTY --- */
.dictamen-empty {
    text-align: center; padding: 60px 20px; color: #94a3b8;
}
.dictamen-empty i { font-size: 36px; margin-bottom: 12px; display: block; opacity: 0.3; }

@media (max-width: 768px) {
    .filtro-row            { flex-direction: column; }
    .dictamen-item-inner   { padding: 12px 14px; }
    .dictamen-timeline     { flex-direction: column; align-items: flex-start; }
    .dictamen-actions      { flex-wrap: wrap; }
    .hist-tabla            { font-size: 11px; }
}
/* HEADER */
.dictamen-header{
    background:#f1f5f9;
    color:#0f2f76;
    padding:15px 18px;
    border-radius:10px;
    margin-bottom:15px;
    border-left:4px solid #0093C9;
}

.dictamen-titulo{
    font-size:15px;
    font-weight:600;
    line-height:1.5;
    text-transform:none; /* 🔥 QUITA MAYÚSCULAS */
}

.dictamen-meta{
    font-size:13px;
    opacity:.85;
}