.boton {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px;
    padding: 9px 15px; border: 1px solid var(--color-primario); border-radius: 6px;
    background: var(--color-primario); color: #fff; font-size: .86rem; font-weight: 700;
    letter-spacing: .01em; cursor: pointer; transition: background .15s, border-color .15s, transform .15s, box-shadow .15s;
}
.boton:hover { background: var(--color-primario-hover); border-color: var(--color-primario-hover); color: #fff; text-decoration: none; box-shadow: 0 3px 9px rgba(124,61,8,.18); }
.boton:active { transform: translateY(1px); }
.boton:disabled { background: #9aa5ad; border-color: #9aa5ad; cursor: not-allowed; box-shadow: none; }
.boton--ancho { width: 100%; }
.boton--secundario { background: #fff; color: #33434f; border-color: var(--color-borde-fuerte); }
.boton--secundario:hover { background: #f2f5f7; border-color: #9eabb4; color: #17232d; }

.fila-filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 18px; }
.fila-filtros .campo { margin-bottom: 0; min-width: min(180px, 100%); flex: 1 1 180px; }

.tabla-datos {
    width: 100%; border-collapse: separate; border-spacing: 0; background: var(--color-superficie);
    border: 1px solid var(--color-borde); border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(22,39,52,.035);
}
.tabla-datos th, .tabla-datos td { padding: 11px 13px; text-align: left; border-bottom: 1px solid #e7ecef; font-size: .86rem; vertical-align: middle; }
.tabla-datos th { background: #e9eef1; color: #42515c; font-weight: 750; text-transform: uppercase; font-size: .68rem; letter-spacing: .075em; white-space: nowrap; }
.tabla-datos tbody tr:last-child td { border-bottom: 0; }
.tabla-datos tbody tr:hover { background: #fffaf2; }
.tabla-datos td .boton { min-height: 32px; padding: 5px 9px; font-size: .76rem; }
.tabla-datos code { color: #394b57; font-size: .78rem; overflow-wrap: anywhere; }

.badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border: 1px solid transparent; border-radius: 999px; font-size: .7rem; font-weight: 750; white-space: nowrap; }
.badge--sede-compartida { background: #e9eef4; color: #425a70; border-color: #d2dce5; }
.badge--sede { background: #e7f5ec; color: #17643e; border-color: #c6e7d1; }
.estado-vacio { text-align: center; color: var(--color-texto-suave); padding: 34px 16px; }

.aviso-licencias {
    margin: 0 0 18px; padding: 15px 18px; border: 1px solid #f0d39d; border-left: 4px solid #d97706;
    border-radius: 8px; background: #fff9ed; box-shadow: 0 3px 10px rgba(98,66,18,.04);
}
.aviso-licencias h2 { margin: 0 0 8px; font-size: 1rem; }
.aviso-licencias__lista { display: grid; gap: 6px; }
.aviso-licencias__fila { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 7px; border-top: 1px solid #f3e5ca; font-size: .86rem; }
.aviso-licencias__dias { color: #874809; font-weight: 750; white-space: nowrap; }
.comparativos-panel { margin-bottom: 20px; }
.comparativos-panel__encabezado { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.comparativos-panel__encabezado h2 { margin: 0 0 4px; }
.comparativos-panel__encabezado p { margin: 0; color: var(--color-texto-suave); font-size: .84rem; }
.comparativos-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.comparativo-periodo { padding: 16px; border: 1px solid var(--color-borde); border-radius: 8px; background: var(--color-superficie-2); }
.comparativo-periodo h3 { margin: 0 0 3px; font-size: .98rem; }
.comparativo-periodo__rango { margin: 0 0 13px; color: var(--color-texto-suave); font-size: .75rem; }
.comparativo-periodo__columnas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.comparativo-metrica { padding: 11px; border-radius: 6px; background: #fff; border: 1px solid #e6ebef; }
.comparativo-metrica span { display: block; color: var(--color-texto-suave); font-size: .72rem; }
.comparativo-metrica strong { display: block; margin-top: 3px; font-size: 1.12rem; font-variant-numeric: tabular-nums; }
.comparativo-metrica small { display: block; margin-top: 3px; font-size: .72rem; }
.variacion-positiva { color: #16794a; }
.variacion-negativa { color: #b42318; }
.variacion-neutra { color: var(--color-texto-suave); }
.comparativos-estado { min-height: 20px; color: var(--color-texto-suave); font-size: .82rem; }

input[type="checkbox"], input[type="radio"] { accent-color: var(--color-primario); }
hr { border: 0; border-top: 1px solid var(--color-borde); margin: 20px 0; }

@media (max-width: 720px) {
    .fila-filtros { align-items: stretch; }
    .fila-filtros .campo { flex-basis: 100%; }
    .tabla-datos { min-width: 620px; }
    .tabla-datos th, .tabla-datos td { padding: 9px 10px; }
    .comparativos-grid { grid-template-columns: 1fr; }
    .comparativos-panel__encabezado { align-items: stretch; flex-direction: column; }
    .aviso-licencias__fila { align-items: flex-start; flex-direction: column; gap: 2px; }
}
