/* =====================================================================
   CALENDARIO DE AUSENCIAS (Vacaciones → Ver calendario) · diseño 2026-11
   Columna principal (barra + calendario) y panel lateral (revisión,
   detalle del día y pendientes). Reutiliza los colores cal-tipo-* y
   cal-pendiente de aineder-pro.css.
   ===================================================================== */

.cv-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 18px;
    align-items: start;
}

.cv-principal { display: flex; flex-direction: column; gap: 14px; min-width: 0; }

.cv-lateral {
    position: sticky;
    top: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    padding-bottom: 4px;
}

@media (max-width: 1280px) {
    .cv-layout { grid-template-columns: 1fr; }
    .cv-lateral { position: static; max-height: none; overflow: visible; order: -1; }
}

.cv-tarjeta,
.cv-barra,
.cv-mes,
.cv-revision {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 1px 2px rgba(10, 15, 24, .04), 0 8px 24px rgba(10, 15, 24, .06);
}

.cv-tarjeta { padding: 18px; }

.cv-mensaje-ok {
    margin-bottom: 14px;
    padding: 12px 16px;
    border-radius: 12px;
    background: #E7F8ED;
    color: #0B6634;
    font-weight: 600;
}

/* ---------- Barra ---------- */

.cv-barra { padding: 16px 18px; display: flex; flex-direction: column; gap: 14px; }

.cv-barra-fila { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

.cv-navegacion { display: flex; align-items: center; gap: 8px; }
.cv-navegacion h2 { margin: 0 6px; min-width: 190px; text-align: center; font-size: 1.35rem; color: #001E4D; }

.cv-flecha, .cv-hoy {
    height: 36px;
    border: 1px solid #E3E6EA;
    border-radius: 10px;
    background: #fff;
    color: #001E4D;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.cv-flecha { width: 36px; font-size: 1.3rem; line-height: 1; }
.cv-hoy { padding: 0 14px; margin-left: 4px; }
.cv-flecha:hover, .cv-hoy:hover { background: #F2F5FA; border-color: #C9D3E3; }

.cv-segmento { display: inline-flex; padding: 4px; border-radius: 12px; background: #EEF1F5; }
.cv-segmento button {
    border: 0; background: transparent; padding: 7px 16px; border-radius: 9px;
    font-weight: 700; font-size: .86rem; color: #4A4F55; cursor: pointer;
}
.cv-segmento button.activa { background: #fff; color: #001E4D; box-shadow: 0 1px 3px rgba(0, 30, 77, .15); }

.cv-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cv-kpis > div {
    padding: 10px 14px;
    border-radius: 12px;
    background: #F7F9FC;
    border: 1px solid #EDF0F5;
    display: flex; flex-direction: column; gap: 2px;
}
.cv-kpis span { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #6B7280; }
.cv-kpis strong { font-size: 1.35rem; color: #001E4D; line-height: 1.2; }
.cv-kpis strong.cv-kpi-texto { font-size: .98rem; padding-top: 4px; }
.cv-kpis > div.cv-kpi-aviso { background: #FFF7E6; border-color: #FBE3B5; }
.cv-kpis > div.cv-kpi-aviso strong { color: #9A5B00; }

.cv-filtros { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.cv-campo { display: flex; flex-direction: column; gap: 4px; min-width: 130px; }
.cv-campo span { font-size: .72rem; font-weight: 700; color: #6B7280; }
.cv-campo select, .cv-campo input {
    height: 36px; padding: 0 10px; border: 1px solid #E3E6EA; border-radius: 10px;
    background: #fff; color: #001E4D; font-size: .88rem;
}
.cv-campo-buscar { flex: 1; min-width: 180px; }
.cv-interruptor { display: flex; align-items: center; gap: 8px; height: 36px; font-size: .88rem; font-weight: 600; color: #001E4D; cursor: pointer; }
.cv-interruptor input { width: 16px; height: 16px; accent-color: #001E4D; }

.cv-leyenda { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .78rem; color: #4A4F55; padding-top: 10px; border-top: 1px dashed #E3E6EA; }
.cv-leyenda span { display: inline-flex; align-items: center; gap: 6px; }
.cv-muestra { width: 14px; height: 14px; border-radius: 4px; border: 1px solid rgba(0, 0, 0, .08); display: inline-block; }
.cv-muestra-festivo { background: #FDECEC; box-shadow: inset 0 3px 0 #D64545; }
.cv-muestra-cierre { background: #FFF1E0; box-shadow: inset 0 3px 0 #D97706; }
.cv-muestra-especial { background: #E6F6F4; box-shadow: inset 0 3px 0 #0F766E; }
.cv-muestra-libre { background: repeating-linear-gradient(135deg, #F3F4F6 0 4px, #E9EBEF 4px 8px); }
.cv-muestra-revision { background: #EAF1FF; box-shadow: inset 0 0 0 2px #2F6FD6; }

/* ---------- Mes ---------- */

.cv-mes {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
    padding: 14px;
}

.cv-cabecera-dia {
    padding: 4px 0 6px;
    text-align: center;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8A9099;
}

.cv-celda {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 112px;
    padding: 7px 7px 8px;
    border: 1px solid #ECEEF2;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    overflow: hidden;
    transition: border-color .15s, box-shadow .15s;
}
.cv-celda:hover { border-color: #B9C6DC; box-shadow: 0 4px 14px rgba(0, 30, 77, .08); }
.cv-celda.cv-vacia { border: none; background: transparent; cursor: default; box-shadow: none; }

.cv-celda.cv-libre { background: repeating-linear-gradient(135deg, #FAFBFC 0 6px, #F3F5F8 6px 12px); }
.cv-celda.cv-festivo { background: #FDF3F3; border-color: #F6D5D5; box-shadow: inset 0 3px 0 #D64545; }
.cv-celda.cv-cierre { background: #FFF6EB; border-color: #F8DDBA; box-shadow: inset 0 3px 0 #D97706; }
.cv-celda.cv-especial { background: #F0FAF8; border-color: #CDEBE6; box-shadow: inset 0 3px 0 #0F766E; }

/* Días de la solicitud en revisión: banda azul */
.cv-celda.cv-en-revision {
    background: #EEF4FF;
    border-color: #2F6FD6;
    box-shadow: inset 0 0 0 1px #2F6FD6;
}

/* Festivo, cierre o jornada especial dentro de la revisión: se mantiene su franja de color */
.cv-celda.cv-festivo.cv-en-revision { box-shadow: inset 0 3px 0 #D64545, inset 0 0 0 1px #2F6FD6; }
.cv-celda.cv-cierre.cv-en-revision { box-shadow: inset 0 3px 0 #D97706, inset 0 0 0 1px #2F6FD6; }
.cv-celda.cv-especial.cv-en-revision { box-shadow: inset 0 3px 0 #0F766E, inset 0 0 0 1px #2F6FD6; }
.cv-celda.cv-libre.cv-en-revision { background: repeating-linear-gradient(135deg, #EEF4FF 0 6px, #E3ECFB 6px 12px); }

.cv-celda.cv-seleccionada { border-color: #001E4D; box-shadow: 0 0 0 3px rgba(0, 30, 77, .16); }

.cv-celda-cabecera { display: flex; align-items: center; justify-content: space-between; }

.cv-numero {
    min-width: 26px; height: 26px; display: grid; place-items: center;
    border-radius: 8px; font-size: .9rem; font-weight: 700; color: #001E4D;
}
.cv-celda.cv-libre .cv-numero { color: #9AA1AB; }
.cv-celda.cv-hoy .cv-numero { background: #001E4D; color: #fff; }

.cv-carga {
    min-width: 22px; padding: 1px 7px; border-radius: 999px;
    background: #E8EEF8; color: #001E4D; font-size: .72rem; font-weight: 800; text-align: center;
}
.cv-carga.media { background: #FEF3C7; color: #8A4B00; }
.cv-carga.alta { background: #FDE2E2; color: #B91C1C; }

.cv-etiqueta-dia {
    font-size: .7rem; font-weight: 700; line-height: 1.2;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    color: #A12C2C;
}
.cv-celda.cv-cierre .cv-etiqueta-dia { color: #9A5300; }
.cv-celda.cv-especial .cv-etiqueta-dia { color: #0F5F57; }

.cv-chips { display: flex; flex-direction: column; gap: 3px; }
.cv-tenue { opacity: .5; }

.cv-chip {
    display: flex; align-items: center; gap: 5px;
    padding: 2px 6px 2px 2px;
    border: 1px solid transparent;
    border-radius: 7px;
    font-size: .72rem; font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cv-chip i {
    flex-shrink: 0;
    width: 18px; height: 18px; border-radius: 5px;
    display: grid; place-items: center;
    background: rgba(255, 255, 255, .75);
    font-style: normal; font-size: .6rem; font-weight: 800;
}
.cv-chip-revision { outline: 2px solid #2F6FD6; outline-offset: 0; font-weight: 800; }

.cv-mas { font-size: .7rem; font-weight: 700; color: #6B7280; padding-left: 4px; }

/* ---------- Por persona ---------- */

.cv-tabla-contenedor { overflow-x: auto; }

.cv-tabla { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .75rem; }
.cv-tabla th, .cv-tabla td { min-width: 28px; height: 36px; padding: 0; border-bottom: 1px solid #F0F2F5; text-align: center; }
.cv-tabla th { color: #6B7280; font-weight: 600; }
.cv-tabla th small { display: block; font-size: .62rem; opacity: .8; }
.cv-tabla th span { font-weight: 800; color: #001E4D; }
.cv-tabla th.cv-hoy span { background: #001E4D; color: #fff; border-radius: 6px; padding: 1px 4px; }
.cv-tabla .cv-libre { background: #F7F8FA; }
.cv-tabla .cv-festivo { background: #FDF3F3; }
.cv-tabla .cv-cierre { background: #FFF6EB; }
.cv-tabla .cv-especial { background: #F0FAF8; }
.cv-tabla th.cv-en-revision { box-shadow: inset 0 -3px 0 #2F6FD6; }

.cv-tabla .cv-tabla-nombre {
    position: sticky; left: 0; z-index: 1;
    min-width: 200px; max-width: 230px;
    padding: 0 12px;
    background: #fff;
    color: #001E4D; font-weight: 600; text-align: left;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cv-tabla .cv-tabla-nombre .cv-avatar { margin-right: 8px; vertical-align: middle; }
.cv-fila-revision .cv-tabla-nombre { background: #EEF4FF; }

.cv-barra-dia { display: block; height: 22px; margin: 0 1px; border: 1px solid transparent; border-radius: 6px; cursor: pointer; }

.cv-tabla tfoot td { color: #001E4D; font-weight: 800; border-bottom: none; }
.cv-total { background: #EEF2FF; }
.cv-total-alto { background: #FDE2E2; color: #B91C1C !important; }

/* ---------- Panel lateral ---------- */

.cv-revision {
    padding: 18px;
    border: 2px solid #2F6FD6;
}

.cv-revision-cabecera { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cv-revision-cabecera h3 { margin: 0; font-size: 1rem; color: #001E4D; }
.cv-revision-etiqueta { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #2F6FD6; }

.cv-cerrar {
    width: 28px; height: 28px; border-radius: 8px; border: 0;
    background: #F2F4F7; color: #4A4F55; cursor: pointer; font-size: .8rem;
}
.cv-cerrar:hover { background: #E6E9EE; }

.cv-persona { display: flex; align-items: center; gap: 12px; margin: 12px 0 10px; }
.cv-persona strong { display: block; font-size: 1.05rem; color: #111827; }

.cv-avatar {
    display: inline-grid; place-items: center;
    width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
    background: linear-gradient(135deg, #001E4D, #2F6FD6);
    color: #fff; font-style: normal; font-size: .72rem; font-weight: 800;
}
.cv-avatar.grande { width: 46px; height: 46px; border-radius: 13px; font-size: .95rem; }

.cv-tipo { display: inline-block; margin-top: 3px; padding: 2px 9px; border-radius: 999px; font-size: .72rem; font-weight: 700; border: 1px solid transparent; }

.cv-datos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 10px; }
.cv-datos > div { padding: 8px 10px; border-radius: 10px; background: #F7F9FC; }
.cv-datos dt { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #6B7280; }
.cv-datos dd { margin: 2px 0 0; font-weight: 700; color: #001E4D; font-size: .9rem; text-transform: none; }

.cv-estado { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .72rem; font-weight: 800; }
.cv-estado.pendiente { background: #FEF3C7; color: #8A4B00; }
.cv-estado.aprobada { background: #DCFCE7; color: #15803D; }

.cv-motivo { margin: 0 0 10px; padding: 8px 12px; border-left: 3px solid #D6DCE6; color: #4A4F55; font-size: .86rem; font-style: italic; }

.cv-semaforo { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 10px; font-size: .86rem; font-weight: 700; }
.cv-semaforo b { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: .75rem; flex-shrink: 0; }
.cv-semaforo.verde { background: #E7F8ED; color: #0B6634; }
.cv-semaforo.verde b { background: #16A34A; }
.cv-semaforo.ambar { background: #FFF7E6; color: #8A4B00; }
.cv-semaforo.ambar b { background: #D97706; }
.cv-semaforo.rojo { background: #FDECEC; color: #A12C2C; }
.cv-semaforo.rojo b { background: #DC2626; }

.cv-coincidencias { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cv-coincidencias li { display: flex; gap: 8px; align-items: flex-start; font-size: .84rem; }
.cv-coincidencias li .cal-punto { margin-top: 4px; }
.cv-coincidencias strong { display: block; color: #111827; }
.cv-coincidencias small { color: #6B7280; }

.cv-nota { margin: 10px 0 0; font-size: .8rem; color: #6B7280; }

.cv-decision { margin-top: 14px; padding-top: 14px; border-top: 1px dashed #E3E6EA; display: flex; flex-direction: column; gap: 8px; }
.cv-decision label { font-size: .78rem; font-weight: 700; color: #4A4F55; }
.cv-decision textarea {
    width: 100%; resize: vertical; min-height: 64px;
    padding: 8px 10px; border: 1px solid #E3E6EA; border-radius: 10px;
    font: inherit; font-size: .86rem;
}
.cv-decision textarea:focus { outline: none; border-color: #2F6FD6; box-shadow: 0 0 0 3px rgba(47, 111, 214, .15); }
.cv-error { color: #B91C1C; font-size: .82rem; font-weight: 600; }

.cv-botones { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; }
.cv-botones button {
    height: 42px; border-radius: 11px; font-weight: 800; font-size: .92rem; cursor: pointer;
    transition: filter .15s, background .15s;
}
.cv-rechazar { border: 1px solid #F3C4C4; background: #fff; color: #B91C1C; }
.cv-rechazar:hover:not(:disabled) { background: #FDF2F2; }
.cv-aprobar { border: 0; background: #15803D; color: #fff; }
.cv-aprobar:hover:not(:disabled) { filter: brightness(1.08); }
.cv-botones button:disabled { opacity: .6; cursor: default; }

.cv-titulo-lateral { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 1rem; color: #001E4D; }
.cv-contador { padding: 1px 8px; border-radius: 999px; background: #FEF3C7; color: #8A4B00; font-size: .74rem; font-weight: 800; }

.cv-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cv-lista li {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px; border: 1px solid #EDF0F5; border-radius: 12px;
    cursor: pointer; transition: border-color .15s, background .15s;
}
.cv-lista li:hover { border-color: #B9C6DC; background: #F8FAFD; }
.cv-lista li.activa { border-color: #2F6FD6; background: #EEF4FF; }
.cv-lista li > div { flex: 1; min-width: 0; }
.cv-lista strong { display: block; font-size: .86rem; color: #111827; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-lista small { display: block; font-size: .74rem; color: #6B7280; }
.cv-ir { color: #2F6FD6; font-size: 1.2rem; font-weight: 700; }

.cv-vacio { margin: 0; font-size: .86rem; color: #6B7280; }

.cv-dia .cv-nota { margin: 4px 0 10px; }

@media (max-width: 900px) {
    .cv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cv-mes { gap: 3px; padding: 8px; }
    .cv-celda { min-height: 64px; padding: 4px; }
    .cv-chip { font-size: 0; height: 6px; padding: 0; }
    .cv-chip i { display: none; }
    .cv-etiqueta-dia, .cv-mas { display: none; }
    .cv-navegacion h2 { min-width: 0; font-size: 1.1rem; }
}