/* =============================================================================
   tadosi-ui.css — Formato común de pantallas TADOSI (formato "vf")
   13/10/2026. Sacado de verifactu.css: es la parte general (cabecera, botones,
   KPIs, avisos, pestañas, filtros, listas, badges, paginación, barras fijas,
   formularios, ayuda "¿Qué elijo?", formulario de factura .vf-nf, PDF...).
   Se mantienen las clases "vf-" (las usan las pantallas VERI*FACTU).
   Cargar SIEMPRE antes de verifactu.css (si la pantalla lo usa).
   Colores de la marca: azul #01397F, turquesa #1B799B.
   ============================================================================= */

:root {
    --vf-azul: #01397F;
    --vf-turquesa: #1B799B;
    --vf-texto: #2c3e50;
    --vf-suave: #6b7a8c;
    --vf-borde: #e3e8ef;
    --vf-fondo: #f6f8fb;
    --vf-ok: #1e8e5a;
    --vf-ok-bg: #e7f6ee;
    --vf-aviso: #b26a00;
    --vf-aviso-bg: #fff4e0;
    --vf-error: #c0392b;
    --vf-error-bg: #fdecea;
    --vf-info: #1B799B;
    --vf-info-bg: #e6f3f7;
    --vf-gris-bg: #eef1f5;
}

.vf-page { color: var(--vf-texto); }
.vf-page * { box-sizing: border-box; }

/* ---- Cabecera ---------------------------------------------------------- */
.vf-head {
    background: #fff;
    border-radius: 6px;
    padding: 18px 20px;
    margin-bottom: 16px;
    border-left: 4px solid var(--vf-azul);
    box-shadow: 0 1px 2px rgba(0,0,0,.06);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
}
.vf-head h2 { margin: 0; font-size: 22px; font-weight: 600; color: var(--vf-azul); }
.vf-head p { margin: 4px 0 0; color: var(--vf-suave); font-size: 13px; max-width: 760px; line-height: 1.5; }
.vf-head-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* ---- Botones ----------------------------------------------------------- */
.vf-btn {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid var(--vf-borde); background: #fff; color: var(--vf-texto);
    border-radius: 4px; padding: 7px 12px; font-size: 13px; cursor: pointer;
    text-decoration: none !important; line-height: 1.2; white-space: nowrap;
}
.vf-btn:hover { border-color: var(--vf-turquesa); color: var(--vf-turquesa); }
.vf-btn-primary { background: var(--vf-azul); border-color: var(--vf-azul); color: #fff !important; font-weight: 600; }
.vf-btn-primary:hover { background: #022d63; color: #fff; }
.vf-btn-primary[disabled] { background: #9aa8ba; border-color: #9aa8ba; cursor: not-allowed; }
.vf-btn-sm { padding: 4px 9px; font-size: 12px; }
.vf-btn-link { border: none; background: none; color: var(--vf-turquesa); padding: 2px 0; }
.vf-btn-link:hover { text-decoration: underline !important; }

/* ---- Tarjetas resumen (KPI) ------------------------------------------- */
.vf-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 16px; }
.vf-kpi {
    background: #fff; border-radius: 6px; padding: 14px 16px; cursor: pointer;
    border: 1px solid var(--vf-borde); border-top: 3px solid var(--vf-borde);
    transition: box-shadow .15s, transform .15s; text-align: left;
}
.vf-kpi:hover { box-shadow: 0 3px 10px rgba(1,57,127,.10); transform: translateY(-1px); }
.vf-kpi.activo { box-shadow: 0 0 0 2px var(--vf-turquesa) inset; }
.vf-kpi .vf-kpi-num { font-size: 26px; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
.vf-kpi .vf-kpi-label { font-size: 12px; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .4px; margin-top: 2px; }
.vf-kpi .vf-kpi-sub { font-size: 12px; color: var(--vf-suave); margin-top: 6px; font-variant-numeric: tabular-nums; }
.vf-kpi.k-pend { border-top-color: var(--vf-azul); } .vf-kpi.k-pend .vf-kpi-num { color: var(--vf-azul); }
.vf-kpi.k-reint { border-top-color: var(--vf-aviso); } .vf-kpi.k-reint .vf-kpi-num { color: var(--vf-aviso); }
.vf-kpi.k-error { border-top-color: var(--vf-error); } .vf-kpi.k-error .vf-kpi-num { color: var(--vf-error); }
.vf-kpi.k-aviso { border-top-color: #e0a800; } .vf-kpi.k-aviso .vf-kpi-num { color: var(--vf-aviso); }
.vf-kpi.k-ok { border-top-color: var(--vf-ok); } .vf-kpi.k-ok .vf-kpi-num { color: var(--vf-ok); }
.vf-kpi.k-gris { border-top-color: #9aa8ba; } .vf-kpi.k-gris .vf-kpi-num { color: var(--vf-suave); }

/* ---- Avisos ------------------------------------------------------------ */
.vf-banner {
    display: flex; gap: 12px; align-items: flex-start; padding: 12px 16px; border-radius: 6px;
    margin-bottom: 16px; font-size: 13px; line-height: 1.5; border: 1px solid transparent;
}
.vf-banner i.fa { font-size: 18px; margin-top: 1px; }
.vf-banner.info { background: var(--vf-info-bg); color: #0f5468; border-color: #c7e3ec; }
.vf-banner.ok { background: var(--vf-ok-bg); color: #145c3b; border-color: #c5e8d5; }
.vf-banner.error { background: var(--vf-error-bg); color: #8a271d; border-color: #f5c6c0; }
.vf-banner .vf-banner-body { flex: 1; }
.vf-banner b { font-weight: 600; }

/* ---- Panel principal: pestañas + barra de filtros ---------------------- */
.vf-panel { background: #fff; border-radius: 6px; border: 1px solid var(--vf-borde); box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.vf-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--vf-borde); padding: 0 8px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.vf-tab {
    border: none; background: none; padding: 13px 14px 11px; font-size: 13px; color: var(--vf-suave);
    border-bottom: 3px solid transparent; cursor: pointer; white-space: nowrap; font-weight: 500;
}
.vf-tab:hover { color: var(--vf-azul); }
.vf-tab.activo { color: var(--vf-azul); border-bottom-color: var(--vf-azul); font-weight: 600; }
.vf-tab .vf-count { display: inline-block; min-width: 20px; padding: 1px 6px; margin-left: 6px; border-radius: 10px; background: var(--vf-gris-bg); font-size: 11px; color: var(--vf-texto); text-align: center; }
.vf-tab.activo .vf-count { background: var(--vf-azul); color: #fff; }

.vf-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--vf-borde); background: var(--vf-fondo); }
.vf-search { position: relative; flex: 1 1 240px; min-width: 200px; }
.vf-search i { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--vf-suave); }
.vf-search input { width: 100%; padding: 7px 10px 7px 30px; border: 1px solid var(--vf-borde); border-radius: 4px; font-size: 13px; height: 34px; }
.vf-fechas { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; color: var(--vf-suave); }
.vf-fechas input { border: 1px solid var(--vf-borde); border-radius: 4px; padding: 5px 8px; font-size: 13px; height: 34px; }
.vf-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.vf-chip { border: 1px solid var(--vf-borde); background: #fff; border-radius: 16px; padding: 4px 11px; font-size: 12px; cursor: pointer; color: var(--vf-texto); }
.vf-chip.activo { background: var(--vf-azul); border-color: var(--vf-azul); color: #fff; }
.vf-ayuda { padding: 10px 16px; font-size: 12.5px; color: var(--vf-suave); border-bottom: 1px solid var(--vf-borde); line-height: 1.5; }
.vf-ayuda b { color: var(--vf-texto); }

/* ---- Lista (tabla en escritorio, tarjetas en móvil) -------------------- */
.vf-list { width: 100%; }
.vf-row {
    display: grid; grid-template-columns: 44px minmax(170px, 1.1fr) minmax(190px, 1.4fr) 130px minmax(220px, 1.6fr) 150px;
    gap: 12px; align-items: start; padding: 12px 16px; border-bottom: 1px solid var(--vf-borde); font-size: 13px;
}
.vf-list.sin-check .vf-row { grid-template-columns: minmax(170px, 1.1fr) minmax(190px, 1.4fr) 130px minmax(220px, 1.6fr) 150px; }
.vf-row.vf-row-head { background: var(--vf-fondo); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; padding-top: 9px; padding-bottom: 9px; position: sticky; top: 0; z-index: 2; }
.vf-row:not(.vf-row-head):hover { background: #fafcff; }
.vf-row.seleccionada { background: #eef5fb !important; }
.vf-row.bloqueada { opacity: .75; }
.vf-cell { min-width: 0; overflow-wrap: anywhere; }
.vf-cell .vf-label { display: none; }
.vf-num { font-weight: 600; color: var(--vf-azul); font-size: 14px; }
.vf-sub { color: var(--vf-suave); font-size: 12px; margin-top: 2px; }
.vf-importe { text-align: right; font-variant-numeric: tabular-nums; }
.vf-importe .vf-total { font-weight: 700; font-size: 14px; }
.vf-acciones { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.vf-check { font-size: 20px; color: var(--vf-turquesa); cursor: pointer; line-height: 1; padding-top: 2px; }
.vf-check.fa-check-square { color: var(--vf-azul); }
.vf-vacio { padding: 50px 20px; text-align: center; color: var(--vf-suave); }
.vf-vacio i { font-size: 34px; display: block; margin-bottom: 10px; color: #c2ccd8; }
.vf-cargando { padding: 40px; text-align: center; color: var(--vf-suave); }

/* Estados */
.vf-badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 12px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.vf-badge.ok { background: var(--vf-ok-bg); color: var(--vf-ok); }
.vf-badge.aviso { background: var(--vf-aviso-bg); color: var(--vf-aviso); }
.vf-badge.error { background: var(--vf-error-bg); color: var(--vf-error); }
.vf-badge.info { background: var(--vf-info-bg); color: var(--vf-info); }
.vf-badge.gris { background: var(--vf-gris-bg); color: var(--vf-suave); }
.vf-badge.azul { background: #e6edf7; color: var(--vf-azul); }
.vf-tag { display: inline-block; font-size: 10.5px; padding: 1px 6px; border-radius: 3px; background: var(--vf-gris-bg); color: var(--vf-suave); margin: 3px 4px 0 0; font-weight: 600; letter-spacing: .3px; }
.vf-msg { margin-top: 6px; font-size: 12px; line-height: 1.45; color: var(--vf-texto); }
.vf-msg.error { color: #8a271d; }
.vf-msg .vf-cod { font-family: Consolas, monospace; background: var(--vf-error-bg); padding: 0 4px; border-radius: 3px; }
.vf-hint { margin-top: 4px; font-size: 11.5px; color: var(--vf-suave); line-height: 1.4; }

/* Paginación */
.vf-pager { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 16px; font-size: 12.5px; color: var(--vf-suave); flex-wrap: wrap; }
.vf-pager .vf-pager-btns { display: flex; gap: 6px; align-items: center; }

/* Barra de selección (fija abajo) */
.vf-selbar {
    position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between;
    background: #fff; border-top: 1px solid var(--vf-borde); padding: 12px 16px; box-shadow: 0 -4px 12px rgba(0,0,0,.05); border-radius: 0 0 6px 6px;
}
.vf-selbar .vf-sel-info { font-size: 13px; }
.vf-selbar .vf-sel-info b { color: var(--vf-azul); font-size: 15px; }
.vf-selbar .vf-sel-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.vf-spin { display: inline-block; animation: vf-giro 1s linear infinite; }
@keyframes vf-giro { to { transform: rotate(360deg); } }

/* ---- Móvil ------------------------------------------------------------- */
@media (max-width: 991px) {
    .vf-row, .vf-list.sin-check .vf-row { grid-template-columns: 1fr 1fr; gap: 8px 14px; }
    .vf-row.vf-row-head { display: none; }
    .vf-row { position: relative; padding: 14px 16px; }
    .vf-row .vf-cell-check { position: absolute; top: 14px; right: 14px; }
    .vf-row .vf-cell-factura { grid-column: 1 / -1; padding-right: 36px; }
    .vf-row .vf-cell-estado, .vf-row .vf-cell-acciones { grid-column: 1 / -1; }
    .vf-cell .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; color: var(--vf-suave); letter-spacing: .4px; margin-bottom: 2px; }
    .vf-importe { text-align: left; }
    .vf-acciones { flex-direction: row; flex-wrap: wrap; gap: 6px 14px; }
}
@media (max-width: 600px) {
    .vf-head { padding: 14px; }
    .vf-head h2 { font-size: 19px; }
    .vf-kpis { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .vf-kpi { padding: 10px 12px; }
    .vf-kpi .vf-kpi-num { font-size: 21px; }
    .vf-row, .vf-list.sin-check .vf-row { grid-template-columns: 1fr; }
    .vf-toolbar { padding: 10px 12px; }
    .vf-fechas { width: 100%; }
    .vf-fechas input { flex: 1; min-width: 0; }
    .vf-selbar { flex-direction: column; align-items: stretch; }
    .vf-selbar .vf-sel-actions .vf-btn { flex: 1; justify-content: center; }
}
.vf-chip .vf-count { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--vf-gris-bg); font-size: 10.5px; color: var(--vf-texto); text-align: center; }
.vf-chip.activo .vf-count { background: rgba(255,255,255,.25); color: #fff; }
/* El tema del panel añade márgenes a los iconos de los botones */
.vf-page .vf-btn .fa, .vf-page .vf-tab .fa, .vf-page .vf-badge .fa { margin: 0 !important; width: auto; }
.vf-page .vf-tab .fa { margin-right: 4px !important; }
@media (max-width: 600px) {
    .vf-selbar .vf-sel-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
    .vf-selbar .vf-sel-actions .vf-btn { padding: 6px 8px; font-size: 12px; }
    .vf-selbar .vf-sel-actions .vf-btn-primary { grid-column: 1 / -1; padding: 10px; font-size: 14px; }
    .vf-selbar { padding: 10px 12px; gap: 6px; }
}

/* =============================================================================
   Formularios (Configuración VERI*FACTU y futuras pantallas de edición)
   ============================================================================= */
.vf-card { background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; margin-bottom: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.vf-card-head { padding: 14px 18px; border-bottom: 1px solid var(--vf-borde); display: flex; gap: 12px; align-items: flex-start; }
.vf-card-head .vf-card-icon { width: 36px; height: 36px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 17px; flex: none; }
.vf-card-head h3 { margin: 0; font-size: 16px; font-weight: 600; color: var(--vf-azul); }
.vf-card-head p { margin: 3px 0 0; font-size: 12.5px; color: var(--vf-suave); line-height: 1.5; }
.vf-card-body { padding: 16px 18px; }
.vf-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 22px; }
.vf-field label { display: block; font-size: 12px; font-weight: 600; color: var(--vf-texto); margin-bottom: 5px; text-transform: none; }
.vf-field label .vf-req { color: var(--vf-error); margin-left: 2px; }
.vf-field select, .vf-field input[type=text], .vf-field input[type=password] {
    width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; color: var(--vf-texto);
}
.vf-field select:focus, .vf-field input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.vf-field.invalido select, .vf-field.invalido input { border-color: var(--vf-error); }
.vf-field .vf-help { font-size: 12px; color: var(--vf-suave); margin-top: 5px; line-height: 1.45; }
.vf-field .vf-err { font-size: 12px; color: var(--vf-error); margin-top: 4px; display: none; }
.vf-field.invalido .vf-err { display: block; }
.vf-pass { position: relative; }
.vf-pass input { padding-right: 38px !important; }
.vf-pass .vf-ojo { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: none; background: none; color: var(--vf-suave); cursor: pointer; padding: 4px; }

/* Lista de comprobación (estado de la configuración) */
.vf-checklist { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-bottom: 16px; }
.vf-check-item { background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; display: flex; gap: 10px; align-items: flex-start; }
.vf-check-item .vf-ci-icon { font-size: 20px; line-height: 1; margin-top: 1px; }
.vf-check-item.ok .vf-ci-icon { color: var(--vf-ok); }
.vf-check-item.aviso .vf-ci-icon { color: #e0a800; }
.vf-check-item.error .vf-ci-icon { color: var(--vf-error); }
.vf-check-item .vf-ci-title { font-weight: 600; font-size: 13px; }
.vf-check-item .vf-ci-text { font-size: 12px; color: var(--vf-suave); margin-top: 2px; line-height: 1.4; overflow-wrap: anywhere; }

.vf-drop { border: 2px dashed #c7d3e0; border-radius: 6px; padding: 18px; text-align: center; color: var(--vf-suave); cursor: pointer; font-size: 13px; background: #fff; }
.vf-drop:hover, .vf-drop.encima { border-color: var(--vf-turquesa); color: var(--vf-turquesa); background: #f3fafc; }
.vf-drop .fa { font-size: 24px; display: block; margin-bottom: 6px; }
.vf-drop.con-fichero { border-style: solid; border-color: var(--vf-turquesa); color: var(--vf-texto); }

/* Barra de guardar */
.vf-savebar { position: sticky; bottom: 0; z-index: 5; background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; box-shadow: 0 -4px 12px rgba(0,0,0,.05); }
.vf-savebar .vf-save-info { font-size: 13px; color: var(--vf-suave); }
.vf-savebar.cambios .vf-save-info { color: var(--vf-aviso); font-weight: 600; }

@media (max-width: 767px) {
    .vf-grid { grid-template-columns: 1fr; }
    .vf-savebar { flex-direction: column; align-items: stretch; }
    .vf-savebar .vf-btn { justify-content: center; }
}
/* La barra de guardar solo se queda fija cuando hay cambios */
.vf-savebar { position: static; }
.vf-savebar.cambios { position: sticky; }
.vf-drop .fa { display: block !important; width: 100%; text-align: center; margin: 0 0 6px !important; }
@media (max-width: 600px) { .vf-checklist { grid-template-columns: 1fr 1fr; gap: 8px; } .vf-check-item { padding: 10px; } }

/* =============================================================================
   Ayuda "¿Qué elijo?" de los combos (verifactu_ayuda.js)
   ============================================================================= */
.vf-ayuda-btn { border: none; background: none; color: var(--vf-turquesa); font-size: 11.5px; font-weight: 600; padding: 0 0 0 8px; cursor: pointer; }
.vf-ayuda-btn:hover { text-decoration: underline; }
.vf-ayuda-btn .fa { margin-right: 2px !important; }
.vf-sel-desc { font-size: 12px; color: var(--vf-suave); margin-top: 5px; line-height: 1.45; min-height: 17px; }
.vf-sel-desc .fa { color: var(--vf-turquesa); margin-right: 3px !important; }
.vf-badge.vf-mini { font-size: 10px; padding: 1px 6px; margin-left: 4px; vertical-align: 1px; }
.vf-ayuda-fondo { position: fixed; inset: 0; background: rgba(15,30,50,.35); z-index: 1040; opacity: 0; pointer-events: none; transition: opacity .2s; }
.vf-ayuda-fondo.abierto { opacity: 1; pointer-events: auto; }
.vf-ayuda-panel {
    position: fixed; top: 0; right: 0; bottom: 0; width: 440px; max-width: 100%; background: #fff; z-index: 1050;
    box-shadow: -8px 0 24px rgba(0,0,0,.15); transform: translateX(105%); transition: transform .25s ease;
    display: flex; flex-direction: column; color: var(--vf-texto); font-family: inherit;
}
.vf-ayuda-panel.abierto { transform: none; }
.vf-ayuda-head { display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 20px 10px; border-bottom: 1px solid var(--vf-borde); }
.vf-ayuda-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--vf-turquesa); font-weight: 600; }
.vf-ayuda-head h3 { margin: 2px 0 0; font-size: 18px; color: var(--vf-azul); font-weight: 600; }
.vf-ayuda-cerrar { border: none; background: none; font-size: 26px; line-height: 1; color: var(--vf-suave); cursor: pointer; padding: 0 4px; }
.vf-ayuda-intro { padding: 12px 20px; font-size: 13px; background: var(--vf-fondo); border-bottom: 1px solid var(--vf-borde); line-height: 1.5; }
.vf-ayuda-lista { flex: 1; overflow-y: auto; padding: 12px 16px 20px; -webkit-overflow-scrolling: touch; }
.vf-ayuda-op { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; margin-bottom: 10px; }
.vf-ayuda-op.actual { border-color: var(--vf-azul); box-shadow: 0 0 0 1px var(--vf-azul) inset; background: #f7faff; }
.vf-ayuda-op-head { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; font-size: 13.5px; }
.vf-ayuda-cod { font-family: Consolas, monospace; font-size: 12px; background: #e6edf7; color: var(--vf-azul); padding: 1px 6px; border-radius: 3px; font-weight: 700; }
.vf-ayuda-que { font-size: 13px; margin-top: 6px; line-height: 1.45; }
.vf-ayuda-cuando { font-size: 12.5px; color: var(--vf-suave); margin-top: 5px; line-height: 1.45; }
.vf-ayuda-cuando b { color: var(--vf-texto); font-weight: 600; }
.vf-ayuda-op .vf-btn { margin-top: 8px; }
.vf-ayuda-pie { padding: 10px 20px; font-size: 11.5px; color: var(--vf-suave); border-top: 1px solid var(--vf-borde); }
@media (max-width: 600px) {
    .vf-ayuda-panel { top: auto; left: 0; width: 100%; height: 85vh; border-radius: 14px 14px 0 0; transform: translateY(105%); }
    .vf-ayuda-panel.abierto { transform: none; }
}
.vf-ayuda-tabs { display: flex; gap: 6px; flex-wrap: wrap; padding: 10px 20px 0; }
.vf-ayuda-op.desactivada { opacity: .6; background: var(--vf-fondo); }
/* Enlace "¿Qué elijo?" en las líneas de Nueva factura */
.vf-ayuda-linea { display: inline-block; margin-top: 5px; font-size: 12px; font-weight: 600; color: var(--vf-turquesa) !important; cursor: pointer; text-decoration: none !important; white-space: nowrap; }
.vf-ayuda-linea:hover { text-decoration: underline !important; }

/* =============================================================================
   Nueva factura manual (formato nuevo) — .vf-nf
   ============================================================================= */
.vf-head h2 .vf-nf-numero { color: var(--vf-turquesa); font-weight: 500; margin-left: 4px; }
.vf-head h2 .vf-badge { font-size: 11px; vertical-align: 4px; margin-left: 6px; }
.vf-nf .vf-grid-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px 14px; }
.vf-nf .vf-c2 { grid-column: span 2; } .vf-nf .vf-c3 { grid-column: span 3; } .vf-nf .vf-c4 { grid-column: span 4; } .vf-nf .vf-c6 { grid-column: span 6; }
.vf-nf .vf-field { position: relative; }  /* para el calendario (datetimepicker) */
.vf-nf .vf-field.form-group { margin-bottom: 0; }
.vf-nf input.factura-input-encabezado, .vf-nf select.factura-input-encabezado, .vf-nf textarea.form-control {
    width: 100%; height: 38px; border: 1px solid #cfd8e3 !important; border-radius: 4px !important; padding: 6px 10px; font-size: 13.5px;
    background: #fff; color: var(--vf-texto); box-shadow: none; text-align: left; margin: 0;
}
.vf-nf textarea.form-control { height: auto; min-height: 76px; }
.vf-nf input.factura-input-encabezado:focus, .vf-nf select.factura-input-encabezado:focus, .vf-nf textarea.form-control:focus {
    outline: none; border-color: var(--vf-turquesa) !important; box-shadow: 0 0 0 3px rgba(27,121,155,.15);
}
.vf-nf input[disabled], .vf-nf select[disabled], .vf-nf textarea[disabled] { background: var(--vf-fondo) !important; color: var(--vf-suave); }
.vf-nf label.error { color: var(--vf-error); font-size: 11.5px; font-weight: 400; margin-top: 3px; display: block; text-transform: none; }
.vf-nf input.error, .vf-nf select.error { border-color: var(--vf-error) !important; }
.vf-nf .factura-caja-encabazado { margin: 0 0 16px; padding: 0; border: 1px solid var(--vf-borde); width: auto; float: none; }
.vf-nf .vf-card.factura-caja-encabazado .alert { display: none; }
.vf-nf-partes { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.vf-nf-partes > .vf-card { margin-bottom: 0; }
.vf-nf-partes { margin-bottom: 16px; }
.vf-nf-emisor .vf-nf-emisor-campos { display: none; }
.vf-nf-emisor.abierto .vf-nf-emisor-campos { display: block; }
.vf-nf-emisor #div_logo { margin-bottom: 12px; }
.vf-nf-serie { display: flex; align-items: center; gap: 6px; }
.vf-nf-serie input:first-child { flex: 0 0 38%; }
.vf-nf-serie span { color: var(--vf-suave); }
.vf-nf #identificador_factura input { width: auto; }
.vf-nf-fijo { display: flex; align-items: center; height: 38px; padding: 0 10px; border: 1px dashed #cfd8e3; border-radius: 4px; background: var(--vf-fondo); font-size: 13px; }
.vf-nf-lista { margin: 6px 0 0 16px; padding: 0; }
.vf-nf-lista li { margin-bottom: 3px; }

/* Conceptos */
.vf-nf .vf-nf-lineas.factura-caja-encabazado { border: none; margin: 0; padding: 12px 14px 16px; }
.vf-nf-toolbar { margin-bottom: 8px; }
.vf-nf-check { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; text-transform: none; cursor: pointer; }
.vf-nf-check input { display: inline-block !important; opacity: 1 !important; position: static !important; width: 16px; height: 16px; margin: 0; visibility: visible !important; }
.vf-nf .vf-nf-lineas table.table { margin: 0; }
.vf-nf .vf-nf-lineas table.table > thead > tr > th { background: var(--vf-fondo); font-size: 11px; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .4px; border-bottom: 1px solid var(--vf-borde); padding: 9px 8px; }
.vf-nf .vf-nf-lineas table.table > tbody > tr > td { border-top: 1px solid var(--vf-borde); padding: 10px 8px; vertical-align: top; }
.vf-nf .vf-nf-lineas table input, .vf-nf .vf-nf-lineas table select { min-height: 34px; }
.vf-nf-totales { margin: 14px 0 0 auto; max-width: 340px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 8px 14px; background: var(--vf-fondo); }
.vf-nf-tot { display: flex; justify-content: space-between; align-items: center; padding: 4px 0; font-size: 13px; color: var(--vf-suave); }
.vf-nf-tot input.factura-input-encabezado { border: none !important; background: transparent !important; text-align: right; width: 150px; height: 26px; padding: 0; font-variant-numeric: tabular-nums; color: var(--vf-texto) !important; font-size: 14px; }
.vf-nf-tot.vf-nf-total { border-top: 1px solid var(--vf-borde); margin-top: 4px; padding-top: 8px; color: var(--vf-azul); font-weight: 700; font-size: 15px; }
.vf-nf-tot.vf-nf-total input.factura-input-encabezado { font-weight: 700; font-size: 18px; color: var(--vf-azul) !important; }
.vf-nf-botones { display: flex; flex-direction: column; gap: 6px; justify-content: flex-end; }
.vf-nf-botones .vf-btn { justify-content: center; }
.vf-nf-barra .vf-nf-barra-total { font-size: 14px; color: var(--vf-texto); font-weight: 400; }
.vf-nf-barra .vf-nf-barra-total b { font-size: 18px; color: var(--vf-azul); margin-left: 6px; font-variant-numeric: tabular-nums; }

@media (max-width: 1199px) { .vf-nf-partes { grid-template-columns: 1fr; } }
@media (max-width: 767px) {
    .vf-nf .vf-grid-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vf-nf .vf-c3, .vf-nf .vf-c4, .vf-nf .vf-c6 { grid-column: 1 / -1; }
    .vf-nf .vf-c2 { grid-column: span 1; }
    .vf-nf #identificador_factura, .vf-nf .vf-nf-botones { grid-column: 1 / -1; }
    .vf-nf-totales { max-width: none; }
    .vf-nf-barra { flex-direction: row !important; align-items: center !important; }
}
@media (max-width: 420px) { .vf-nf .vf-c2 { grid-column: 1 / -1; } }

/* Anular estilos antiguos de custom-facturas.css dentro del formato nuevo */
.vf-nf #card_content_nueva_factura { max-width: none; padding: 0; margin: 0; background: none; border: none; box-shadow: none; text-align: left; }
.vf-nf #datos_comunes_factura { padding: 0; }
.vf-nf .oculto { display: none; }
.vf-nf #identificador_factura input.factura-input-encabezado { width: auto !important; flex: 1 1 0; min-width: 0; }
.vf-nf #identificador_factura input#serie_factura { flex: 0 0 42%; }
.vf-nf .vf-nf-lineas table.table > thead > tr > th, .vf-nf .vf-nf-lineas table.table thead th { background: var(--vf-fondo) !important; color: var(--vf-suave) !important; border-radius: 0 !important; }
.vf-nf .vf-nf-lineas table.table thead tr { background: var(--vf-fondo) !important; }
.vf-nf .vf-nf-check { padding-left: 0 !important; margin: 0; }
.vf-nf .vf-nf-check input[type=checkbox] { margin: 0 2px 0 0 !important; flex: none; }
.vf-nf .vf-nf-check span { display: inline-block; }

/* Cabeceras ordenables (pinchar para ordenar) */
.vf-row-head .vf-orden { cursor: pointer; user-select: none; white-space: nowrap; }
.vf-row-head .vf-orden:hover { color: var(--vf-azul); }
.vf-row-head .vf-orden .fa { opacity: .35; margin-left: 3px; }
.vf-row-head .vf-orden.activo { color: var(--vf-azul); }
.vf-row-head .vf-orden.activo .fa { opacity: 1; }

/* Botón PDF discreto: como el resto de enlaces de acciones, solo el icono en rojo Adobe */
.vf-btn-pdf, .vf-page .vf-btn.vf-btn-pdf { background: none; border: none; color: var(--vf-turquesa) !important; font-weight: 400; padding: 2px 0; }
.vf-btn-pdf:hover, .vf-page .vf-btn.vf-btn-pdf:hover { background: none; color: var(--vf-azul) !important; text-decoration: underline; }
.vf-btn-pdf .fa, .vf-page .vf-btn.vf-btn-pdf .fa { color: #D9302A; }
.vf-btn-pdf[disabled] { opacity: .6; cursor: wait; }
/* En la cabecera de Nueva factura: botón normal (borde gris) con el icono en rojo */
.vf-head-actions .vf-btn.vf-btn-pdf { border: 1px solid var(--vf-borde); background: #fff; color: var(--vf-texto) !important; padding: 7px 12px; }
.vf-head-actions .vf-btn.vf-btn-pdf:hover { border-color: var(--vf-turquesa); color: var(--vf-turquesa) !important; text-decoration: none; }
.vf-acciones .vf-btn-pdf { font-size: 13px; }


/* =============================================================================
   13/10/2026 — Añadidos para el resto de pantallas (clases nuevas: no cambian
   las pantallas VERI*FACTU)
   ============================================================================= */
.vf-kpi.k-info { border-top-color: var(--vf-turquesa); } .vf-kpi.k-info .vf-kpi-num { color: var(--vf-turquesa); }
.vf-banner.aviso { background: var(--vf-aviso-bg); color: #7a4a00; border-color: #f3dcb0; }
.fm-page .vf-banner a { font-weight: 600; text-decoration: underline; color: inherit; }
.fm-page .vf-banner .vf-btn { flex: none; }

/* <select> nativo con el estilo de las barras de filtros */
.vf-select {
    height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 4px 28px 4px 10px; font-size: 13px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%236b7a8c'/%3E%3C/svg%3E") no-repeat right 10px center;
    -webkit-appearance: none; -moz-appearance: none; appearance: none; color: var(--vf-texto); max-width: 100%; cursor: pointer;
}
.vf-select:focus, .fm-page .vf-search input:focus, .fm-page .vf-fechas input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }

/* Menú desplegable "Más" */
.vf-menu {
    display: none; position: absolute; right: 0; top: 100%; z-index: 30; min-width: 230px; margin-top: 4px;
    background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; box-shadow: 0 8px 24px rgba(15,30,50,.15); padding: 6px 0; text-align: left;
}
.vf-menu.abierto { display: block; }
.vf-menu.arriba { top: auto; bottom: 100%; margin: 0 0 4px; }
.vf-menu > button, .vf-menu > a {
    display: flex; align-items: center; gap: 8px; width: 100%; border: none; background: none; padding: 8px 14px;
    font-size: 13px; color: var(--vf-texto); text-align: left; cursor: pointer; text-decoration: none !important; white-space: nowrap;
}
.vf-menu > button:hover, .vf-menu > a:hover, .vf-menu > button:focus { background: var(--vf-fondo); color: var(--vf-azul); outline: none; }
.vf-menu > button .fa, .vf-menu > a .fa { width: 16px; text-align: center; color: var(--vf-suave); margin: 0 !important; }
.vf-menu > .peligro, .vf-menu > .peligro .fa { color: var(--vf-error) !important; }
.vf-menu-sep { height: 1px; background: var(--vf-borde); margin: 6px 0; }
.vf-menu-tit { font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); padding: 4px 14px 2px; font-weight: 600; }
.vf-menu-nota { font-size: 11.5px; color: var(--vf-suave); padding: 4px 14px 6px; line-height: 1.4; white-space: normal; }

/* =============================================================================
   Facturas emitidas (facturas_manuales.php) — .fm-page
   ============================================================================= */
.fm-page .vf-btn .fa, .fm-page .vf-chip .fa, .fm-page .vf-tag .fa { margin: 0 !important; width: auto; }
.fm-toolbar2 { background: #fff !important; }
.fm-toolbar2 #fm_limpiar { margin-left: auto; }
.fm-page .vf-fechas .vf-select { height: 34px; }
.fm-page #vf_contenido.fm-recargando { opacity: .55; pointer-events: none; transition: opacity .15s; }
.fm-periodo { white-space: nowrap; color: var(--vf-suave); }
.fm-rojo { color: var(--vf-error) !important; }
.fm-cod { font-size: 11px; font-weight: 400; color: var(--vf-suave); margin-left: 4px; }
.fm-desc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-style: italic; }
.vf-tag.fm-tag-azul { background: #e6edf7; color: var(--vf-azul); }
a.vf-tag.fm-tag-link { text-decoration: none; color: var(--vf-turquesa); cursor: pointer; }
a.vf-tag.fm-tag-link:hover { background: #e6f3f7; }
.fm-origen a { color: var(--vf-turquesa); font-weight: 600; }
.fm-nota, .fm-nota-add {
    display: block; margin-top: 6px; font-size: 12px; line-height: 1.4; text-decoration: none !important; cursor: pointer;
}
.fm-nota { color: var(--vf-texto); background: #fffbea; border: 1px solid #f3e6b3; border-radius: 4px; padding: 4px 8px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fm-nota .fa { color: #b8a04a; }
.fm-nota:hover { border-color: #e0c85a; }
.fm-nota-add { color: var(--vf-suave); }
.fm-nota-add:hover { color: var(--vf-turquesa); }
.fm-cobros a { color: var(--vf-turquesa); font-weight: 600; text-decoration: none; }
.fm-cobros a.fm-pend { color: var(--vf-aviso); }
.fm-cobros a:hover { text-decoration: underline; }
.fm-acc-estado { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 6px; }
.fm-acc-estado .vf-btn-link { font-size: 12.5px; font-weight: 600; }
.fm-sist { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--vf-borde); }
.fm-badge-pre { font-weight: 700; opacity: .75; }
.vf-row.fm-rt .vf-num, .vf-row.fm-rt .vf-total { color: var(--vf-suave); }
.fm-mas { position: relative; display: inline-block; }
.fm-list .vf-acciones .vf-btn-link { font-size: 13px; }
.fm-list .vf-acciones .vf-count { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--vf-gris-bg); font-size: 10.5px; color: var(--vf-texto); text-align: center; }
.fm-cat { margin-top: 10px; padding: 10px; border: 1px solid var(--vf-borde); border-radius: 6px; background: var(--vf-fondo); display: grid; gap: 8px; }
.fm-cat .vf-field select { height: 34px; font-size: 13px; }
.fm-cat-btns { display: flex; gap: 6px; }
.fm-page .vf-row .vf-cell-acciones, .fm-page .vf-row .vf-cell-estado { overflow-wrap: normal; }

/* Ventana retroceder */
.fm-modal .modal-header { border-bottom: 1px solid var(--vf-borde); }
.fm-modal .modal-title { color: var(--vf-azul); font-weight: 600; }
.fm-modal .modal-footer { border-top: 1px solid var(--vf-borde); display: flex; justify-content: flex-end; gap: 8px; }
.fm-resumen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 16px; padding: 12px 14px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; }
.fm-resumen dt { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.fm-resumen dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
.fm-modal label.error { color: var(--vf-error); font-size: 11.5px; font-weight: 400; margin-top: 3px; display: block; text-transform: none; }
.fm-modal input.error { border-color: var(--vf-error) !important; }
.fm-help { font-size: 12px; color: var(--vf-suave); margin-top: 8px; }
.vf-btn.fm-btn-peligro { background: var(--vf-error); border-color: var(--vf-error); color: #fff !important; font-weight: 600; }
.vf-btn.fm-btn-peligro:hover { background: #a93226; color: #fff !important; }

@media (max-width: 991px) {
    /* En tarjetas el menú ocupa el ancho de la tarjeta, encima de los botones */
    .fm-page .fm-mas { position: static; }
    .fm-page .vf-menu, .fm-page .vf-menu.arriba { left: 12px; right: 12px; top: auto; bottom: 44px; min-width: 0; margin: 0; }
    .fm-page .vf-menu > button, .fm-page .vf-menu > a { white-space: normal; }
    .fm-toolbar2 #fm_limpiar { margin-left: 0; }
}
@media (max-width: 600px) {
    .fm-page .vf-kpis { grid-template-columns: repeat(2, 1fr); }
    .fm-page .vf-fechas .vf-select { flex: 1 1 45%; min-width: 0; }
    .fm-toolbar2 .vf-select { width: 100%; }
    .fm-resumen { grid-template-columns: 1fr; }
    .fm-modal .modal-footer { flex-direction: column-reverse; }
    .fm-modal .modal-footer .vf-btn { justify-content: center; margin: 0 !important; }
}


/* =============================================================================
   13/10/2026 — Ventanas (modales bootstrap) con el formato nuevo: .vf-modal
   (clase nueva; no afecta a las ventanas que no la llevan)
   ============================================================================= */
.vf-modal .modal-content { border: none; border-radius: 8px; box-shadow: 0 12px 40px rgba(15,30,50,.25); color: var(--vf-texto); overflow: visible; }
.vf-modal .modal-header { padding: 18px 22px 14px; border-bottom: 1px solid var(--vf-borde); border-left: 4px solid var(--vf-azul); border-radius: 8px 8px 0 0; background: #fff; }
.vf-modal .modal-header .close { font-size: 26px; opacity: .5; margin-top: -4px; }
.vf-modal .modal-header .close:hover { opacity: .9; }
.vf-modal .modal-title { color: var(--vf-azul); font-size: 18px; font-weight: 600; line-height: 1.3; margin: 0; text-align: left !important; }
.vf-modal .modal-title .fa { margin-right: 4px; color: var(--vf-turquesa); }
.vf-modal .vf-modal-sub { margin: 6px 0 0; font-size: 13px; color: var(--vf-suave); line-height: 1.5; }
.vf-modal .modal-body { padding: 18px 22px; }
.vf-modal .modal-footer {
    display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px;
    padding: 12px 22px; border-top: 1px solid var(--vf-borde); background: var(--vf-fondo); border-radius: 0 0 8px 8px; text-align: left;
}
.vf-modal .modal-footer .vf-btn { margin: 0 !important; }
.vf-modal .modal-footer .btn + .btn { margin-left: 0; }
.vf-modal .fm-footer-extra { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding-top: 8px; border-top: 1px dashed var(--vf-borde); }
.vf-modal .vf-btn .fa { margin: 0 !important; width: auto; }
.vf-modal .vf-btn-primary[disabled] { background: #9aa8ba; border-color: #9aa8ba; cursor: not-allowed; }

/* Campos dentro de las ventanas */
.vf-modal .vf-field { position: relative; }   /* calendario */
.vf-modal .vf-field label { display: block; font-size: 12px; font-weight: 600; color: var(--vf-texto); margin-bottom: 5px; text-transform: none; letter-spacing: 0; }
.vf-modal .vf-field .vf-req { color: var(--vf-error); margin-left: 2px; }
.vf-modal .vf-field .form-control, .vf-modal .vf-field input[type=text], .vf-modal .vf-field input[type=number], .vf-modal .vf-field select:not(.selectpicker) {
    width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; color: var(--vf-texto); box-shadow: none;
}
.vf-modal .vf-field .form-control:focus, .vf-modal .vf-field input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.vf-modal .vf-field .form-control[disabled], .vf-modal .vf-field input[disabled] { background: var(--vf-fondo); color: var(--vf-suave); }
.vf-modal .vf-help { font-size: 12px; color: var(--vf-suave); margin-top: 5px; line-height: 1.45; }
.vf-modal label.error { color: var(--vf-error) !important; font-size: 11.5px; font-weight: 400; margin-top: 3px; display: block; text-transform: none; }
.vf-modal input.error, .vf-modal .form-control.error { border-color: var(--vf-error) !important; }
.vf-modal .fm-dato { display: flex; align-items: center; min-height: 38px; padding: 0 10px; border: 1px dashed #cfd8e3; border-radius: 4px; background: var(--vf-fondo); font-weight: 600; font-variant-numeric: tabular-nums; }
.vf-modal .fm-iban { font-family: Consolas, monospace; letter-spacing: .5px; text-transform: uppercase; }
.vf-modal .fm-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vf-modal .fm-grid-sep { margin-top: 16px; }
.vf-modal .fm-grid-sep:empty, .vf-modal .fm-grid-sep > .oculto { display: none; }
.vf-modal .vf-modal-seccion + .vf-modal-seccion { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--vf-borde); }
.vf-modal .vf-modal-seccion h5 { margin: 0 0 10px; font-size: 13px; font-weight: 700; color: var(--vf-azul); text-transform: uppercase; letter-spacing: .4px; }
.vf-modal .vf-modal-acciones { display: flex; justify-content: flex-end; margin-top: 12px; }
.vf-modal .fm-resumen { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px 16px; margin: 0 0 16px; padding: 12px 14px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; }
.vf-modal .fm-resumen:empty { display: none; }
.vf-modal .fm-resumen dt { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.vf-modal .fm-resumen dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
.vf-modal .vf-banner { margin-bottom: 14px; }

/* Combos bootstrap-select dentro de las ventanas */
.vf-modal .bootstrap-select { width: 100% !important; }
.vf-modal .bootstrap-select > .btn, .vf-modal .bootstrap-select > .dropdown-toggle {
    height: 38px; border: 1px solid #cfd8e3 !important; border-radius: 4px; background: #fff !important; color: var(--vf-texto) !important;
    font-size: 13.5px; padding: 6px 10px; box-shadow: none !important; text-transform: none; font-weight: 400; opacity: 1;
}
.vf-modal .bootstrap-select .filter-option { text-align: left; }
.vf-modal .bootstrap-select.open > .btn, .vf-modal .bootstrap-select > .btn:focus { border-color: var(--vf-turquesa) !important; box-shadow: 0 0 0 3px rgba(27,121,155,.15) !important; outline: none !important; }

/* Selects normales de las ventanas compartidas (p. ej. rectificar) */
.vf-modal .form-group label { font-size: 12px; font-weight: 600; color: var(--vf-texto); text-transform: none; }
.vf-modal .form-group .form-control { height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; font-size: 13.5px; box-shadow: none; }
.vf-modal .modal-body h4 { font-size: 13px; font-weight: 700; color: var(--vf-azul); text-transform: uppercase; letter-spacing: .4px; }
.vf-modal .alert { border-radius: 6px; font-size: 13px; }
.vf-modal .alert-info { background: var(--vf-info-bg); color: #0f5468; border: 1px solid #c7e3ec; }
.vf-modal .alert-danger { background: var(--vf-error-bg); color: #8a271d; border: 1px solid #f5c6c0; }
.vf-modal .modal-footer .btn { border-radius: 4px; font-size: 13px; padding: 7px 14px; margin: 0; }
.vf-modal .modal-footer .btn-primary, .vf-modal .modal-footer .btn-success { background: var(--vf-azul) !important; border-color: var(--vf-azul) !important; color: #fff !important; opacity: 1; }
.vf-modal .modal-footer .btn-default, .vf-modal .modal-footer .btn-info { background: #fff !important; border: 1px solid var(--vf-borde) !important; color: var(--vf-texto) !important; opacity: 1; }

/* Tablas (bootstrap-table) dentro de las ventanas */
.vf-modal .table { margin-bottom: 0; font-size: 13px; }
.vf-modal .table > thead > tr > th, .vf-modal .table thead th { background: var(--vf-fondo) !important; color: var(--vf-suave) !important; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; border-bottom: 1px solid var(--vf-borde) !important; padding: 8px 10px; }
.vf-modal .table > tbody > tr > td { border-top: 1px solid var(--vf-borde); padding: 8px 10px; vertical-align: middle; }
.vf-modal .bootstrap-table .fixed-table-container { border: 1px solid var(--vf-borde); border-radius: 6px; }
.vf-modal .fixed-table-toolbar .columns { display: none; }
.vf-modal .borrar-cobro { color: var(--vf-error) !important; font-size: 15px; }

@media (max-width: 767px) {
    .vf-modal .fm-grid-3 { grid-template-columns: 1fr; }
    .vf-modal .modal-dialog { margin: 10px; }
    .vf-modal .modal-header, .vf-modal .modal-body { padding-left: 16px; padding-right: 16px; }
    .vf-modal .modal-footer { padding: 12px 16px; flex-direction: column-reverse; align-items: stretch; }
    .vf-modal .modal-footer .vf-btn, .vf-modal .modal-footer .btn { justify-content: center; width: 100%; }
    .vf-modal .fm-footer-extra { flex-direction: column; }
}

/* =============================================================================
   Facturas emitidas: botones de cobro / envío con color (13/10/2026)
   ============================================================================= */
.fm-acc-estado { gap: 6px; }
.vf-btn.fm-pill {
    border: 1px solid transparent; border-radius: 16px; padding: 4px 11px; font-size: 12px; font-weight: 600;
    text-decoration: none !important; line-height: 1.3; white-space: nowrap;
}
.vf-btn.fm-pill:hover { text-decoration: none !important; filter: brightness(.96); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.vf-btn.fm-pill.verde    { background: #e7f6ee; border-color: #bfe5d0; color: #1e7a4f !important; }
.vf-btn.fm-pill.azul     { background: #e6edf7; border-color: #c4d3ea; color: #01397F !important; }
.vf-btn.fm-pill.morado   { background: #f1ebfb; border-color: #dccbf3; color: #5b34a6 !important; }
.vf-btn.fm-pill.turquesa { background: #e6f3f7; border-color: #bfe0ea; color: #156580 !important; }
.vf-btn.fm-pill.naranja  { background: #fff4e0; border-color: #f3dcb0; color: #9a5b00 !important; }
.vf-btn.fm-pill[disabled] { opacity: .7; cursor: wait; }

/* Ajustes ventanas (13/10/2026): la clase "oculto" del panel debe ganar a .vf-btn / .vf-field */
.vf-modal .oculto, .fm-page .oculto { display: none !important; }
.vf-modal .vf-modal-seccion h5 { background: none !important; box-shadow: none !important; padding: 0 !important; border: none !important; }

/* Facturas emitidas: bloque VERI*FACTU / TicketBAI con fondo propio para que se
   vea que es algo aparte del cobro (13/10/2026) */
.fm-page .fm-sist {
    margin-top: 10px; padding: 8px 10px 9px; border: 1px solid #f0e2b6; border-left: 3px solid #e0a800;
    border-top: 1px solid #f0e2b6; border-radius: 6px; background: #fffbea;
}
.fm-page .fm-sist .vf-badge { background: #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.05); }
.fm-page .fm-sist .vf-hint { color: #6b5d3a; }
.fm-page .fm-sist .fm-acc-estado { margin-top: 6px; }
.fm-page .fm-sist .vf-btn-link { color: #8a5a00; }
.vf-row.seleccionada .fm-sist { background: #fff6d6; }

/* Ventana "Ver cambios" de Facturas emitidas: línea de tiempo de versiones (13/10/2026) */
.fm-cambios-lista { list-style: none; margin: 0; padding: 0 0 0 18px; position: relative; max-height: 55vh; overflow-y: auto; }
.fm-cambios-lista::before { content: ""; position: absolute; left: 6px; top: 8px; bottom: 8px; width: 2px; background: var(--vf-borde); }
.fm-cambio { position: relative; margin: 0 0 12px; }
.fm-cambio:last-child { margin-bottom: 0; }
.fm-cambio-punto { position: absolute; left: -17px; top: 14px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid #9aa8ba; }
.fm-cambio.actual .fm-cambio-punto { border-color: var(--vf-azul); background: var(--vf-azul); }
.fm-cambio-caja { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 10px 12px; background: #fff; }
.fm-cambio.actual .fm-cambio-caja { border-color: #c4d3ea; box-shadow: 0 1px 4px rgba(1,57,127,.08); }
.fm-cambio-cab { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-bottom: 8px; }
.fm-cambio-meta { margin-left: auto; font-size: 12px; color: var(--vf-suave); }
.fm-cambio-meta .fa { margin: 0 2px 0 0 !important; }
.fm-cambio-datos { display: grid; grid-template-columns: 1fr; gap: 4px; }
.fm-cambio-datos.compacto { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 4px 14px; }
.fm-cambio-dato { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; padding: 3px 6px; border-radius: 4px; }
.fm-cambio-dato span { color: var(--vf-suave); font-size: 12px; }
.fm-cambio-dato b { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fm-cambio-dato.total b { color: var(--vf-azul); }
.fm-cambio-dato.cambia { background: #fff4e0; }
.fm-cambio-dato.cambia b { color: #9a5b00; }
.fm-cambio-dato s { color: var(--vf-suave); font-weight: 400; }
.fm-cambio-dato .fa { font-size: 11px; color: #b26a00; margin: 0 2px !important; }
@media (max-width: 600px) { .fm-cambio-meta { margin-left: 0; width: 100%; } }

/* Ventanas retroceder / rectificativa (13/10/2026) */
.vf-modal .fm-pasos { margin: 0; padding-left: 0; list-style: none; counter-reset: paso; }
.vf-modal .fm-pasos li { position: relative; padding: 4px 0 6px 32px; font-size: 13px; line-height: 1.5; counter-increment: paso; }
.vf-modal .fm-pasos li::before {
    content: counter(paso); position: absolute; left: 0; top: 3px; width: 22px; height: 22px; border-radius: 50%;
    background: #e6edf7; color: var(--vf-azul); font-weight: 700; font-size: 12px; display: flex; align-items: center; justify-content: center;
}
.vf-modal .fm-pasos .vf-badge { font-size: 11px; vertical-align: 1px; }
.vf-modal .vf-btn.fm-pill.fm-pill-texto { cursor: default; padding: 1px 8px; font-size: 11.5px; vertical-align: 1px; }
.vf-modal .fm-banner-modal { margin: 16px 0 0; }
.vf-modal #fm_mrf_abono, .vf-modal #fm_mrf_importe_abono { color: var(--vf-azul); }
.vf-modal .vf-sel-desc { font-size: 12px; color: var(--vf-suave); margin-top: 5px; line-height: 1.45; }
/* La ayuda "¿Qué elijo?" tiene que quedar por encima de la ventana */
.fm-body .vf-ayuda-fondo { z-index: 1060; }
.fm-body .vf-ayuda-panel { z-index: 1070; }

/* Estados "Retrocedida" (rosa frambuesa) y "Factura de abono" (índigo) (13/10/2026) */
.vf-badge.retro { background: #fce8f1; color: #a61e5a; }
.vf-badge.abono { background: #e8eafc; color: #3949ab; }
.vf-tag.fm-tag-abono { background: #e8eafc; color: #3949ab; }
.vf-kpi.k-retro { border-top-color: #c2185b; } .vf-kpi.k-retro .vf-kpi-num { color: #a61e5a; }
.vf-row.fm-rt .vf-num, .vf-row.fm-rt .vf-total { color: var(--vf-texto); }
/* Ventana retroceder: separación entre "Datos del abono" y "Qué va a pasar" */
.vf-modal form + .vf-modal-seccion { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--vf-borde); }
/* =============================================================================
   14/10/2026 — Configuración de facturas (.cf-page)
   ============================================================================= */
.cf-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.cf-page .cf-mt { margin-top: 16px; }
.cf-page .vf-field input[type=number], .cf-page .vf-field textarea {
    width: 100%; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; color: var(--vf-texto);
}
.cf-page .vf-field input[type=number] { height: 38px; }
.cf-page .vf-field textarea { min-height: 96px; resize: vertical; line-height: 1.5; }
.cf-page .vf-field textarea:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.cf-page label.error { color: var(--vf-error) !important; font-size: 11.5px; font-weight: 400; margin-top: 3px; display: block; text-transform: none; }
.cf-page input.error, .cf-page textarea.error { border-color: var(--vf-error) !important; }
.cf-contador { color: #98a4b3; white-space: nowrap; }

/* Logo */
.cf-logo #div_logo { position: relative; display: flex; align-items: center; justify-content: center; min-height: 84px; margin: 0;
    border: 2px dashed #c7d3e0; border-radius: 6px; background: #fff; cursor: pointer; padding: 10px 14px; }
.cf-logo #div_logo:hover { border-color: var(--vf-turquesa); background: #f3fafc; }
.cf-logo #imagen_logo { height: auto !important; max-height: 64px; max-width: 100%; object-fit: contain; }
.cf-logo #add_logo { background: none !important; border: none !important; color: var(--vf-suave) !important; display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 13px; text-transform: none; padding: 0; opacity: 1; box-shadow: none; }
.cf-logo #add_logo .fa { font-size: 24px; }
.cf-logo #div_logo:hover #add_logo { color: var(--vf-turquesa) !important; }
.cf-logo #borrar_logo { position: absolute; top: 6px; right: 8px; float: none !important; font-size: 16px; color: var(--vf-error); opacity: .7; }
.cf-logo #borrar_logo:hover { opacity: 1; }

/* Color */
.cf-color { display: flex; align-items: center; gap: 8px; }
.cf-color-muestra { width: 38px; height: 38px; border-radius: 6px; border: 1px solid rgba(0,0,0,.12); flex: none; background: #0FAAE5; }
.cf-color input.form-control { height: 38px; border: 1px solid #cfd8e3 !important; border-radius: 4px; font-family: Consolas, monospace; text-transform: uppercase; box-shadow: none; }
.cf-paleta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.cf-paleta-c { width: 24px; height: 24px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #cfd8e3; padding: 0; cursor: pointer; }
.cf-paleta-c:hover { transform: scale(1.12); }
.cf-paleta-c.activo { box-shadow: 0 0 0 2px var(--vf-azul); }

/* Series */
.cf-serie { padding: 14px 0; border-top: 1px solid var(--vf-borde); }
.cf-banner + .cf-serie, .cf-serie:first-child { border-top: none; padding-top: 0; }
.cf-serie-tit { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.cf-serie-desc { font-size: 12px; color: var(--vf-suave); }
.cf-proxima { margin-top: 8px; font-size: 12.5px; color: var(--vf-turquesa); }
.cf-proxima b { font-family: Consolas, monospace; font-size: 13px; color: var(--vf-azul); background: #eef3f9; border-radius: 4px; padding: 1px 6px; }
.cf-proxima .cf-sin { color: #98a4b3; font-style: italic; }
.cf-banner { margin-bottom: 14px; }
.cf-avanzado { margin-top: 6px; border-top: 1px solid var(--vf-borde); padding-top: 12px; }
.cf-avanzado > summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--vf-turquesa); list-style: none; outline: none; }
.cf-avanzado > summary::-webkit-details-marker { display: none; }
.cf-avanzado > summary::after { content: " \25BE"; }
.cf-avanzado[open] > summary { margin-bottom: 12px; }
.cf-avanzado[open] > summary::after { content: " \25B4"; }
.cf-avanzado > .vf-field { max-width: 420px; }

/* Select + botón Gestionar */
.cf-select-btn { display: flex; gap: 8px; align-items: stretch; }
.cf-select-btn .bootstrap-select { flex: 1; min-width: 0; width: auto !important; }
.cf-select-btn > .vf-btn { flex: none; height: 38px; }
.cf-page .bootstrap-select > .btn, .cf-page .bootstrap-select > .dropdown-toggle {
    height: 38px; border: 1px solid #cfd8e3 !important; border-radius: 4px; background: #fff !important; color: var(--vf-texto) !important;
    font-size: 13.5px; padding: 6px 10px; box-shadow: none !important; text-transform: none; font-weight: 400; opacity: 1;
}
.cf-page .bootstrap-select .filter-option { text-align: left; }
/* El select real que esconde bootstrap-select no debe tapar el botón Gestionar */
.cf-page .bootstrap-select > select { position: absolute !important; bottom: 0; left: 50%; width: .5px !important; height: 100% !important; padding: 0; opacity: 0 !important; border: none; z-index: -1; }
.cf-page .bootstrap-select.open > .btn { border-color: var(--vf-turquesa) !important; box-shadow: 0 0 0 3px rgba(27,121,155,.15) !important; }

/* Interruptores */
.cf-opcion { position: relative; padding: 12px 0 12px 54px; border-top: 1px solid var(--vf-borde); }
.cf-opcion:first-child { border-top: none; padding-top: 2px; }
.cf-opcion:first-child .cf-switch + label::before, .cf-opcion:first-child .cf-switch + label::after { top: 2px; }
.cf-opcion:first-child .cf-switch + label::after { top: 5px; }
.cf-opcion .vf-help { margin-top: 2px; font-size: 12px; color: var(--vf-suave); }
.cf-page input.cf-switch { position: absolute; opacity: 0; width: 1px; height: 1px; }
/* custom.css pone a todos los checkbox una imagen (off.png / check.png) en la etiqueta: aquí no */
.cf-page .cf-switch + label, .cf-page .cf-switch:checked + label { background: none !important; padding: 0 !important; }
.cf-page input.cf-switch { margin: 0 !important; float: none !important; }
.cf-switch + label { display: block; font-size: 13.5px; font-weight: 600; color: var(--vf-texto); cursor: pointer; margin: 0; text-transform: none; }
.cf-switch + label::before { content: ""; position: absolute; left: 0; top: 12px; width: 40px; height: 22px; border-radius: 11px; background: #cfd8e3; transition: background .15s; }
.cf-switch + label::after { content: ""; position: absolute; left: 3px; top: 15px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: left .15s; }
.cf-switch:checked + label::before { background: var(--vf-ok); }
.cf-switch:checked + label::after { left: 21px; }
.cf-switch:focus-visible + label::before { box-shadow: 0 0 0 3px rgba(27,121,155,.25); }
.cf-switch:disabled + label { color: #98a4b3; cursor: not-allowed; }
.cf-switch:disabled + label::before { opacity: .5; }
.cf-sub { margin: 0 0 12px 54px; max-width: 260px; }

/* Vista previa */
.cf-preview-sticky { position: sticky; top: 16px; }
.cf-preview-tit { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); margin-bottom: 8px; }
.cf-hoja { background: #fff; border: 1px solid var(--vf-borde); border-radius: 4px; box-shadow: 0 6px 20px rgba(15,30,50,.10); padding: 20px 18px; font-size: 10px; color: #333; aspect-ratio: 1 / 1.3; display: flex; flex-direction: column; gap: 12px; }
.cf-h-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.cf-h-logo { max-width: 55%; height: 40px; display: flex; align-items: center; }
.cf-h-logo img { max-height: 40px; max-width: 100%; object-fit: contain; }
.cf-h-logo.vacio span { display: inline-flex; align-items: center; justify-content: center; height: 34px; padding: 0 12px; border: 1px dashed #cfd8e3; border-radius: 4px; color: #98a4b3; }
.cf-h-tit { text-align: right; }
.cf-h-factura { font-size: 17px; font-weight: 700; letter-spacing: .5px; }
.cf-h-num { color: #666; margin-top: 2px; }
.cf-h-num b { color: #333; }
.cf-h-partes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cf-h-parte { background: #F5F7FA; border-left: 3px solid #0FAAE5; border-radius: 2px; padding: 7px 8px; display: flex; flex-direction: column; gap: 4px; }
.cf-h-parte b { font-size: 9.5px; text-transform: uppercase; }
.cf-h-parte i, .cf-h-tr i { display: block; height: 5px; border-radius: 3px; background: #dde3ea; width: 85%; }
.cf-h-parte i.corta, .cf-h-tr i.corta { width: 55%; }
.cf-h-th, .cf-h-tr { display: grid; grid-template-columns: 1fr 34px 62px; gap: 6px; align-items: center; padding: 5px 7px; }
.cf-h-th { font-weight: 700; border-radius: 2px; }
.cf-h-th span:not(:first-child), .cf-h-tr span { text-align: right; }
.cf-h-tr { border-bottom: 1px solid #eef1f5; }
.cf-h-tr:nth-child(odd) { background: #fafbfc; }
.cf-h-total { align-self: flex-end; min-width: 60%; display: flex; justify-content: space-between; gap: 10px; padding: 7px 9px; border-radius: 2px; font-weight: 700; }
.cf-h-total em, .cf-h-tr em { font-style: normal; }
.cf-h-notas { border: 1px solid #eef1f5; border-radius: 3px; padding: 6px 8px; color: #555; line-height: 1.45; max-height: 70px; overflow: hidden; white-space: pre-line; overflow-wrap: anywhere; }
.cf-h-notas b { color: #333; margin-right: 3px; }
.cf-h-pie { margin-top: auto; font-size: 8px; color: #888; text-align: center; border-top: 1px solid #eef1f5; padding-top: 5px; overflow-wrap: anywhere; }
.cf-preview-nota { text-align: center; margin-top: 8px; font-size: 12px; color: var(--vf-suave); line-height: 1.45; }

/* Ventanas de impuestos y retenciones */
.cf-pct { position: relative; }
.cf-pct input { padding-right: 30px !important; }
.cf-pct > span { position: absolute; right: 10px; top: 19px; transform: translateY(-50%); color: var(--vf-suave); font-weight: 600; pointer-events: none; }
.vf-modal .cf-modo-editar { display: none; }
.vf-modal .edit .cf-modo-editar { display: inline; }
.vf-modal .edit .cf-modo-nuevo { display: none; }
.vf-modal .cf-modal-form { transition: background .2s; }
.vf-modal .cf-modal-form.edit { background: #fffbea; border-radius: 6px; padding: 12px 14px; margin: -4px -14px 0; border-left: 3px solid #e0a800; }
.vf-modal tr.fila-seleccion-tabla > td { background: #fffbea !important; }
.vf-modal .cf-avanzado > summary { font-size: 12.5px; }
.vf-modal .fa-edit, .vf-modal .fa-pencil { color: var(--vf-turquesa); cursor: pointer; font-size: 15px; }
.vf-modal .fa-trash, .vf-modal .fa-times { cursor: pointer; }

@media (max-width: 1199px) {
    .cf-layout { grid-template-columns: 1fr; }
    .cf-preview-sticky { position: static; max-width: 360px; margin: 0 auto 16px; }
}
@media (max-width: 767px) {
    .cf-select-btn { flex-direction: column; }
    .cf-sub { margin-left: 0; max-width: none; }
    .cf-preview-col { display: none; }
}


/* =============================================================================
   14/10/2026 — Facturas vista rápida / proforma (.fl-page; usa también .fm-page)
   ============================================================================= */
.fl-titulo-tag { display: inline-block; vertical-align: middle; margin-left: 6px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px;
    padding: 2px 8px; border-radius: 10px; background: #e6f3f7; color: #156580; }
.fl-page .vf-head p a { font-weight: 600; }
.fl-page .fm-cobros .fm-pend { color: var(--vf-aviso); }
.fl-page .vf-kpi.k-retro .vf-kpi-label { white-space: nowrap; }
.fl-tag-proforma { background: #eef0f3; color: #5d6b7c; }
.fl-proforma .vf-kpi { cursor: default; }
.fl-page .vf-banner { margin-bottom: 14px; }


/* =============================================================================
   14/10/2026 — Facturas recibidas (.fr-page; usa también .fm-page y .cf-page)
   ============================================================================= */
.fr-page .vf-field { position: relative; }   /* calendario */
.fr-page .vf-field select:not(.vf-select) { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; }
.fr-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.fr-grid-4 .fr-c2 { grid-column: span 2; }
.fr-form { margin-bottom: 20px; }
.fr-form-tit { font-size: 15px; font-weight: 700; color: var(--vf-azul); margin: 0 0 10px; }
.fr-form-tit .fr-modo-editar { display: none; }
.fr-form.edit .fr-form-tit .fr-modo-nuevo { display: none; }
.fr-form.edit .fr-form-tit .fr-modo-editar { display: inline; color: #9a5b00; }
.fr-form.edit .vf-card { border-left: 3px solid #e0a800; }
.fr-subtit { margin: 20px 0 10px; padding-top: 14px; border-top: 1px solid var(--vf-borde); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-azul); }
.fr-page .fr-total { font-weight: 700; }
.fr-page .vf-help { font-size: 12px; color: var(--vf-suave); margin-top: 8px; line-height: 1.45; }
.fr-opcion-detalle { margin-top: 14px; border-top: 1px solid var(--vf-borde) !important; padding-top: 14px !important; }
.fr-opcion-detalle .cf-switch + label::before { top: 14px !important; }
.fr-opcion-detalle .cf-switch + label::after { top: 17px !important; }
.fr-opcion-sin-borde { border-top: none !important; padding-top: 2px !important; }
.fr-lineas { margin: 4px 0 6px; padding: 10px 12px; border: 1px solid var(--vf-borde); border-radius: 6px; background: var(--vf-fondo); overflow-x: auto; }
.fr-lineas .table { background: #fff; margin-bottom: 0; }
.fr-lineas .table > thead > tr > th { font-size: 11px; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .4px; font-weight: 600; }
.fr-lineas .form-control { height: 34px; border: 1px solid #cfd8e3; border-radius: 4px; box-shadow: none; }
.fr-savebar { margin-top: 0; }
.fr-savebar .vf-save-info { color: var(--vf-suave) !important; font-weight: 400 !important; }
#btn_nueva_fac .fa { margin: 0 !important; }

.fr-docs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fr-doc { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600; padding: 2px 8px; border-radius: 10px; text-decoration: none !important; border: 1px solid transparent; }
.fr-doc.ok { background: #e7f6ee; border-color: #bfe5d0; color: #1e7a4f !important; }
.fr-doc.falta { background: #fff; border: 1px dashed #c7d3e0; color: var(--vf-suave) !important; }
.fr-doc.falta:hover { border-color: var(--vf-turquesa); color: var(--vf-turquesa) !important; }
.fr-tag-tadosi { background: #e6f3f7; color: #156580; }
.vf-row.editando { background: #fffbea !important; box-shadow: inset 3px 0 0 #e0a800; }
.fr-cat-editor { margin-top: 10px; padding: 10px; border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; display: grid; gap: 8px; box-shadow: 0 4px 14px rgba(15,30,50,.08); }
.fr-cat-editor .vf-select { width: 100%; height: 34px; }
.fr-cat-btns { display: flex; gap: 6px; justify-content: flex-end; }

@media (max-width: 991px) {
    .fr-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 767px) {
    .fr-grid-4 { grid-template-columns: 1fr !important; }
    .fr-grid-4 .fr-c2 { grid-column: auto; }
}
.fr-page form.fr-form.edit { background: none !important; }


/* =============================================================================
   14/10/2026 — Libro de IVA de ventas y compras (.li-page)
   ============================================================================= */
.li-periodo { padding: 14px 16px; margin-bottom: 16px; }
.li-periodo-fila { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; }
.li-campo { display: flex; flex-direction: column; gap: 5px; }
.li-campo label { font-size: 12px; font-weight: 600; color: var(--vf-texto); margin: 0; text-transform: none; }
.li-campo .vf-select { height: 36px; min-width: 120px; }
.li-campo input[type=date].vf-select { min-width: 150px; }
.li-seg { display: inline-flex; border: 1px solid var(--vf-borde); border-radius: 6px; overflow: hidden; background: #fff; }
.li-seg-btn { border: none; background: #fff; padding: 0 14px; height: 34px; font-size: 13px; font-weight: 600; color: var(--vf-texto); cursor: pointer; border-right: 1px solid var(--vf-borde); }
.li-seg-btn:last-child { border-right: none; }
.li-seg-btn:hover { background: var(--vf-fondo); color: var(--vf-azul); }
.li-seg-btn.activo { background: var(--vf-azul); color: #fff; }
.li-periodo-texto { margin-top: 10px; font-size: 13px; color: var(--vf-suave); }
.li-periodo-texto .fa { margin-right: 4px; }
.li-panel-tit { padding: 12px 16px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-azul); border-bottom: 1px solid var(--vf-borde); }
.li-resumen-panel { margin-bottom: 16px; }
.li-res-row { display: grid; grid-template-columns: minmax(130px, 1.2fr) 90px repeat(3, minmax(110px, 1fr)); gap: 10px; padding: 9px 16px; border-bottom: 1px solid var(--vf-borde); align-items: center; font-variant-numeric: tabular-nums; font-size: 13.5px; }
.li-ventas .li-res-row { grid-template-columns: minmax(130px, 1.2fr) 90px repeat(4, minmax(110px, 1fr)); }
.li-res-row > div:not(:first-child) { text-align: right; }
.li-res-row[data-tipo] { cursor: pointer; }
.li-res-row[data-tipo]:hover { background: #fafcff; }
.li-res-row.activo { background: #eef5fb; box-shadow: inset 3px 0 0 var(--vf-turquesa); }
.li-res-head { background: var(--vf-fondo); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.li-res-total { font-weight: 700; color: var(--vf-azul); border-bottom: none; background: var(--vf-fondo); }
.vf-list.sin-check.li-list .vf-row { grid-template-columns: minmax(140px, 1fr) minmax(180px, 1.6fr) 110px 120px 120px 130px 130px; }
.li-list .vf-num { display: inline-block; }
.li-list a.vf-num:hover { text-decoration: underline; }
.li-list .vf-importe { text-align: right; font-variant-numeric: tabular-nums; }
.li-row-total { background: var(--vf-fondo); font-weight: 600; }
.li-page #li_tipo, .li-page #li_estado { height: 38px; }

@media (max-width: 991px) {
    .li-res { overflow-x: auto; }
    .li-res-row, .li-ventas .li-res-row { min-width: 640px; }
    .vf-list.sin-check.li-list .vf-row { grid-template-columns: 1fr 1fr; }
    .li-list .vf-row-head { display: none; }
    .li-list .vf-importe { text-align: left; }
}
@media (max-width: 600px) {
    .li-seg { flex-wrap: wrap; }
    .li-campo, .li-campo .vf-select { width: 100%; }
}


/* =============================================================================
   14/10/2026 — Listas de Facturas: medios de pago, proyectos, idiomas,
   productos y categorías (.cat-page)
   ============================================================================= */
.cat-total { margin-left: auto; font-size: 12.5px; color: var(--vf-suave); white-space: nowrap; }
.cat-list { display: flex; flex-direction: column; }
.cat-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 16px; border-top: 1px solid var(--vf-borde); }
.cat-productos .cat-row { grid-template-columns: 38px minmax(0, 1fr) 170px auto; }
.cat-row:first-child { border-top: none; }
.cat-row:hover { background: #fafcff; }
.cat-icono { width: 34px; height: 34px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 15px; }
.cat-tit { font-weight: 600; color: var(--vf-texto); font-size: 14px; }
.cat-cod { font-family: Consolas, monospace; font-size: 11.5px; font-weight: 600; color: var(--vf-suave); background: var(--vf-gris-bg); border-radius: 3px; padding: 1px 6px; margin-left: 4px; }
.cat-main .vf-sub { margin-top: 2px; }
.cat-main .vf-badge { margin-top: 4px; }
.cat-literales { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.cat-importe { text-align: right; font-variant-numeric: tabular-nums; }
.cat-acc { display: flex; gap: 6px; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.cat-acc .vf-btn .fa { margin: 0 !important; }
.cat-btn-del { color: var(--vf-error) !important; }
.cat-btn-del:hover { border-color: var(--vf-error) !important; }
.cat-page .vf-field select { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; }
.cat-page .vf-field input[type=number] { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; }
.vf-modal .cat-c2 { grid-column: 1 / -1; }
.vf-modal .vf-field input[type=text] { width: 100%; }

/* Productos */
.cat-grid-prod { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cat-prev-precio { border: 1px solid var(--vf-borde); border-radius: 6px; background: var(--vf-fondo); padding: 8px 12px; font-size: 13px; font-variant-numeric: tabular-nums; }
.cat-prev-precio > div { display: flex; justify-content: space-between; padding: 2px 0; }
.cat-prev-precio > div span { color: var(--vf-suave); }
.cat-prev-precio > .total { border-top: 1px solid var(--vf-borde); margin-top: 4px; padding-top: 6px; font-size: 14.5px; }
.cat-prev-precio > .total span { color: var(--vf-texto); font-weight: 600; }
.cat-prev-precio > .total b { color: var(--vf-azul); }
.cat-cambio-precio { margin-top: 10px; }
.cat-cambio-precio .cf-opcion:first-child { border-top: 1px solid var(--vf-borde); padding-top: 12px; }
.cat-cambio-precio .cf-opcion:first-child .cf-switch + label::before { top: 12px; }
.cat-cambio-precio .cf-opcion:first-child .cf-switch + label::after { top: 15px; }

/* Idiomas */
.cat-principal { display: flex; align-items: flex-end; }
.cat-principal .cf-opcion { padding-top: 6px; border-top: none; }
.cat-principal .cf-switch + label::before { top: 6px !important; }
.cat-principal .cf-switch + label::after { top: 9px !important; }
.cat-subtit { margin: 18px 0 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-azul); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cat-subtit .vf-btn { text-transform: none; letter-spacing: 0; }
.cat-idioma { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 20px; border-top: 1px solid var(--vf-borde); margin-top: 16px; }
.cat-grid-lit { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
.cat-grid-lit .vf-field label { font-weight: 500; }
.cat-idioma-prev { position: relative; }
.cat-hoja { position: sticky; top: 0; background: #fff; border: 1px solid var(--vf-borde); border-radius: 4px; box-shadow: 0 6px 20px rgba(15,30,50,.10); padding: 14px; font-size: 9.5px; color: #333; display: flex; flex-direction: column; gap: 7px; }
.cat-hoja [data-prev].vacio { color: #98a4b3; font-style: italic; }
.cat-h-top { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--vf-azul); padding-bottom: 6px; }
.cat-h-top b { font-size: 14px; color: var(--vf-azul); }
.cat-h-fila { display: flex; justify-content: space-between; color: #666; }
.cat-h-bloque { background: #F5F7FA; border-radius: 2px; padding: 6px; display: flex; flex-direction: column; gap: 3px; }
.cat-h-bloque b { font-size: 8.5px; text-transform: uppercase; color: var(--vf-azul); }
.cat-hoja i { display: block; height: 4px; border-radius: 2px; background: #dde3ea; width: 85%; }
.cat-hoja i.corta { width: 55%; }
.cat-h-tabla, .cat-h-linea { display: grid; grid-template-columns: 18px 1fr 34px 34px 38px; gap: 4px; align-items: center; padding: 4px 5px; }
.cat-h-tabla { background: var(--vf-azul); color: #fff; font-weight: 700; font-size: 8px; text-transform: uppercase; border-radius: 2px; }
.cat-h-tabla [data-prev].vacio { color: rgba(255,255,255,.65); }
.cat-h-tabla span:nth-child(n+3), .cat-h-linea span:nth-child(n+3) { text-align: right; }
.cat-h-linea { border-bottom: 1px solid #eef1f5; }

/* Categorías */
.catg-list { display: flex; flex-direction: column; }
.catg-card { border-top: 1px solid var(--vf-borde); }
.catg-card:first-child { border-top: none; }
.catg-head { display: flex; align-items: center; gap: 12px; padding: 12px 16px; cursor: pointer; }
.catg-head:hover { background: #fafcff; }
.catg-flecha { color: var(--vf-suave); transition: transform .15s; width: 12px; }
.catg-card.abierta .catg-flecha { transform: rotate(90deg); }
.catg-main { flex: 1; min-width: 0; }
.catg-main .vf-count { display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 9px; background: var(--vf-gris-bg); font-size: 11px; color: var(--vf-suave); text-align: center; font-weight: 600; margin-left: 4px; }
.catg-subs { padding: 0 16px 12px 40px; }
.catg-sub { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid var(--vf-borde); border-radius: 6px; margin-top: 6px; background: #fff; }
.catg-sub:hover { border-color: #c4d3ea; }
.catg-sub .vf-sub { display: inline; margin-left: 6px; }
.catg-sub .cat-acc .vf-btn { padding: 2px 6px; }
.catg-vacia { padding: 6px 0; }

@media (max-width: 767px) {
    .cat-row, .cat-productos .cat-row { grid-template-columns: 34px minmax(0, 1fr); }
    .cat-row .cat-importe { grid-column: 2; text-align: left; }
    .cat-row .cat-acc { grid-column: 1 / -1; justify-content: flex-start; }
    .cat-idioma { grid-template-columns: 1fr; }
    .cat-idioma-prev { display: none; }
    .cat-grid-lit, .cat-grid-prod { grid-template-columns: 1fr; }
    .catg-head { flex-wrap: wrap; }
    .catg-head .cat-acc { width: 100%; justify-content: flex-start; padding-left: 24px; }
    .catg-subs { padding-left: 16px; }
    .catg-sub { flex-wrap: wrap; }
    .cat-total { display: none; }
}
/* Interruptores dentro de las ventanas (custom.css pone una imagen en la etiqueta de los checkbox) */
.vf-modal input.cf-switch { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0 !important; float: none !important; }
.vf-modal .cf-switch + label, .vf-modal .cf-switch:checked + label { background: none !important; padding: 0 !important; }
.cat-h-tabla, .cat-h-linea { grid-template-columns: 14px 1fr 42px 36px 38px; }


/* =============================================================================
   14/10/2026 — Facturas recibidas: recargo de equivalencia y líneas de detalle
   ============================================================================= */
.fr-grid-importes { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.fr-grid-importes.con-recargo { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.fr-page input[readonly] { background: var(--vf-fondo) !important; color: var(--vf-texto); }
.fr-opcion-recargo { margin-bottom: 10px; }
.fr-opcion-recargo .cf-switch + label::before { top: 2px !important; }
.fr-opcion-recargo .cf-switch + label::after { top: 5px !important; }

.fr-lineas { padding: 0; background: #fff; overflow-x: auto; }
.fr-lineas .bootstrap-table .fixed-table-container { border: none; }
.fr-lineas .fixed-table-toolbar { display: none; }
.fr-tabla-lineas { margin: 0 !important; min-width: 760px; }
.fr-tabla-lineas > thead > tr > th, .fr-lineas .fixed-table-container thead th {
    background: var(--vf-fondo) !important; color: var(--vf-suave) !important; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600;
    border-bottom: 1px solid var(--vf-borde) !important; padding: 0 !important; }
.fr-lineas .fixed-table-container thead th .th-inner { padding: 9px 8px !important; }
.fr-tabla-lineas > tbody > tr > td { padding: 8px !important; border-top: 1px solid var(--vf-borde) !important; vertical-align: top !important; background: #fff !important; }
.fr-tabla-lineas > tbody > tr:hover > td { background: #fafcff !important; }
.fr-lineas .fr-in { height: 34px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 5px 8px; font-size: 13px; box-shadow: none; background: #fff; color: var(--vf-texto); width: 100%; }
.fr-lineas .fr-in:focus { border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); outline: none; }
.fr-lineas .fr-in-sub { margin-top: 5px; height: 30px; font-size: 12px; color: var(--vf-suave); }
.fr-lineas .fr-in-num { text-align: right; }
.fr-lineas th.fr-l-orden, .fr-lineas td:first-child { width: 44px; }
.fr-lineas td:first-child .fa { color: var(--vf-turquesa); margin: 8px 3px 0; }
.fr-lineas th.fr-l-sel { width: 120px; }
.fr-lineas th.fr-l-num { width: 100px; }
.fr-lineas th.fr-l-total { width: 150px; }
.fr-l-imp { display: flex; justify-content: flex-end; align-items: center; gap: 10px; font-weight: 700; color: var(--vf-azul); font-size: 14px; padding-top: 7px; font-variant-numeric: tabular-nums; }
.fr-l-botones .fa { font-size: 14px; margin-left: 8px; }
.fr-l-botones .plus-registro { color: var(--vf-turquesa); }
.fr-l-botones .minus-registro { color: var(--vf-error); }
.fr-l-det { text-align: right; font-size: 11.5px; color: var(--vf-suave); margin-top: 2px; font-variant-numeric: tabular-nums; }
.fr-lineas-pie { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-top: 1px solid var(--vf-borde); background: var(--vf-fondo); }
.fr-lineas-pie .vf-help { margin: 0; }
@media (max-width: 991px) { .fr-grid-importes, .fr-grid-importes.con-recargo { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 767px) { .fr-grid-importes, .fr-grid-importes.con-recargo { grid-template-columns: 1fr !important; } }


/* =============================================================================
   14/10/2026 — Asociar facturas a domiciliaciones y pagos recurrentes (.ar-page)
   ============================================================================= */
.ar-estado { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ar-estado .vf-card { margin-bottom: 16px; }
.ar-cifras { font-size: 14px; color: var(--vf-suave); }
.ar-cifras b { font-size: 22px; color: var(--vf-azul); font-variant-numeric: tabular-nums; }
.ar-barra { height: 8px; border-radius: 4px; background: var(--vf-gris-bg); overflow: hidden; margin: 10px 0 8px; }
.ar-barra span { display: block; height: 100%; width: 0; background: var(--vf-turquesa); border-radius: 4px; transition: width .4s; }
.ar-barra span.completa { background: var(--vf-ok); }
.ar-ok { color: var(--vf-ok); }
.ar-num { font-weight: 700; font-size: 16px; background: var(--vf-azul) !important; color: #fff !important; border-radius: 50% !important; }
.ar-page .vf-select { width: 100%; height: 38px; }
.ar-opcion-primera { border-top: none !important; padding-top: 2px !important; }
.ar-opcion-primera .cf-switch + label::before { top: 2px !important; }
.ar-opcion-primera .cf-switch + label::after { top: 5px !important; }
.ar-page .vf-field .ar-opcion-primera { margin-top: 22px; }
.ar-opciones { margin-top: 14px; border-top: 1px solid var(--vf-borde); }
.ar-acciones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ar-accion { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 16px; display: flex; flex-direction: column; background: #fff; }
.ar-accion p { font-size: 13px; color: var(--vf-suave); line-height: 1.5; margin: 6px 0 12px; }
.ar-accion-tit { font-size: 15px; font-weight: 700; color: var(--vf-azul); }
.ar-accion-tit .fa { margin-right: 4px; color: var(--vf-turquesa); }
.ar-accion .cf-opcion label { font-size: 13px; }
.ar-pend { font-weight: 400; color: var(--vf-suave); font-size: 12px; }
.ar-accion-pie { margin-top: auto; padding-top: 14px; }
.ar-accion-pie .vf-btn { width: 100%; justify-content: center; }
.ar-peligro { border-color: #f5c6c0; background: #fffafa; }
.ar-peligro .ar-accion-tit, .ar-peligro .ar-accion-tit .fa { color: var(--vf-error); }
.ar-btn-peligro { border-color: var(--vf-error) !important; color: var(--vf-error) !important; background: #fff !important; }
.ar-btn-peligro:hover { background: var(--vf-error-bg) !important; }
@media (max-width: 1199px) { .ar-acciones { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .ar-estado { grid-template-columns: 1fr; } .ar-page .vf-field .ar-opcion-primera { margin-top: 0; } }

/* =============================================================================
   14/10/2026 — Posición global de facturas (.pg-page)
   ============================================================================= */
.pg-page .pg-periodo { margin-bottom: 16px; }
.pg-page .pg-seg { flex-wrap: wrap; }
.pg-page .li-campo-btn .vf-btn { height: 36px; }
.pg-page .pg-kpis { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.pg-page .pg-kpis .vf-kpi { cursor: default; }
.pg-page .pg-kpis .vf-kpi:hover { transform: none; }
.pg-page .vf-kpi.k-info { border-top-color: var(--vf-turquesa); } .pg-page .vf-kpi.k-info .vf-kpi-num { color: var(--vf-turquesa); }
.pg-page .pg-kpis .vf-kpi-num { font-size: 23px; white-space: nowrap; }

.pg-dos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.pg-dos > .vf-panel { margin-bottom: 0; min-width: 0; }
.pg-bloque { margin-bottom: 16px; }
.pg-dos .pg-bloque { margin-bottom: 0; }
.pg-bloque-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--vf-borde); flex-wrap: wrap; }
.pg-tit { font-size: 15px; font-weight: 700; color: var(--vf-azul); }
.pg-tit .fa { color: var(--vf-turquesa); margin-right: 5px; }
.pg-sub { font-size: 12.5px; color: var(--vf-suave); margin-top: 3px; line-height: 1.45; max-width: 760px; }
.pg-bloque-acc { display: flex; gap: 8px; align-items: center; }
.pg-bloque-acc .vf-select { height: 34px; }
.pg-search { min-width: 210px; flex: 0 1 240px; }

.pg-verde { color: var(--vf-ok) !important; }
.pg-rojo { color: var(--vf-error) !important; }
.pg-aviso { color: var(--vf-aviso) !important; }
.pg-suave { color: var(--vf-suave) !important; font-weight: normal; }

/* Cobrado / pendiente */
.pg-caja-body { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 20px; align-items: center; padding: 16px; }
.pg-donut { position: relative; height: 170px; }
.pg-des-total { display: flex; justify-content: space-between; align-items: baseline; font-size: 13px; color: var(--vf-suave); margin-bottom: 8px; }
.pg-des-total b { font-size: 20px; color: var(--vf-texto); font-variant-numeric: tabular-nums; }
.pg-barra { height: 10px; background: var(--vf-gris-bg); border-radius: 6px; overflow: hidden; margin-bottom: 10px; }
.pg-barra > span { display: block; height: 100%; border-radius: 6px; transition: width .4s; }
.pg-barra-fina { height: 6px; margin: 6px 0 4px; }
.pg-des-fila { display: grid; grid-template-columns: 14px 1fr auto 60px; gap: 8px; align-items: center; font-size: 13.5px; padding: 4px 0; }
.pg-des-fila b { font-variant-numeric: tabular-nums; }
.pg-des-fila em { font-style: normal; color: var(--vf-suave); font-size: 12px; text-align: right; }
.pg-punto { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; }
.pgc-ok { background: #1e8e5a; }
.pgc-aviso { background: #e0a800; }
.pgc-azul { background: #1B799B; }
.pgc-rojo { background: #c0392b; }
.pgc-azul-osc { background: #01397F; }

/* Evolución */
.pg-grafico { position: relative; height: 330px; padding: 14px 16px 6px; }
.pg-leyenda { display: flex; gap: 18px; flex-wrap: wrap; padding: 10px 16px 14px; font-size: 13px; border-top: 1px solid var(--vf-borde); }
.pg-leyenda b { font-variant-numeric: tabular-nums; }

/* Por cobrar / por pagar */
.pg-resumen-pend { display: flex; gap: 24px; flex-wrap: wrap; padding: 12px 16px 0; }
.pg-resumen-pend:empty { display: none; }
.pg-pend-cifra b { display: block; font-size: 19px; font-variant-numeric: tabular-nums; }
.pg-pend-cifra span { font-size: 12px; color: var(--vf-suave); }
.pg-page .pg-lista { padding: 6px 0; display: block !important; width: 100% !important; }   /* los id tabla_* traen display:table de otras hojas */
.pg-page .pg-lista.pg-oculta { display: none !important; }
.pg-item { display: flex; width: 100%; justify-content: space-between; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--vf-borde); color: var(--vf-texto) !important; text-decoration: none !important; }
.pg-item:hover { background: #fafcff; }
.pg-item:last-of-type { border-bottom: none; }
.pg-item-main { min-width: 0; flex: 1 1 auto; }
.pg-item-imp { flex: 0 0 auto; }
.pg-item-tit { font-weight: 600; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg-item-sub { font-size: 12px; color: var(--vf-suave); margin-top: 2px; }
.pg-item-sub .vf-num { font-size: 12px; }
.pg-item-sub .vf-tag { margin: 0; }
.pg-item-imp { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 14px; }
.pg-ver-todas { display: block; margin: 6px 16px 4px; font-size: 13px; }
.pg-vacio { padding: 30px 20px; }
.pg-vacio .fa { display: block; font-size: 26px; margin-bottom: 8px; }

/* Clientes / proveedores */
.pg-tercero { padding: 10px 16px; border-bottom: 1px solid var(--vf-borde); }
.pg-tercero:last-child { border-bottom: none; }
.pg-ter-cab { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; font-size: 13.5px; }
.pg-ter-nombre { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg-ter-imp { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pg-ter-imp .pg-suave { margin-left: 8px; font-size: 12px; }
.pg-ter-det { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--vf-suave); font-variant-numeric: tabular-nums; }

/* Categorías / proyectos */
.pg-cat, .pg-pro { display: grid; gap: 12px; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--vf-borde); font-size: 13px; }
.pg-cat { grid-template-columns: minmax(180px, 1.4fr) minmax(120px, 1fr) 130px minmax(200px, 1.3fr) 150px; }
.pg-pro { grid-template-columns: minmax(180px, 1.6fr) repeat(3, minmax(120px, 1fr)) 90px; }
.pg-cat-head, .pg-pro-head { background: var(--vf-fondo); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; padding-top: 9px; padding-bottom: 9px; }
.pg-cat[data-cat] { cursor: pointer; }
.pg-cat[data-cat]:hover { background: #fafcff; box-shadow: inset 3px 0 0 var(--vf-turquesa); }
.pg-cat .pg-barra-fina { margin: 0 0 3px; }
.pg-cat .vf-importe, .pg-pro .vf-importe { font-variant-numeric: tabular-nums; }
.pg-cat-total { background: var(--vf-fondo); border-bottom: none; color: var(--vf-azul); }
.pg-cat .vf-label, .pg-pro .vf-label { display: none; }

/* Ventana de facturas de una categoría */
.pg-modal-body { padding: 0 !important; max-height: 60vh; overflow-y: auto; }
.pg-mtotal { padding: 12px 22px; background: var(--vf-fondo); border-top: 1px solid var(--vf-borde); font-size: 13px; text-align: right; }

@media (max-width: 1199px) {
    .pg-dos { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    .pg-caja-body { grid-template-columns: 1fr; }
    .pg-donut { height: 150px; }
    .pg-cat-head, .pg-pro-head { display: none; }
    .pg-cat, .pg-pro { grid-template-columns: 1fr 1fr; gap: 6px 12px; }
    .pg-cat > div:first-child, .pg-pro > div:first-child { grid-column: 1 / -1; }
    .pg-cat .vf-label, .pg-pro .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; color: var(--vf-suave); letter-spacing: .3px; }
    .pg-cat .vf-importe, .pg-pro .vf-importe { text-align: left; }
    .pg-grafico { height: 260px; padding: 10px 6px 4px; }
    .pg-search { min-width: 0; flex: 1 1 100%; }
    .pg-item-tit { white-space: normal; }
    .pg-ter-cab { flex-wrap: wrap; }
    .pg-bloque-acc { width: 100%; }
    .pg-page .pg-kpis .vf-kpi-num { font-size: 19px; }
}

/* 14/10/2026 (2) — Posición global: filtros, orden, Excel y pestañas nuevas */
.pg-bloque-acc { flex-wrap: wrap; justify-content: flex-end; }
.pg-bloque-acc .vf-select { height: 32px; font-size: 12.5px; }
.pg-xls .fa-file-excel-o { color: #1e7145; }
.pg-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--vf-borde); background: var(--vf-fondo); }
.pg-toolbar .pg-search { flex: 1 1 200px; min-width: 170px; }
.pg-toolbar .vf-select { height: 34px; font-size: 12.5px; max-width: 100%; }
.pg-fechas { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--vf-suave); }
.pg-fechas label { margin: 0; font-weight: normal; display: flex; align-items: center; gap: 6px; text-transform: none; }
.pg-fechas input { height: 32px; }
.pg-page .pg-fechas.pg-oculta { display: none !important; }
button.pg-pend-cifra { background: none; border: 1px solid transparent; border-radius: 6px; padding: 4px 8px; margin-left: -8px; text-align: left; cursor: pointer; color: var(--vf-texto); }
button.pg-pend-cifra:hover { border-color: var(--vf-borde); background: #fafcff; }
.pg-pend-cifra.pg-suave-cifra b { color: var(--vf-suave); font-size: 16px; }
.pg-resumen-pend { gap: 14px; padding-bottom: 10px; }
.pg-item { position: relative; padding-right: 34px; }
.pg-item-ext { position: absolute; right: 14px; top: 50%; margin-top: -6px; font-size: 11px; color: #b5c0cd; }
.pg-item:hover .pg-item-ext { color: var(--vf-turquesa); }
.pg-lista-total { display: flex; justify-content: space-between; padding: 10px 34px 6px 16px; font-size: 13px; color: var(--vf-suave); border-top: 1px solid var(--vf-borde); }
.pg-lista-total b { color: var(--vf-texto); font-variant-numeric: tabular-nums; }
a.pg-ter-link { color: var(--vf-texto) !important; text-decoration: none !important; }
a.pg-ter-link:hover b { color: var(--vf-turquesa); text-decoration: underline; }
.pg-cat[data-cat]:focus { outline: 2px solid var(--vf-turquesa); outline-offset: -2px; }
@media (max-width: 767px) {
    .pg-toolbar .vf-select { flex: 1 1 100%; }
    .pg-bloque-acc { justify-content: flex-start; }
}

/* =============================================================================
   14/10/2026 — Facturas recibidas: importar factura (PDF, foto, XML) (.fri-)
   ============================================================================= */
.fri-zona { display: flex; align-items: center; gap: 14px; margin: 0 0 14px; padding: 14px 18px; border: 2px dashed #b9cde0; border-radius: 8px; background: #f7fbfe; cursor: pointer; transition: background .15s, border-color .15s; }
.fri-zona:hover, .fri-zona:focus, .fri-zona.encima { border-color: var(--vf-turquesa); background: #eaf5f9; outline: none; }
.fri-zona > .fa { font-size: 28px; color: var(--vf-turquesa); }
.fri-zona > div { flex: 1; min-width: 0; }
.fri-zona b { color: var(--vf-azul); font-size: 14px; }
.fri-zona-sub { font-size: 12.5px; color: var(--vf-suave); margin-top: 2px; }
.fr-modo-editar ~ .fri-zona, .edit .fri-zona { opacity: .85; }
.fri-estado { margin-bottom: 14px; align-items: flex-start; }
.fri-estado ul { margin: 6px 0 0; padding: 0; list-style: none; font-size: 12.5px; }
.fri-estado li { margin: 2px 0; }
.fri-ok li .fa { color: var(--vf-ok); }
.fri-avisos li .fa { color: var(--vf-aviso); }
.fri-acciones { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.fri-acciones .vf-help { margin: 0; }
#facturaGastoForm .fri-leido { background-color: #eaf4fb !important; border-color: #9cc5df !important; }
#facturaGastoForm .fri-revisar { background-color: #fff6db !important; border-color: #e7c35a !important; }
.fri-muestra { display: inline-block; padding: 0 6px; border-radius: 3px; border: 1px solid; font-size: 12px; }
.fri-muestra.fri-leido { background: #eaf4fb; border-color: #9cc5df; }
.fri-muestra.fri-revisar { background: #fff6db; border-color: #e7c35a; }
@media (max-width: 600px) {
    .fri-zona { flex-wrap: wrap; padding: 12px; }
    .fri-zona > .vf-btn { width: 100%; justify-content: center; }
}

/* 14/10/2026 — importar factura: detalle técnico */
.fri-diag { margin-top: 6px; font-size: 11.5px; color: var(--vf-suave); font-family: Consolas, monospace; word-break: break-word; }

/* =============================================================================
   CONTRATOS (14/10/2026) — contratos.php, contratos_clientes.php,
   contratos_masivos.php, checkbox_comercio.php  ·  prefijo .ct-
   ============================================================================= */
.ct-page .ct-aviso { color: var(--vf-aviso); }
.ct-page .ct-error { color: var(--vf-error); }
.ct-page .ct-verde, .ct-page .ct-ok { color: var(--vf-ok); }
.ct-page .ct-pend { color: var(--vf-aviso); }
.ct-cod { display: inline-block; margin-left: 6px; font-size: 11px; color: var(--vf-suave); background: var(--vf-gris-bg); border-radius: 4px; padding: 1px 6px; font-weight: 500; vertical-align: 1px; }
.ct-page .vf-aviso { display: flex; gap: 10px; align-items: flex-start; background: var(--vf-aviso-bg); color: #6b4300; border: 1px solid #f3d9a8; border-radius: 8px; padding: 12px 14px; margin: 10px 0; font-size: 13px; }
.ct-page .vf-aviso > .fa { font-size: 18px; color: var(--vf-aviso); margin-top: 1px; }
.ct-aviso-grande { font-size: 14px !important; padding: 18px !important; }

/* Pasos (cómo funciona) */
.ct-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 14px; }
.ct-paso { display: flex; gap: 10px; align-items: flex-start; background: #fff; border: 1px solid var(--vf-borde); border-radius: 10px; padding: 12px 14px; }
.ct-paso > span, .ct-num { flex: none; width: 28px; height: 28px; border-radius: 50%; background: #e6edf7; color: var(--vf-azul); font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.ct-paso.activo > span { background: var(--vf-azul); color: #fff; }
.ct-paso b { display: block; color: var(--vf-texto); font-size: 13.5px; }
.ct-paso small { display: block; color: var(--vf-suave); font-size: 12px; line-height: 1.45; margin-top: 2px; }

/* Lista de modelos */
.ct-lista { display: block; }
.ct-item { display: grid; grid-template-columns: minmax(0, 1fr) 210px auto; gap: 16px; align-items: center; padding: 14px 18px; border-top: 1px solid var(--vf-borde); }
.ct-item:first-child { border-top: 0; }
.ct-item:hover { background: #fafcfe; }
.ct-item-tit { font-weight: 600; color: var(--vf-azul); font-size: 15px; }
.ct-item-desc { color: var(--vf-texto); font-size: 13px; margin-top: 1px; }
.ct-item-resumen { color: var(--vf-suave); font-size: 12.5px; margin-top: 6px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ct-item-vars { font-size: 12px; color: var(--vf-turquesa); margin-top: 5px; }
.ct-uso-num { font-weight: 600; font-size: 13px; color: var(--vf-azul); }
.ct-uso-barra { height: 6px; border-radius: 3px; background: var(--vf-aviso-bg); margin: 5px 0 4px; overflow: hidden; }
.ct-uso-barra span { display: block; height: 100%; background: var(--vf-ok); border-radius: 3px; }
.ct-uso-txt { font-size: 11.5px; color: var(--vf-suave); }
.ct-uso-cero { font-size: 12px; color: var(--vf-suave); font-style: italic; }
.ct-item-acc { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ct-btn-borrar:hover { color: var(--vf-error) !important; border-color: var(--vf-error) !important; }

/* Editor + variables */
.ct-form { margin-bottom: 16px; }
.ct-label { display: block; font-size: 12.5px; font-weight: 600; color: var(--vf-texto); margin: 12px 0 6px; }
.ct-editor-zona { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 16px; align-items: start; }
.ct-editor-principal .note-editor { border-radius: 8px; border-color: var(--vf-borde) !important; }
.ct-editor-principal .note-toolbar { background: var(--vf-fondo); border-radius: 8px 8px 0 0; }
.ct-variables { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 10px; padding: 12px; position: sticky; top: 70px; max-height: 560px; overflow: auto; margin-top: 12px; }
.ct-variables-tit, .ct-var-tit { font-weight: 600; color: var(--vf-azul); font-size: 13px; margin-bottom: 6px; }
.ct-var-tit { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); margin: 10px 0 5px; }
.ct-var-select { width: 100%; margin: 6px 0 4px; display: none; }
.ct-var { display: inline-block; margin: 0 4px 5px 0; padding: 4px 9px; border-radius: 14px; border: 1px solid #c9d8ea; background: #fff; color: var(--vf-azul); font-size: 12px; cursor: pointer; line-height: 1.3; }
.ct-var:hover { background: var(--vf-azul); color: #fff; border-color: var(--vf-azul); }
.ct-var-prev { background: #fff4c2; border-bottom: 2px solid #f0c419; border-radius: 3px; padding: 0 3px; font-weight: 500; }
.ct-previa { background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; padding: 26px 30px; max-height: 65vh; overflow: auto; font-size: 13.5px; line-height: 1.6; color: #222; }
.ct-previa img { max-width: 100%; height: auto; }
.ct-modal-editor .modal-body { padding-top: 6px; }

/* Asociar a un cliente (modal) */
.ct-buscar-cliente { display: flex; gap: 8px; margin-bottom: 12px; }
.ct-buscar-cliente .vf-search { flex: 1; max-width: none; }
.ct-cliente { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 10px 4px; border-top: 1px solid var(--vf-borde); }
.ct-cliente:first-child { border-top: 0; }
.ct-cliente-acc { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.ct-hecho { color: var(--vf-ok); font-weight: 600; font-size: 13px; margin-right: 4px; }
.ct-copiado { color: var(--vf-ok) !important; border-color: var(--vf-ok) !important; }

/* Tablas (asociados / clientes) */
.ct-tabla { display: block; }
.ct-fila { display: grid; grid-template-columns: 34px minmax(0, 1.3fr) minmax(0, 1fr) 170px 330px; gap: 12px; align-items: center; padding: 11px 16px; border-top: 1px solid var(--vf-borde); font-size: 13px; }
.ct-tabla-clientes .ct-fila { grid-template-columns: 34px minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1.2fr); cursor: pointer; }
.ct-fila.ct-cab { background: var(--vf-fondo); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; padding-top: 8px; padding-bottom: 8px; border-top: 0; cursor: default; }
.ct-fila.ct-cab small { text-transform: none; letter-spacing: 0; font-weight: 400; }
.ct-fila:not(.ct-cab):hover { background: #fafcfe; }
.ct-fila.seleccionada { background: #eef5fc !important; }
.ct-fila input[type=checkbox] { width: 16px; height: 16px; cursor: pointer; margin: 0; }
.ct-fila .vf-label { display: none; }
.ct-fila .vf-badge { margin: 1px 2px 1px 0; }
.ct-acciones { display: flex; gap: 6px; justify-content: flex-end; align-items: center; flex-wrap: wrap; }
.ct-mas { position: relative; }
.ct-menu { display: none; position: absolute; right: 0; top: 100%; margin-top: 4px; z-index: 30; background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; box-shadow: 0 8px 24px rgba(1,57,127,.14); min-width: 260px; padding: 4px; }
.ct-mas.abierto .ct-menu { display: block; }
.ct-menu a { display: block; padding: 8px 10px; color: var(--vf-texto); border-radius: 6px; font-size: 13px; text-decoration: none; }
.ct-menu a:hover { background: var(--vf-fondo); color: var(--vf-azul); text-decoration: none; }
.ct-menu a .fa { width: 18px; color: var(--vf-suave); }
.ct-menu a.ct-peligro, .ct-menu a.ct-peligro .fa { color: var(--vf-error); }
.ct-selbar { margin: 0 16px 10px; align-items: center; flex-wrap: wrap; gap: 8px; }
.ct-vacio a { font-weight: 600; }

/* Masivo */
.ct-paso-card { margin-bottom: 14px; }
.ct-paso-card .vf-card-head { align-items: center; }
.ct-fila-contrato { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.ct-fila-contrato .vf-field { flex: 1; min-width: 240px; margin: 0; }
.ct-fila-contrato .vf-select { width: 100%; }
.ct-sin-padding { padding: 0 !important; }
.ct-sin-padding .vf-toolbar { padding: 12px 16px; flex-wrap: wrap; }
.ct-switch { position: relative; display: inline-flex; align-items: center; gap: 8px; font-weight: 400; font-size: 13px; color: var(--vf-texto); cursor: pointer; margin: 0; user-select: none; }
.ct-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ct-switch input + span::before { content: ""; display: inline-block; flex: none; width: 34px; height: 20px; border-radius: 10px; background: #c9d2dd; vertical-align: middle; margin-right: 8px; transition: background .15s; box-shadow: inset 0 0 0 2px #c9d2dd; }
.ct-switch input + span { position: relative; display: inline-flex; align-items: center; }
.ct-switch input + span::after { content: ""; position: absolute; left: 3px; top: 50%; margin-top: -7px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: left .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.ct-switch input:checked + span::before { background: var(--vf-ok); box-shadow: inset 0 0 0 2px var(--vf-ok); }
.ct-switch input:checked + span::after { left: 17px; }
.ct-switch input:focus-visible + span::before { outline: 2px solid var(--vf-turquesa); outline-offset: 2px; }
.ct-barra-final { position: sticky; bottom: 0; z-index: 20; display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 10px; padding: 12px 16px; box-shadow: 0 -4px 18px rgba(1,57,127,.08); margin: 0 0 16px; }
.ct-barra-final.activa { border-color: var(--vf-turquesa); }
.ct-barra-final.activa .ct-num { background: var(--vf-azul); color: #fff; }
.ct-barra-txt { flex: 1; font-size: 13px; min-width: 0; }
.ct-barra-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.ct-progreso { height: 8px; background: var(--vf-gris-bg); border-radius: 4px; overflow: hidden; margin-bottom: 16px; }
.ct-progreso-barra { height: 100%; width: 2%; background: var(--vf-turquesa); transition: width .3s; }
.ct-res { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.ct-res-item { border: 1px solid var(--vf-borde); border-top: 3px solid #9aa8ba; border-radius: 8px; padding: 10px 12px; }
.ct-res-item b { display: block; font-size: 24px; line-height: 1.1; color: var(--vf-texto); }
.ct-res-item span { font-size: 12px; color: var(--vf-suave); }
.ct-res-item.ok { border-top-color: var(--vf-ok); } .ct-res-item.ok b { color: var(--vf-ok); }
.ct-res-item.aviso { border-top-color: #e0a800; } .ct-res-item.aviso b { color: var(--vf-aviso); }
.ct-res-item.error { border-top-color: var(--vf-error); } .ct-res-item.error b { color: var(--vf-error); }
.ct-res-lista { margin-top: 14px; max-height: 260px; overflow: auto; }
.ct-res-enlace { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr); gap: 8px; align-items: center; padding: 4px 0; font-size: 12.5px; }
.ct-res-enlace input { width: 100%; font-size: 11.5px; padding: 4px 6px; border: 1px solid var(--vf-borde); border-radius: 5px; background: var(--vf-fondo); color: var(--vf-suave); }

/* Casillas */
.ct-checks-zona { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.ct-check-card { margin-bottom: 12px; transition: opacity .15s; }
.ct-check-card.apagada .ct-check-body { opacity: .55; }
.ct-check-head { padding: 12px 16px; border-bottom: 1px solid var(--vf-borde); }
.ct-switch-grande b { font-size: 14.5px; color: var(--vf-azul); margin-right: 8px; }
.ct-check-estado { font-size: 12px; color: var(--vf-suave); }
.ct-check-card:not(.apagada) .ct-check-estado:not(.ct-aviso) { color: var(--vf-ok); }
.ct-check-body { padding: 12px 16px 14px; display: flex; flex-direction: column; gap: 10px; }
.ct-check-body .vf-field { margin: 0; }
.ct-check-body textarea { width: 100%; resize: vertical; min-height: 54px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 8px 10px; font-size: 13px; }
.ct-check-pie { display: flex; justify-content: space-between; align-items: center; margin-top: 5px; }
.ct-contador { font-size: 11.5px; color: var(--vf-suave); font-variant-numeric: tabular-nums; }
.ct-link-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) auto; gap: 6px; margin-top: 8px; padding: 8px; background: var(--vf-fondo); border-radius: 6px; }
.ct-link-form input { border: 1px solid var(--vf-borde); border-radius: 5px; padding: 5px 8px; font-size: 12.5px; min-width: 0; }
.ct-rgpd { background: var(--vf-aviso-bg); color: #6b4300; border-radius: 6px; padding: 8px 10px; font-size: 12px; line-height: 1.45; }
.ct-rgpd .fa { color: var(--vf-aviso); margin-right: 4px; }
.ct-checks-previa { position: sticky; top: 70px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 10px; padding: 14px; }
.ct-previa-firma { background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; padding: 16px; margin: 8px 0 10px; }
.ct-previa-doc span { display: block; height: 7px; background: #e9edf2; border-radius: 4px; margin-bottom: 7px; }
.ct-previa-doc span.corta { width: 60%; margin-bottom: 16px; }
.ct-previa-check { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; font-size: 13px; color: #333; margin: 0 0 9px; line-height: 1.45; }
.ct-previa-check input { margin-top: 2px; flex: none; }
.ct-previa-check a { text-decoration: underline; }
.ct-previa-boton { margin-top: 12px; background: var(--vf-azul); color: #fff; text-align: center; border-radius: 6px; padding: 9px; font-weight: 600; font-size: 13px; opacity: .9; }
.ct-pulso { box-shadow: 0 0 0 0 rgba(27,121,155,.5); animation: ctPulso 1.6s infinite; }
@keyframes ctPulso { 0% { box-shadow: 0 0 0 0 rgba(27,121,155,.45); } 70% { box-shadow: 0 0 0 8px rgba(27,121,155,0); } 100% { box-shadow: 0 0 0 0 rgba(27,121,155,0); } }

@media (max-width: 1100px) {
    .ct-checks-zona, .ct-editor-zona { grid-template-columns: minmax(0, 1fr); }
    .ct-variables, .ct-checks-previa { position: static; max-height: none; }
    .ct-variables-lista { display: none; }
    .ct-var-select { display: block; }
    .ct-item { grid-template-columns: minmax(0, 1fr) 180px; }
    .ct-item-acc { grid-column: 1 / -1; justify-content: flex-start; }
}
@media (max-width: 860px) {
    .ct-pasos { grid-template-columns: minmax(0, 1fr); }
    .ct-item { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .ct-fila, .ct-tabla-clientes .ct-fila { grid-template-columns: 26px minmax(0, 1fr); gap: 4px 10px; padding: 12px; }
    .ct-fila > div:nth-child(n+3) { grid-column: 2; }
    .ct-fila.ct-cab > div:nth-child(n+3) { display: none; }
    .ct-fila .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; color: var(--vf-suave); letter-spacing: .4px; margin-top: 4px; }
    .ct-acciones { justify-content: flex-start; margin-top: 4px; }
    .ct-menu { left: 0; right: auto; }
    .ct-barra-final { flex-wrap: wrap; }
    .ct-barra-btns { width: 100%; }
    .ct-barra-btns .vf-btn { flex: 1; justify-content: center; }
    .ct-link-form { grid-template-columns: minmax(0, 1fr); }
    .ct-res-enlace { grid-template-columns: minmax(0, 1fr); }
    .ct-cliente { flex-direction: column; align-items: stretch; }
    .ct-cliente-acc { justify-content: flex-start; }
    .ct-previa { padding: 16px; }
}
.ct-variables .vf-help, .ct-editor-principal .vf-help, .ct-checks-previa .vf-help, .ct-paso-card .vf-help { font-size: 12px; color: var(--vf-suave); margin-top: 5px; line-height: 1.45; }
.ct-editor-principal #ct_usadas { margin-top: 8px; }
/* custom.css oculta todos los checkbox (opacity 0) y espera una etiqueta con imagen: aquí se ven normales */
.ct-page .ct-fila input[type=checkbox], .ct-previa-check input[type=checkbox] { opacity: 1; float: none; margin: 0; width: 16px; height: 16px; accent-color: var(--vf-azul); }
.ct-previa-check input[type=checkbox] { margin-top: 2px; pointer-events: none; }
.ct-page .ct-switch input[type=checkbox] { float: none; margin: 0; }
.ct-selbar { justify-content: flex-start; position: static; box-shadow: none; border: 1px solid #c9d8ea; background: #eef5fc; border-radius: 8px; padding: 8px 12px; }
.ct-selbar #ct_sel_txt { margin-right: 6px; }
/* Barra del editor (summernote) con el aspecto de la pantalla */
.ct-editor-principal .note-toolbar .btn, .ct-modal-editor .note-toolbar .btn { background: #fff !important; border: 1px solid var(--vf-borde) !important; color: var(--vf-texto) !important; border-radius: 4px !important; padding: 4px 8px !important; font-size: 13px !important; min-width: 0; height: auto; box-shadow: none !important; opacity: 1; margin: 0 -1px 0 0; text-transform: none; }
.ct-editor-principal .note-toolbar .btn.active, .ct-modal-editor .note-toolbar .btn.active, .ct-editor-principal .note-toolbar .btn:hover, .ct-modal-editor .note-toolbar .btn:hover { background: #e6edf7 !important; color: var(--vf-azul) !important; }
.ct-editor-principal .note-toolbar .btn-group, .ct-modal-editor .note-toolbar .btn-group { margin: 0 6px 5px 0; }
.ct-editor-principal .note-editable, .ct-modal-editor .note-editable { font-size: 14px; line-height: 1.6; color: #222; }
@media (max-width: 860px) { .ct-fila > div:nth-child(2) > .vf-label { display: none; } }

/* CONTRATOS AJUSTES 2 (14/10/2026): hoja del contrato igual que el PDF + textos de los interruptores */
.ct-switch-txt { display: inline; }
.ct-switch-txt b { font-weight: 700; }
.ct-previa { background: #eef1f5 !important; padding: 16px !important; max-height: 72vh; border-radius: 8px; }
.ct-previa .ct-hoja { margin: 0 auto; }
#ct_modal_previa .modal-dialog, .ct-modal-editor .modal-dialog { width: 900px; max-width: calc(100vw - 20px); }
.ct-modal-editor .modal-dialog { width: 1200px; }
.ct-editor-hoja .note-toolbar { position: sticky; top: 0; z-index: 3; }
@media (max-width: 860px) { .ct-previa { padding: 0 !important; } }
.ct-doc .ct-var-prev { padding: 0 1px; }

/* =============================================================================
   PRESUPUESTOS (14/10/2026) — configuracion_presupuestos.php y presupuesto_facturas.php · prefijo .pp-
   ============================================================================= */
.pp-page .pp-bien { color: var(--vf-ok); }
.pp-page .pp-mal { color: var(--vf-error); }
.pp-page .pp-neg { color: var(--vf-error); }
.pp-page .pp-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pp-page .pp-prev, .pp-page td.pp-prev { color: var(--vf-suave); }
.pp-sinprev { color: #9aa8ba; font-style: italic; font-size: 12px; }
.pp-sin .vf-vacio a { text-decoration: none; }

/* Filtros */
.pp-filtros { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; padding: 14px 16px; margin-bottom: 14px; }
.pp-filtros .vf-field { margin: 0; }
.pp-f-pres { flex: 1; min-width: 240px; max-width: 420px; }
.pp-f-pres .vf-select, .pp-f-anio .vf-select { width: 100%; height: 38px; font-size: 14px; }
.pp-f-anio { width: 120px; }
.pp-f-info { flex: 1; min-width: 200px; color: var(--vf-suave); font-size: 13px; padding-bottom: 9px; }

/* KPIs */
.pp-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.pp-kpi { background: #fff; border: 1px solid var(--vf-borde); border-top: 3px solid var(--vf-azul); border-radius: 8px; padding: 12px 16px; }
.pp-k-ing { border-top-color: var(--vf-ok); } .pp-k-gas { border-top-color: var(--vf-error); }
.pp-kpi-tit { font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); margin-bottom: 4px; font-weight: 600; }
.pp-kpi-fila { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.pp-kpi-fila span { font-size: 12.5px; color: var(--vf-suave); }
.pp-kpi-fila b { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--vf-texto); }
.pp-kpi-fila.pp-prev b { font-size: 14px; font-weight: 500; color: var(--vf-suave); }
.pp-kpi-pie { font-size: 12px; color: var(--vf-suave); margin-top: 6px; min-height: 16px; }
.pp-barra { height: 6px; background: var(--vf-gris-bg); border-radius: 3px; overflow: hidden; margin-top: 8px; }
.pp-barra span { display: block; height: 100%; width: 0; background: var(--vf-turquesa); border-radius: 3px; transition: width .4s; }
.pp-k-ing .pp-barra span { background: var(--vf-ok); }
.pp-k-gas .pp-barra span { background: #e0a800; }
.pp-barra span.pp-pasado, .pp-barra.pp-pasado span { background: var(--vf-error) !important; }

/* Pestañas */
.pp-tab { padding: 14px 16px 16px; }
.pp-tab-barra { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.pp-tab-barra .vf-search { flex: 1; min-width: 220px; max-width: 420px; }
.pp-grafico { position: relative; height: 320px; margin-bottom: 16px; }
.pp-scroll { overflow-x: auto; }
.pp-rango { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.pp-rango label { font-weight: 400; font-size: 13px; color: var(--vf-suave); margin: 0; display: inline-flex; align-items: center; gap: 6px; text-transform: none; }
.pp-rango input[type=date], .pp-page input[type=date] { height: 34px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 13px; color: var(--vf-texto); background: #fff; }
.pp-nota { margin-top: 10px; }

/* Tablas */
.pp-tabla { width: 100%; border-collapse: collapse; font-size: 13px; }
.pp-tabla th { background: var(--vf-fondo); color: var(--vf-suave); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; padding: 8px 10px; text-align: right; border-bottom: 1px solid var(--vf-borde); white-space: nowrap; }
.pp-tabla th:first-child, .pp-tabla td:first-child { text-align: left; }
.pp-tabla td { padding: 8px 10px; border-bottom: 1px solid #eef1f5; vertical-align: top; }
.pp-tabla tbody tr:hover { background: #fafcfe; }
.pp-tabla tfoot td { font-weight: 700; border-top: 2px solid var(--vf-borde); border-bottom: 0; background: #fbfcfe; text-align: right; }
.pp-tabla tfoot td:first-child { text-align: left; }
.pp-tabla .pp-futuro td { color: #9aa8ba; }
.pp-tabla th.pp-g-ing, .pp-tabla th.pp-g-gas, .pp-tabla th.pp-g-res { text-align: center; border-bottom: 2px solid; }
.pp-tabla th.pp-g-ing { color: var(--vf-ok); } .pp-tabla th.pp-g-gas { color: var(--vf-error); } .pp-tabla th.pp-g-res { color: var(--vf-azul); }
.pp-sub-tit { font-size: 14px; font-weight: 600; margin: 14px 0 8px; }
.pp-sub-tit:first-child { margin-top: 0; }
.pp-sub-tit.pp-g-ing { color: var(--vf-ok); } .pp-sub-tit.pp-g-gas { color: var(--vf-error); }
.pp-tabla-cat { margin-bottom: 8px; }
.pp-tabla-cat td:nth-child(n+2):nth-child(-n+4) { text-align: right; font-variant-numeric: tabular-nums; }
.pp-col-barra { width: 170px; }
.pp-col-barra .pp-barra { display: inline-block; width: 110px; margin: 0 6px 0 0; vertical-align: middle; }
.pp-col-barra small { color: var(--vf-suave); }

/* Partidas */
.pp-lista { border: 1px solid var(--vf-borde); border-radius: 8px; overflow: hidden; }
.pp-fila { display: grid; grid-template-columns: 34px minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1.1fr) 120px 120px 118px; gap: 10px; align-items: center; padding: 10px 14px; border-top: 1px solid #eef1f5; font-size: 13px; }
.pp-fila:first-child { border-top: 0; }
.pp-fila.pp-cab { background: var(--vf-fondo); color: var(--vf-suave); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; padding-top: 8px; padding-bottom: 8px; }
.pp-fila.pp-pie { background: #fbfcfe; font-weight: 600; border-top: 2px solid var(--vf-borde); }
.pp-fila:not(.pp-cab):not(.pp-pie):hover { background: #fafcfe; }
.pp-fila .vf-label { display: none; }
.pp-ico { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }
.pp-ico-ing { background: var(--vf-ok-bg); color: var(--vf-ok); }
.pp-ico-gas { background: var(--vf-error-bg); color: var(--vf-error); }
.pp-acc { display: flex; gap: 4px; justify-content: flex-end; }
.pp-btn-borrar:hover { color: var(--vf-error) !important; border-color: var(--vf-error) !important; }

/* Formulario de partida */
.pp-tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
.pp-tipo input { position: absolute; opacity: 0; width: 1px; height: 1px; float: none; margin: 0; }
.pp-tipo label { display: flex !important; flex-direction: column; align-items: center; gap: 2px; border: 2px solid var(--vf-borde); border-radius: 10px; padding: 10px; cursor: pointer; font-size: 15px; font-weight: 600; color: var(--vf-suave); background: #fff !important; margin: 0; text-transform: none; transition: all .15s; }
.pp-tipo label small { font-size: 11.5px; font-weight: 400; }
.pp-tipo input:checked + label { border-color: currentColor; background: #fbfcfe !important; }
.pp-tipo #sc-1-2-1:checked + label { color: var(--vf-ok); background: var(--vf-ok-bg) !important; }
.pp-tipo #sc-1-2-2:checked + label { color: var(--vf-error); background: var(--vf-error-bg) !important; }
.pp-tipo input:focus-visible + label { outline: 3px solid rgba(27,121,155,.3); }
.pp-form { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px 14px; }
.pp-form .vf-field { margin: 0; }
.pp-c2 { grid-column: span 2; } .pp-c3 { grid-column: span 3; } .pp-c4 { grid-column: span 4; } .pp-c6 { grid-column: span 6; }
.pp-modal .vf-field input[type=date], .pp-modal .vf-field input[type=text] { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 14px; }
.pp-modal .vf-field .vf-select { width: 100%; height: 38px; }
.pp-variacion { margin: 16px 0 0; border: 1px dashed #cfd8e3; border-radius: 8px; padding: 10px 14px; }
.pp-variacion summary { cursor: pointer; font-weight: 600; color: var(--vf-azul); font-size: 13.5px; }
.pp-variacion summary small { font-weight: 400; color: var(--vf-suave); }
.pp-variacion[open] summary { margin-bottom: 12px; }
.pp-simula { margin-top: 16px; background: var(--vf-info-bg); border-radius: 8px; padding: 10px 14px; font-size: 13.5px; color: #164c60; }
.pp-simula-tit b { font-size: 15px; }
.pp-simula-lista { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.pp-simula-lista span { background: #fff; border: 1px solid #c4e2ec; border-radius: 12px; padding: 2px 9px; font-size: 12px; color: var(--vf-texto); }

/* Presupuestos (configuración) */
.pp-pres { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.4fr) auto; gap: 14px; align-items: center; padding: 14px 18px; border-top: 1px solid var(--vf-borde); }
.pp-pres:first-child { border-top: 0; }
.pp-pres:hover { background: #fafcfe; }
.pp-pres-nom { font-size: 15.5px; font-weight: 600; color: var(--vf-azul); }
.pp-pres-datos { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; font-variant-numeric: tabular-nums; }
.pp-pres-acc { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.pp-form-pres { margin-bottom: 14px; }
#div_tabla_movimientos { margin-top: 18px; }
.pp-copia-filtro { display: grid; grid-template-columns: repeat(3, minmax(0, 180px)) auto; gap: 12px 14px; align-items: end; }
.pp-copia-filtro .vf-field { margin: 0; }
.pp-copia-filtro input[type=date], .pp-copia-filtro .vf-select { width: 100%; height: 38px; }
.pp-copia-barra { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; align-items: center; margin: 16px 0 8px; font-size: 13px; }
.pp-copia-ajuste { color: var(--vf-suave); display: inline-flex; align-items: center; gap: 6px; }
.pp-copia-ajuste input { width: 60px; height: 30px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 3px 6px; text-align: right; }
.pp-copia-tabla { max-height: 460px; overflow: auto; border: 1px solid var(--vf-borde); border-radius: 8px; }
.pp-tabla-copia thead th { position: sticky; top: 0; z-index: 1; }
.pp-tabla-copia input[type=text], .pp-tabla-copia input[type=date] { width: 100%; height: 30px; border: 1px solid #dfe5ec; border-radius: 4px; padding: 3px 7px; font-size: 13px; background: #fff; }
.pp-tabla-copia input[data-c=importe] { width: 110px; }
.pp-tabla-copia td:last-child { text-align: right; }
.pp-page .pp-tabla input[type=checkbox] { opacity: 1; float: none; margin: 0; width: 16px; height: 16px; accent-color: var(--vf-azul); }
.pp-desmarcada td { opacity: .45; }
.pp-copia-final { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin-top: 14px; }
.pp-copia-final .vf-field { margin: 0; min-width: 260px; }
.pp-copia-final .vf-select { width: 100%; height: 38px; }
.pp-progreso { height: 8px; background: var(--vf-gris-bg); border-radius: 4px; overflow: hidden; margin: 12px 0 6px; }
.pp-progreso-barra { height: 100%; width: 2%; background: var(--vf-turquesa); transition: width .3s; }

@media (max-width: 1100px) {
    .pp-fila { grid-template-columns: 34px minmax(0, 1.4fr) minmax(0, 1fr) 110px 110px 112px; }
    .pp-fila > div:nth-child(4) { display: none; }
}
@media (max-width: 860px) {
    .pp-kpis { grid-template-columns: minmax(0, 1fr); }
    .pp-fila, .pp-fila.pp-pie { grid-template-columns: 30px minmax(0, 1fr); gap: 4px 10px; }
    .pp-fila > div:nth-child(n+3) { grid-column: 2; text-align: left; }
    .pp-fila > div:nth-child(4) { display: block; }
    .pp-fila.pp-cab { display: none; }
    .pp-fila .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; color: var(--vf-suave); letter-spacing: .4px; margin-top: 4px; }
    .pp-acc { justify-content: flex-start; margin-top: 4px; }
    .pp-form { grid-template-columns: minmax(0, 1fr); }
    .pp-c2, .pp-c3, .pp-c4, .pp-c6 { grid-column: 1 / -1; }
    .pp-pres { grid-template-columns: minmax(0, 1fr); }
    .pp-pres-acc { justify-content: flex-start; }
    .pp-copia-filtro { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .pp-grafico { height: 260px; }
    .pp-col-barra { display: none; }
}
.pp-page .vf-help { font-size: 12px; color: var(--vf-suave); line-height: 1.45; margin-top: 6px; }
.pp-tabla-copia th { text-align: left !important; }
.pp-tabla-copia th:last-child { text-align: right !important; }

/* =============================================================================
   MI CUENTA (15/10/2026) — movimientos_cuenta.php y facturas.php · prefijos .mc- y .ft-
   ============================================================================= */
.mc-page .mc-pos { color: var(--vf-ok); }
.mc-page .mc-neg { color: var(--vf-error); }
.mc-page .mc-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mc-h-sub { font-size: 17px; font-weight: 400; color: var(--vf-suave); }
.mc-page .vf-help { font-size: 12px; color: var(--vf-suave); line-height: 1.45; }

/* Resumen */
.mc-resumen { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 14px; }
.mc-resumen .mc-caja { flex: 1 1 420px; min-width: 0; }
.mc-caja { background: #fff; border: 1px solid var(--vf-borde); border-radius: 10px; padding: 14px 18px; }
.mc-caja-tit { font-weight: 600; color: var(--vf-azul); font-size: 14px; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.mc-logo { width: 26px; height: 26px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #fff; }
.mc-gc { background: #1c1b3a; } .mc-st { background: #635bff; }
.mc-flujo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mc-flujo > div { display: flex; flex-direction: column; min-width: 0; }
.mc-flujo span { font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); }
.mc-flujo b { font-size: 17px; font-variant-numeric: tabular-nums; color: var(--vf-texto); }
.mc-flujo > i { color: #b9c4d1; font-size: 12px; font-style: normal; font-weight: 700; }
.mc-flujo .mc-igual { font-size: 18px; }
.mc-flujo .mc-saldo { background: var(--vf-info-bg); border-radius: 8px; padding: 6px 12px; margin-left: auto; }
.mc-flujo .mc-saldo b { font-size: 20px; color: var(--vf-azul); }
.mc-caja-pie { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--vf-borde); font-size: 12px; color: var(--vf-suave); }
.mc-caja-pie b { color: var(--vf-texto); font-weight: 600; }
.mc-nota { flex-basis: 100%; margin: 0; }

/* Barra de filtros */
.mc-toolbar, .mc-toolbar2 { flex-wrap: wrap; gap: 10px; }
.mc-toolbar2 { border-top: 1px solid #eef1f5; }
.mc-toolbar2 .vf-search { flex: 1; min-width: 220px; max-width: 380px; }
.mc-fechas { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.mc-fechas label { font-weight: 400; font-size: 13px; color: var(--vf-suave); margin: 0; display: inline-flex; align-items: center; gap: 6px; text-transform: none; }
.mc-fechas input[type=date] { height: 34px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 13px; color: var(--vf-texto); background: #fff; }
.mc-switch { display: inline-flex; align-items: center; gap: 7px; font-weight: 400; font-size: 13px; margin: 0; cursor: pointer; text-transform: none; color: var(--vf-texto); }
.mc-page .mc-switch input[type=checkbox] { opacity: 1; float: none; margin: 0; width: 16px; height: 16px; accent-color: var(--vf-azul); }

/* Totales del periodo */
.mc-totales { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; padding: 10px 16px; background: var(--vf-fondo); border-top: 1px solid #eef1f5; border-bottom: 1px solid #eef1f5; }
.mc-totales:empty { display: none; }
.mc-tot { display: flex; flex-direction: column; }
.mc-tot span { font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); }
.mc-tot b { font-size: 16px; font-variant-numeric: tabular-nums; }
.mc-tot-neto b { font-size: 18px; }
.mc-tot-det { display: flex; flex-wrap: wrap; gap: 4px; margin-left: auto; }

/* Lista de movimientos */
.mc-fila { display: grid; grid-template-columns: 96px minmax(0, 1.1fr) minmax(0, 1.6fr) 130px 120px; gap: 12px; align-items: center; padding: 9px 16px; border-top: 1px solid #eef1f5; font-size: 13px; }
.mc-fila.mc-cab { background: var(--vf-fondo); color: var(--vf-suave); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; padding-top: 8px; padding-bottom: 8px; border-top: 0; }
.mc-fila:not(.mc-cab):hover { background: #fafcfe; }
.mc-fila .vf-label { display: none; }
.mc-fecha { font-variant-numeric: tabular-nums; color: var(--vf-texto); }
.mc-tachada { color: var(--vf-suave); }
.mc-ico { display: inline-flex; width: 24px; height: 24px; border-radius: 50%; align-items: center; justify-content: center; font-size: 11px; margin-right: 8px; vertical-align: middle; }
.mc-cobro { background: var(--vf-ok-bg); color: var(--vf-ok); } .mc-devol { background: var(--vf-error-bg); color: var(--vf-error); }
.mc-comis { background: var(--vf-aviso-bg); color: var(--vf-aviso); } .mc-transf { background: #e6edf7; color: var(--vf-azul); } .mc-otros { background: var(--vf-gris-bg); color: var(--vf-suave); }
.mc-link { color: var(--vf-azul); font-weight: 500; }
.mc-desc { font-style: italic; }
.mc-pdf { margin-top: 3px; }
.mc-saldo-col { color: var(--vf-suave); }
.mc-sub { padding: 6px 16px 14px 124px; background: #fbfcfe; border-top: 1px dashed var(--vf-borde); }
.mc-tabla { width: 100%; max-width: 760px; border-collapse: collapse; font-size: 12.5px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; }
.mc-tabla th { background: var(--vf-fondo); color: var(--vf-suave); font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; padding: 6px 10px; text-align: left; }
.mc-tabla td { padding: 6px 10px; border-top: 1px solid #eef1f5; }
.mc-tabla tfoot td { font-weight: 700; background: var(--vf-fondo); }

/* Facturas Tadosi */
.ft-aviso { display: flex; gap: 10px; align-items: center; background: var(--vf-aviso-bg); border: 1px solid #f3d9a8; color: #6b4300; border-radius: 10px; padding: 12px 16px; margin-bottom: 14px; font-size: 14px; }
.ft-aviso > .fa { font-size: 20px; color: var(--vf-aviso); }
.ft-aviso .vf-btn { margin-left: 8px; }
.ft-resultado { margin: 0 16px 10px; padding: 10px 14px; border-radius: 8px; background: var(--vf-info-bg); color: #164c60; font-size: 13px; }
.ft-resultado .vf-btn { margin-left: 8px; }
.ft-fila { display: grid; grid-template-columns: 150px minmax(0, 1.6fr) 110px 100px 120px 170px 230px; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid #eef1f5; font-size: 13px; }
.ft-fila.ft-cab { background: var(--vf-fondo); color: var(--vf-suave); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; padding-top: 8px; padding-bottom: 8px; border-top: 0; }
.ft-fila:not(.ft-cab):hover { background: #fafcfe; }
.ft-fila.ft-pend { background: #fffcf5; }
.ft-fila .vf-label { display: none; }
.ft-acc { display: flex; gap: 5px; justify-content: flex-end; flex-wrap: wrap; }
.ft-acc .disabled { pointer-events: none; opacity: .6; }

@media (max-width: 1100px) {
    .ft-fila { grid-template-columns: 140px minmax(0, 1fr) 110px 160px 200px; }
    .ft-fila > div:nth-child(3), .ft-fila > div:nth-child(4) { display: none; }
}
@media (max-width: 860px) {
    .mc-resumen .mc-caja { flex-basis: 100%; }
    .mc-flujo .mc-saldo { margin-left: 0; width: 100%; }
    .mc-fila, .ft-fila { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 12px; }
    .mc-fila.mc-cab, .ft-fila.ft-cab { display: none; }
    .mc-fila > div:nth-child(1) { grid-column: 1; order: 0; color: var(--vf-suave); font-size: 12px; }
    .mc-fila > div:nth-child(2) { grid-column: 1; }
    .mc-fila > div:nth-child(3) { grid-column: 1 / -1; }
    .mc-fila > div:nth-child(4) { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 15px; }
    .mc-fila > div:nth-child(5) { display: none; }
    .mc-fila .vf-label, .ft-fila .vf-label { display: none; }
    .ft-fila > div { grid-column: 1 / -1; }
    .ft-fila > div:nth-child(3), .ft-fila > div:nth-child(4) { display: none; }
    .ft-fila > div:nth-child(5) { grid-column: 2; grid-row: 1; font-size: 15px; }
    .ft-fila > div:nth-child(1) { grid-column: 1; grid-row: 1; }
    .ft-acc { justify-content: flex-start; }
    .mc-sub { padding: 6px 12px 12px; overflow-x: auto; }
    .mc-tot-det { margin-left: 0; }
}

/* =============================================================================
   DETALLE FACTURA TADOSI (15/10/2026) — detalle_factura.php · prefijo .df-
   ============================================================================= */
.df-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px; margin-bottom: 14px; align-items: start; }
.df-factura { background: #fff; border: 1px solid var(--vf-borde); border-radius: 10px; padding: 22px 26px; box-shadow: 0 4px 18px rgba(1,57,127,.05); }
.df-etq { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; margin-bottom: 4px; }
.df-fact-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--vf-borde); }
.df-num { font-size: 24px; font-weight: 700; color: var(--vf-azul); line-height: 1.2; }
.df-partes { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--vf-borde); font-size: 13.5px; line-height: 1.55; color: var(--vf-texto); }
.df-partes b { font-size: 14.5px; }
.df-pre { white-space: pre-wrap; }
.df-concepto { padding: 14px 0; border-bottom: 1px solid var(--vf-borde); font-size: 14px; }
.df-importes { display: flex; justify-content: flex-end; gap: 26px; padding-top: 14px; flex-wrap: wrap; }
.df-importes > div { display: flex; flex-direction: column; align-items: flex-end; }
.df-importes span { font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); }
.df-importes b { font-size: 16px; font-variant-numeric: tabular-nums; }
.df-importes .df-total b { font-size: 24px; color: var(--vf-azul); }
.df-pago { background: var(--vf-aviso-bg); border: 1px solid #f3d9a8; border-radius: 10px; padding: 18px; }
.df-pagada { background: var(--vf-ok-bg); border-color: #bfe5cf; }
.df-pago-tit { font-weight: 700; font-size: 15px; color: #6b4300; margin-bottom: 12px; }
.df-pagada .df-pago-tit { color: #14532d; margin-bottom: 6px; }
.df-pago-tit .fa { margin-right: 4px; }
.df-pago-btn { width: 100%; justify-content: center; padding: 10px !important; font-size: 14px !important; }
.df-o { text-align: center; color: var(--vf-suave); font-size: 12px; margin: 12px 0 8px; position: relative; }
.df-transf { background: #fff; border-radius: 8px; padding: 6px 12px; border: 1px solid #f0e2c4; }
.df-transf > div { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid #f6efe0; font-size: 13px; }
.df-transf > div:first-child { border-top: 0; }
.df-transf span { width: 84px; flex: none; color: var(--vf-suave); font-size: 12px; }
.df-transf b { flex: 1; font-variant-numeric: tabular-nums; word-break: break-all; }
.df-copiar { border: 1px solid var(--vf-borde); background: #fff; border-radius: 5px; width: 28px; height: 26px; color: var(--vf-suave); cursor: pointer; flex: none; }
.df-copiar:hover { color: var(--vf-azul); border-color: var(--vf-azul); }
.df-copiar.df-ok { color: var(--vf-ok); border-color: var(--vf-ok); }
.df-pago .vf-help { margin-top: 10px; }
.df-det-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 14px 16px 6px; }
.df-det-cab h3 { margin: 0; font-size: 16px; font-weight: 600; color: var(--vf-azul); }
.df-tipos { padding: 4px 16px 6px; }
.df-tipos .vf-chip b { font-weight: 600; margin-left: 4px; }
.df-fila { display: grid; grid-template-columns: 100px 220px minmax(0, 1fr) 130px; gap: 12px; align-items: center; padding: 9px 16px; border-top: 1px solid #eef1f5; font-size: 13px; }
.df-fila.df-cab { background: var(--vf-fondo); color: var(--vf-suave); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; padding-top: 8px; padding-bottom: 8px; }
.df-fila.df-pie { background: #fbfcfe; font-weight: 700; border-top: 2px solid var(--vf-borde); }
.df-fila:not(.df-cab):not(.df-pie):hover { background: #fafcfe; }
.df-fila .vf-label { display: none; }
.df-tipo { display: inline-block; padding: 3px 9px; border-radius: 12px; font-size: 12px; font-weight: 500; background: var(--vf-gris-bg); color: var(--vf-texto); }
.df-t-tm_cm { background: #e6edf7; color: var(--vf-azul); }
.df-t-tm_cd { background: var(--vf-ok-bg); color: var(--vf-ok); }
.df-t-tm_ce { background: var(--vf-error-bg); color: var(--vf-error); }
.df-t-tm_ca { background: var(--vf-aviso-bg); color: var(--vf-aviso); }
.df-t-tm_sm { background: #efe9fb; color: #5b3fa0; }
@media (max-width: 1000px) { .df-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) {
    .df-factura { padding: 16px; }
    .df-partes { grid-template-columns: 1fr; gap: 12px; }
    .df-importes { justify-content: space-between; gap: 12px; }
    .df-fila { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 12px; }
    .df-fila.df-cab { display: none; }
    .df-fila > div:nth-child(1) { color: var(--vf-suave); font-size: 12px; }
    .df-fila > div:nth-child(2) { grid-column: 1; }
    .df-fila > div:nth-child(3) { grid-column: 1 / -1; }
    .df-fila > div:nth-child(4) { grid-column: 2; grid-row: 1 / span 2; }
    .df-fila.df-pie > div:nth-child(3) { display: none; }
}

/* =============================================================================
   INFORMES (15/10/2026) — pantallas del menú Informes · prefijo .inf-
   ============================================================================= */
.inf-page .vf-help { font-size: 12px; }
.inf-migas { font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--vf-turquesa); font-weight: 600; margin-bottom: 2px; }
.inf-nav { max-width: 240px; }
.vf-kpi.k-info { border-top-color: var(--vf-turquesa); } .vf-kpi.k-info .vf-kpi-num { color: var(--vf-turquesa); }
.vf-kpi.k-ok { border-top-color: var(--vf-ok); } .vf-kpi.k-ok .vf-kpi-num { color: var(--vf-ok); }
.vf-kpi.k-gris { border-top-color: #9aa8ba; } .vf-kpi.k-gris .vf-kpi-num { color: #6b7a8c; }
.inf-kpis .vf-kpi { cursor: default; }
.inf-kpis .vf-kpi:hover { transform: none; }
.inf-kpis .vf-kpi-num { font-size: 22px; }

/* Tarjetas de exportación */
.inf-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 16px; align-items: start; }
.inf-exp .vf-card-body { padding: 16px 18px; }
.inf-filtros { margin-bottom: 4px; }
.inf-fechas { display: flex; gap: 12px; flex-wrap: wrap; }
.inf-fechas label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--vf-suave); font-weight: 600; margin: 0; flex: 1; min-width: 140px; }
.inf-page input[type=date] { height: 36px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 4px 10px; font-size: 14px; color: var(--vf-texto); background: #fff; width: 100%; }
.inf-page input[type=date]:focus { border-color: var(--vf-turquesa); outline: none; box-shadow: 0 0 0 3px rgba(27,121,155,.12); }
.inf-rangos { margin: 10px 0 4px; }
.inf-botones { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0 6px; }
.inf-resultado { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 8px; margin-top: 12px; font-size: 13px; line-height: 1.45; border: 1px solid var(--vf-borde); background: var(--vf-fondo); }
.inf-resultado > .fa { font-size: 20px; flex: none; }
.inf-resultado > div { flex: 1; min-width: 0; }
.inf-resultado > .vf-btn { flex: none; }
.inf-resultado.inf-cargando { background: var(--vf-info-bg); border-color: #c4e2ec; color: var(--vf-azul); }
.inf-resultado.inf-ok { background: var(--vf-ok-bg); border-color: #bfe5cf; color: #14532d; }
.inf-resultado.inf-aviso { background: var(--vf-aviso-bg); border-color: #f3d9a8; color: #6b4300; }
.inf-resultado.inf-error { background: var(--vf-error-bg); border-color: #f2c4bf; color: #7f1d1d; }
.inf-resultado-panel { margin: 0 16px 12px; }

/* Filtro superior (fecha de corte, año...) */
.inf-filtro-top { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; padding: 14px 16px; margin-bottom: 14px; }
.inf-filtro-top .vf-field { margin: 0; min-width: 170px; }
.inf-filtro-top .vf-field label { font-size: 12px; color: var(--vf-suave); font-weight: 600; margin-bottom: 4px; display: block; }
.inf-filtro-top .vf-chips { margin: 0; }
.inf-filtro-top + .inf-resultado { margin: -4px 0 14px; }
.inf-nota347 { margin: -4px 0 14px; padding: 10px 14px; background: var(--vf-info-bg); border-radius: 8px; color: var(--vf-azul); line-height: 1.5; }
.inf-toolbar { flex-wrap: wrap; gap: 8px; }
.inf-toolbar .vf-select { width: auto; max-width: 280px; }
.inf-switch { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; margin: 0; cursor: pointer; color: var(--vf-texto); }
.inf-switch input[type=checkbox] { opacity: 1 !important; float: none !important; position: static !important; margin: 0; width: 16px; height: 16px; }

/* Lista genérica */
.inf-tabla { font-size: 13px; }
.inf-fila { display: grid; grid-template-columns: var(--inf-cols); gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid #eef1f5; }
.inf-fila.inf-cab { background: var(--vf-fondo); color: var(--vf-suave); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; padding-top: 8px; padding-bottom: 8px; }
.inf-cab [data-ord] { cursor: pointer; user-select: none; white-space: nowrap; }
.inf-cab [data-ord]:hover { color: var(--vf-azul); }
.inf-sort { opacity: .35; }
.inf-fila.inf-pie { background: #fbfcfe; font-weight: 700; border-top: 2px solid var(--vf-borde); }
.inf-fila.inf-pie .vf-sub { font-weight: 400; }
.inf-fila:not(.inf-cab):not(.inf-pie):hover { background: #fafcfe; }
.inf-fila .vf-label { display: none; }
.inf-fila > div { min-width: 0; overflow-wrap: anywhere; }
.inf-num { text-align: right; font-variant-numeric: tabular-nums; }
.inf-fecha { font-weight: 600; color: var(--vf-azul); white-space: nowrap; font-variant-numeric: tabular-nums; }
a.inf-fecha:hover { text-decoration: underline; }
.inf-mini { font-size: 12px; color: var(--vf-suave); margin-top: 3px; }
.inf-ok { color: var(--vf-ok); font-weight: 600; }
.inf-de { color: var(--vf-error); font-weight: 600; }
.inf-gr { color: #6b7a8c; font-weight: 600; }
.inf-pe { color: var(--vf-azul); font-weight: 600; }
.inf-em { color: #7a5cc7; font-weight: 600; }
.inf-iban { font-family: Menlo, Consolas, monospace; font-size: 12px; }
.inf-acc { text-align: right; white-space: nowrap; }
.inf-acc .vf-btn + .vf-btn { margin-left: 4px; }
.inf-ir { text-align: right; }
.inf-tenue { opacity: .6; }
.inf-motivo { color: #7f1d1d; font-size: 12.5px; }
.inf-motivo .fa { color: var(--vf-error); }
.inf-aviso-linea { margin: 0 16px 10px; padding: 9px 12px; border-radius: 8px; background: var(--vf-aviso-bg); color: #6b4300; font-size: 13px; }
.inf-clic { cursor: pointer; }
.inf-flecha { font-size: 10px; color: var(--vf-suave); transition: transform .15s; width: 10px; }
.inf-abierta { background: #f3f8fb !important; }
.inf-abierta .inf-flecha { transform: rotate(90deg); color: var(--vf-azul); }

/* Barra apilada */
.inf-barra { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--vf-gris-bg); margin-top: 4px; }
.inf-barra span { display: block; height: 100%; }
.b-co, .l-co { background: #2fae74; } .b-de, .l-de { background: #e05a4b; } .b-ca, .l-ca { background: #b9c3cf; }
.b-em, .l-em { background: #9b84e0; } .b-pe, .l-pe { background: #5b8fd6; }
.b-dom, .l-dom { background: var(--vf-azul); } .b-tar, .l-tar { background: #39b1c9; }
.inf-leyenda { font-size: 12px; color: var(--vf-suave); display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-left: auto; }
.inf-leyenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin: 0 2px 0 8px; }

/* Detalle desplegable */
.inf-detalle { background: #f8fbfd; border-top: 1px solid #e3edf3; padding: 8px 16px 12px 40px; }
.inf-det-tit { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--vf-suave); font-weight: 600; text-transform: uppercase; letter-spacing: .3px; padding: 4px 0 8px; }
.inf-det-fila { display: grid; grid-template-columns: 80px minmax(0, 1fr) 100px 110px; gap: 10px; align-items: center; padding: 7px 0; border-top: 1px solid #e8eef3; font-size: 13px; }
.inf-det-txt b { display: block; font-weight: 600; }
.inf-det-txt .vf-sub { font-size: 12px; }
.inf-est { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 12px; font-size: 12px; font-weight: 500; background: var(--vf-gris-bg); color: var(--vf-texto); white-space: nowrap; }
.inf-est-co { background: var(--vf-ok-bg); color: var(--vf-ok); }
.inf-est-de { background: var(--vf-error-bg); color: var(--vf-error); }
.inf-est-em { background: #efe9fb; color: #5b3fa0; }
.inf-est-ca { background: var(--vf-gris-bg); color: #6b7a8c; }
.inf-est-dom { background: #e6edf7; color: var(--vf-azul); }
.inf-est-tar { background: #e3f5f9; color: #157a90; }

/* Gráfico por días */
.inf-graf-panel { padding: 14px 16px 10px; margin-bottom: 14px; }
.inf-graf-tit { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--vf-azul); margin-bottom: 10px; }
.inf-graf-tit .inf-leyenda { margin-left: 0; }
.inf-graf-barras { display: flex; align-items: flex-end; gap: 3px; height: 150px; overflow-x: auto; padding-bottom: 20px; position: relative; }
.inf-graf-col { flex: 1 0 14px; max-width: 34px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; position: relative; cursor: pointer; }
.inf-graf-pila { display: flex; flex-direction: column; border-radius: 3px 3px 0 0; overflow: hidden; min-height: 2px; }
.inf-graf-pila span { display: block; min-height: 0; }
.inf-graf-col:hover .inf-graf-pila { filter: brightness(1.15); }
.inf-graf-lbl { position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%); font-size: 9.5px; color: var(--vf-suave); white-space: nowrap; }
.inf-graf-col:nth-child(even) .inf-graf-lbl { display: none; }

@media (max-width: 760px) {
    .inf-grid { grid-template-columns: minmax(0, 1fr); }
    .inf-nav { max-width: none; width: 100%; }
    .inf-fila { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 12px; padding: 12px; }
    .inf-fila.inf-cab { display: none; }
    .inf-fila > div:first-child { grid-column: 1 / -1; }
    .inf-fila > div:first-child > .vf-label { display: none; }
    .inf-fila .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); font-weight: 600; }
    .inf-fila .inf-num { text-align: left; }
    .inf-om { display: none !important; }
    .inf-fila.inf-pie .vf-label { display: none; }
    .inf-acc, .inf-ir { grid-column: 1 / -1; text-align: left; }
    .inf-ir { display: none; }
    .inf-detalle { padding: 8px 12px; }
    .inf-det-fila { grid-template-columns: 70px minmax(0, 1fr) auto; }
    .inf-det-fila > .inf-num { grid-column: 3; }
    .inf-det-fila > .inf-est { grid-column: 2; grid-row: 2; justify-self: start; }
    .inf-leyenda { margin-left: 0; }
    .inf-filtro-top { align-items: stretch; }
    .inf-filtro-top .vf-field { flex: 1 1 100%; }
    .inf-resultado { flex-wrap: wrap; }
}

/* =============================================================================
   CRM (15/10/2026) — crm.php y campos_crm.php · prefijo .crm-
   ============================================================================= */
.crm-page .vf-help { font-size: 12px; }
.vf-kpi.k-info { border-top-color: var(--vf-turquesa); } .vf-kpi.k-info .vf-kpi-num { color: var(--vf-turquesa); }
.vf-kpi.k-ok { border-top-color: var(--vf-ok); } .vf-kpi.k-ok .vf-kpi-num { color: var(--vf-ok); }
.crm-kpis .crm-kpi-tranquilo { border-top-color: var(--vf-ok); } .crm-kpis .crm-kpi-tranquilo .vf-kpi-num { color: var(--vf-ok); }
.crm-rojo { color: var(--vf-error); font-weight: 600; }
.vf-tab .vf-count.crm-rojo-bg { background: var(--vf-error); color: #fff; }
.crm-panel { overflow: hidden; }
.crm-toolbar .vf-select { width: auto; max-width: 220px; }
.crm-ocultar { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; margin: 0; cursor: pointer; color: var(--vf-texto); white-space: nowrap; }
.crm-page input[type=checkbox], .crm-ficha input[type=checkbox], .vf-modal input[type=checkbox] { opacity: 1 !important; float: none !important; position: static !important; margin: 0; width: 15px; height: 15px; }
.crm-aviso-filtro { margin: 10px 16px 0; padding: 8px 12px; border-radius: 6px; background: var(--vf-aviso-bg); color: #6b4300; font-size: 13px; }
.crm-vacio { padding: 60px 20px; line-height: 1.6; }

/* Embudo */
.crm-embudo { display: flex; gap: 12px; padding: 14px 16px 18px; overflow-x: auto; align-items: flex-start; min-height: 420px; background: var(--vf-fondo); -webkit-overflow-scrolling: touch; }
.crm-col { flex: 0 0 272px; background: #eef2f7; border-radius: 10px; display: flex; flex-direction: column; max-height: calc(100vh - 230px); min-height: 160px; border-top: 3px solid var(--crm-c, #5b8fd6); transition: background .15s, box-shadow .15s; }
.crm-col.crm-sobre { background: #e2ebf5; box-shadow: 0 0 0 2px var(--crm-c, #5b8fd6) inset; }
.crm-col-cab { display: flex; align-items: center; gap: 7px; padding: 10px 12px 8px; font-size: 13px; color: var(--vf-texto); }
.crm-col-cab b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-punto { width: 9px; height: 9px; border-radius: 50%; background: var(--crm-c, #5b8fd6); flex: none; }
.crm-col-n { background: #fff; border-radius: 10px; padding: 0 7px; font-size: 11.5px; font-weight: 600; color: var(--vf-suave); }
.crm-col-val { margin-left: auto; font-size: 11.5px; color: var(--vf-suave); font-variant-numeric: tabular-nums; white-space: nowrap; }
.crm-col-cuerpo { padding: 0 8px 8px; overflow-y: auto; display: flex; flex-direction: column; gap: 7px; flex: 1; }
.crm-col-vacia { border: 1.5px dashed #cdd7e3; border-radius: 8px; padding: 18px 10px; text-align: center; color: #9aa8ba; font-size: 12px; }
.crm-col-G .crm-card, .crm-col-P .crm-card { opacity: .88; }
.crm-card { background: #fff; border-radius: 8px; padding: 10px 11px 9px; box-shadow: 0 1px 2px rgba(15,30,50,.08); border: 1px solid #e3e8ef; cursor: pointer; transition: box-shadow .15s, transform .15s; outline: none; }
.crm-card:hover, .crm-card:focus { box-shadow: 0 4px 12px rgba(1,57,127,.12); border-color: #c9d6e6; }
.crm-card.crm-arrastrando { opacity: .45; transform: rotate(1.5deg); }
.crm-card-vencida { border-left: 3px solid var(--vf-error); }
.crm-card-nom { font-weight: 600; font-size: 13.5px; color: var(--vf-texto); line-height: 1.3; }
.crm-es-cliente { color: var(--vf-ok); font-size: 13px; }
.crm-card-sub { font-size: 12px; color: var(--vf-suave); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-prox { font-size: 12px; margin-top: 7px; color: var(--vf-azul); background: #eef3fa; border-radius: 5px; padding: 3px 7px; display: inline-block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-prox .fa { width: 13px; }
.crm-prox.crm-hoy { background: var(--vf-aviso-bg); color: #8a5300; font-weight: 600; }
.crm-prox.crm-vencida { background: var(--vf-error-bg); color: var(--vf-error); font-weight: 600; }
.crm-prox.crm-prox-no { background: transparent; color: #b26a00; padding: 0; }
.crm-card-pie { display: flex; align-items: center; gap: 6px; margin-top: 7px; flex-wrap: wrap; }
.crm-card-pie .vf-tag { margin: 0; }
.crm-valor { font-size: 12px; font-weight: 600; color: var(--vf-ok); font-variant-numeric: tabular-nums; }
.crm-hace { margin-left: auto; font-size: 11px; color: #9aa8ba; white-space: nowrap; }
.crm-mas-btn { border: none; background: none; color: var(--vf-turquesa); font-size: 12px; padding: 6px; cursor: pointer; }
.crm-mas-btn:hover { text-decoration: underline; }

/* Lista */
.crm-fila { cursor: pointer; }
.crm-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; padding: 2px 9px 2px 7px; border-radius: 12px; background: #f1f4f8; color: var(--vf-texto); white-space: nowrap; }
.crm-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--crm-c, #5b8fd6); }
.crm-corta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Tareas */
.crm-tareas { padding: 6px 16px 16px; }
.crm-t-grupo { margin-top: 12px; }
.crm-t-tit { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); padding: 4px 2px 8px; }
.crm-t-vencidas .crm-t-tit { color: var(--vf-error); }
.crm-t-hoy .crm-t-tit { color: #8a5300; }
.crm-t { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--vf-borde); border-radius: 8px; background: #fff; margin-bottom: 6px; cursor: pointer; }
.crm-t:hover { border-color: #c9d6e6; box-shadow: 0 2px 8px rgba(1,57,127,.07); }
.crm-t-vencidas .crm-t { border-left: 3px solid var(--vf-error); }
.crm-t-hoy .crm-t { border-left: 3px solid #e0a800; }
.crm-t-txt { font-size: 13.5px; min-width: 0; }
.crm-t-txt .fa { color: var(--vf-turquesa); width: 14px; }
.crm-t-cuando { font-size: 12.5px; font-weight: 600; color: var(--vf-azul); white-space: nowrap; }
.crm-t-vencidas .crm-t-cuando { color: var(--vf-error); }
.crm-t-acc { display: flex; gap: 4px; }
.crm-check { width: 28px; height: 28px; border-radius: 50%; border: 2px solid #b8c4d3; background: #fff; color: transparent; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; flex: none; transition: all .15s; }
.crm-check:hover { border-color: var(--vf-ok); color: var(--vf-ok); background: var(--vf-ok-bg); }

/* Ficha lateral */
.crm-fondo { position: fixed; inset: 0; background: rgba(15,30,50,.35); z-index: 1034; opacity: 0; pointer-events: none; transition: opacity .2s; }
.crm-fondo.visible { opacity: 1; pointer-events: auto; }
.crm-ficha { position: fixed; top: 0; right: 0; bottom: 0; width: 520px; max-width: 100%; background: #fff; z-index: 1035; transform: translateX(105%); transition: transform .22s ease; display: flex; flex-direction: column; box-shadow: -8px 0 30px rgba(15,30,50,.18); color: var(--vf-texto); }
.crm-ficha.abierta { transform: none; }
body.crm-sin-scroll { overflow: hidden; }
.crm-ficha * { box-sizing: border-box; }
.crm-ficha-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 18px 20px 14px; border-bottom: 1px solid var(--vf-borde); }
.crm-ficha-tit { display: flex; gap: 12px; align-items: center; min-width: 0; }
.crm-ficha-tit h3 { margin: 0; font-size: 19px; font-weight: 600; color: var(--vf-azul); line-height: 1.25; word-break: break-word; }
.crm-avatar { width: 44px; height: 44px; border-radius: 50%; color: #fff; font-weight: 600; font-size: 16px; display: flex; align-items: center; justify-content: center; flex: none; background: #5b8fd6; }
.crm-cerrar { border: none; background: none; font-size: 20px; color: var(--vf-suave); cursor: pointer; padding: 2px 6px; }
.crm-cerrar:hover { color: var(--vf-texto); }
.crm-ficha-cuerpo { overflow-y: auto; padding: 14px 20px 24px; flex: 1; }
.crm-etapa-sel { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.crm-etapa-sel label { margin: 0; font-size: 12px; font-weight: 600; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .3px; }
.crm-etapa-sel .vf-select { flex: 1; height: 36px; font-weight: 600; }
.crm-rapidas { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.crm-rapidas .vf-btn-primary { margin-left: auto; }
.crm-cliente-ok { display: flex; gap: 10px; align-items: flex-start; background: var(--vf-ok-bg); border: 1px solid #bfe5cf; border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; font-size: 13px; color: #14532d; }
.crm-cliente-ok > .fa { font-size: 20px; color: var(--vf-ok); }
.crm-cliente-links { margin-top: 4px; font-size: 12.5px; }
.crm-cliente-links a { color: var(--vf-azul); font-weight: 500; }
.crm-bloque { margin-top: 16px; }
.crm-bloque-tit { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); margin-bottom: 8px; }
.crm-bloque-tit .vf-btn-link { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 12.5px; }
.crm-composer { border: 1px solid var(--vf-borde); border-radius: 10px; overflow: hidden; }
.crm-composer-tabs { display: flex; background: var(--vf-fondo); border-bottom: 1px solid var(--vf-borde); }
.crm-composer-tabs button { flex: 1; border: none; background: none; padding: 9px 6px; font-size: 12.5px; color: var(--vf-suave); cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; }
.crm-composer-tabs button.activo { color: var(--vf-azul); border-bottom-color: var(--vf-azul); font-weight: 600; background: #fff; }
.crm-composer-cuerpo { padding: 10px 12px 12px; }
.crm-composer-fila { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; align-items: center; }
.crm-composer-fila .vf-select { width: auto; height: 34px; }
.crm-composer-fila input[type=date], .crm-composer-fila input[type=time] { height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 4px 8px; font-size: 13px; }
.crm-composer textarea, .crm-pregunta textarea, .crm-pregunta input[type=text] { width: 100%; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 8px 10px; font-size: 13.5px; resize: vertical; font-family: inherit; color: var(--vf-texto); }
.crm-composer textarea:focus, .crm-pregunta textarea:focus, .crm-pregunta input[type=text]:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.12); }
.crm-composer-pie { display: flex; justify-content: flex-end; margin-top: 8px; }
.crm-atajos { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.crm-atajos button { border: 1px solid var(--vf-borde); background: #fff; border-radius: 14px; padding: 2px 10px; font-size: 12px; cursor: pointer; color: var(--vf-texto); }
.crm-atajos button:hover { border-color: var(--vf-turquesa); color: var(--vf-turquesa); }
.crm-pregunta .modal-dialog { width: 420px; max-width: calc(100% - 20px); }
.crm-pregunta #mp_texto { font-size: 13.5px; line-height: 1.55; margin-bottom: 10px; }
.crm-pregunta .crm-atajos { margin: 8px 0 0; }
.vf-btn.crm-btn-peligro { background: var(--vf-error) !important; border-color: var(--vf-error) !important; color: #fff !important; }

/* Historial */
.crm-h-sub { font-size: 11.5px; font-weight: 700; color: #8a5300; text-transform: uppercase; letter-spacing: .3px; margin: 2px 0 6px; }
.crm-h-pend { background: #fffaf0; border: 1px solid #f3e2bd; border-radius: 10px; padding: 8px 10px 4px; margin-bottom: 12px; }
.crm-h { display: flex; gap: 10px; padding: 8px 0; position: relative; }
.crm-h-tarea { padding: 6px 0; border-top: 1px solid #f3e7cc; }
.crm-h-tarea:first-of-type { border-top: 0; }
.crm-h-tarea.crm-vencida .crm-h-fecha { color: var(--vf-error); font-weight: 600; }
.crm-h-tarea.crm-hoy .crm-h-fecha { color: #8a5300; font-weight: 600; }
.crm-linea .crm-h { padding-left: 0; }
.crm-linea .crm-h:not(:last-child)::before { content: ""; position: absolute; left: 13px; top: 34px; bottom: -6px; width: 2px; background: #edf1f6; }
.crm-h-ico { width: 28px; height: 28px; border-radius: 50%; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; flex: none; font-size: 13px; position: relative; z-index: 1; }
.crm-h-N .crm-h-ico { background: #fff4d6; color: #a26b00; }
.crm-h-O .crm-h-ico { background: var(--vf-ok-bg); color: var(--vf-ok); }
.crm-h-sis .crm-h-ico { background: #f1f4f8; color: #8a97a8; }
.crm-h-sis .crm-h-cab b { font-weight: 500; color: var(--vf-suave); }
.crm-h-cuerpo { flex: 1; min-width: 0; }
.crm-h-cab { display: flex; align-items: baseline; gap: 8px; font-size: 13px; }
.crm-h-fecha { font-size: 11.5px; color: #9aa8ba; white-space: nowrap; }
.crm-h-borrar { margin-left: auto; border: none; background: none; color: #b8c4d3; cursor: pointer; padding: 0 2px; font-size: 13px; opacity: 0; transition: opacity .15s; }
.crm-h-borrar + .crm-h-borrar { margin-left: 4px; }
.crm-h:hover .crm-h-borrar { opacity: 1; }
.crm-h-borrar:hover { color: var(--vf-error); }
.crm-h-txt { font-size: 13px; line-height: 1.5; color: var(--vf-texto); margin-top: 2px; word-break: break-word; }
.crm-h-sis .crm-h-txt { color: var(--vf-suave); font-size: 12.5px; }
.crm-h-vacio { font-size: 13px; color: var(--vf-suave); padding: 6px 0; }
.crm-datos { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 6px 12px; margin: 0; font-size: 13px; }
.crm-datos dt { color: var(--vf-suave); font-weight: 500; }
.crm-datos dd { margin: 0; word-break: break-word; }
.crm-ficha-pie { margin-top: 24px; padding-top: 12px; border-top: 1px solid var(--vf-borde); }
.crm-borrar { color: var(--vf-error) !important; font-size: 12.5px; }

/* Ventanas: lead, pasar a cliente, importar */
.crm-grid { margin-bottom: 14px; }
.crm-grid .crm-full { grid-column: 1 / -1; }
.vf-modal .vf-field textarea { width: 100%; border: 1px solid #cfd8e3; border-radius: 4px; padding: 7px 10px; font-size: 13.5px; font-family: inherit; resize: vertical; }
.vf-modal .vf-field input[type=text] { height: 38px; }
.vf-modal .vf-field.invalido input, .vf-modal .vf-field.invalido textarea { border-color: var(--vf-error); }
.crm-mas { border-top: 1px solid var(--vf-borde); padding-top: 10px; }
.crm-mas summary { cursor: pointer; font-size: 13px; color: var(--vf-turquesa); font-weight: 500; margin-bottom: 12px; outline: none; }
.crm-mc-tabla { width: 100%; font-size: 13.5px; margin-bottom: 10px; }
.crm-mc-tabla th { width: 110px; color: var(--vf-suave); font-weight: 500; padding: 5px 0; vertical-align: top; }
.crm-mc-tabla td { padding: 5px 0; word-break: break-word; }
.crm-mc-aviso { background: var(--vf-aviso-bg); color: #6b4300; border-radius: 6px; padding: 8px 10px; font-size: 12.5px; margin-top: 6px; line-height: 1.5; }
.crm-mc-aviso.crm-mc-err { background: var(--vf-error-bg); color: #7f1d1d; }
.crm-mc-aviso.crm-mc-dup { background: var(--vf-info-bg); color: var(--vf-azul); }
.crm-mc-ok { display: flex; gap: 12px; align-items: flex-start; background: var(--vf-ok-bg); border-radius: 8px; padding: 12px 14px; color: #14532d; font-size: 13.5px; line-height: 1.5; }
.crm-mc-ok > .fa { font-size: 24px; color: var(--vf-ok); }
.crm-mc-siguientes { display: grid; gap: 8px; margin-top: 14px; }
.crm-mc-op { display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; padding: 10px 12px; border: 1px solid var(--vf-borde); border-radius: 8px; color: var(--vf-texto) !important; text-decoration: none !important; }
.crm-mc-op:hover { border-color: var(--vf-turquesa); box-shadow: 0 2px 8px rgba(27,121,155,.12); }
.crm-mc-op .fa { grid-row: 1 / span 2; font-size: 18px; color: var(--vf-turquesa); align-self: center; text-align: center; }
.crm-mc-op b { font-size: 13.5px; color: var(--vf-azul); }
.crm-mc-op span { font-size: 12px; color: var(--vf-suave); }
.crm-imp-pasos { display: flex; gap: 8px; flex-wrap: wrap; }
.crm-file { position: relative; overflow: hidden; cursor: pointer; margin: 0; }
.crm-file input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.crm-imp-res { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--vf-borde); border-radius: 8px; font-size: 13px; display: grid; gap: 6px; }
.crm-imp-prev { border-top: 1px dashed var(--vf-borde); padding-top: 6px; display: grid; gap: 3px; }

/* Configuración (campos_crm.php) */
.crm-cfg-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.crm-et { display: grid; grid-template-columns: 22px 34px minmax(0, 1fr) 150px 70px 34px; gap: 8px; align-items: center; padding: 8px 16px; border-top: 1px solid #eef1f5; background: #fff; }
.crm-et:first-child { border-top: 0; }
.crm-et.crm-et-arrastrando { opacity: .5; }
.crm-et.crm-et-sobre { box-shadow: 0 -2px 0 var(--vf-turquesa) inset; }
.crm-et-mover { color: #b8c4d3; cursor: grab; text-align: center; }
.crm-et input[type=color] { width: 30px; height: 30px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 2px; background: #fff; cursor: pointer; }
.crm-et input[type=text] { height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 4px 9px; font-size: 13.5px; width: 100%; }
.crm-et .vf-select { height: 34px; }
.crm-et-n { font-size: 12px; color: var(--vf-suave); text-align: right; white-space: nowrap; }
.crm-et-borrar { border: none; background: none; color: #b8c4d3; cursor: pointer; font-size: 15px; }
.crm-et-borrar:hover { color: var(--vf-error); }
.crm-et.crm-cambiado input[type=text] { border-color: var(--vf-turquesa); background: #f5fbfd; }
.crm-cfg-pie { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--vf-borde); background: var(--vf-fondo); flex-wrap: wrap; }
.crm-cfg-body { padding: 14px 16px; }
.crm-cfg-body .vf-field { margin-bottom: 12px; }
.crm-cfg-body .vf-field input[type=text] { width: 100%; height: 36px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; }

@media (max-width: 900px) {
    .crm-cfg-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .crm-embudo { padding: 10px; gap: 10px; min-height: 300px; scroll-snap-type: x mandatory; }
    .crm-col { flex-basis: 84vw; scroll-snap-align: start; max-height: none; }
    .crm-toolbar .vf-select { max-width: none; flex: 1 1 45%; }
    .crm-t { grid-template-columns: 30px minmax(0, 1fr); gap: 6px 10px; }
    .crm-t-cuando { grid-column: 2; }
    .crm-t-acc { grid-column: 2; }
    .crm-ficha { width: 100%; }
    .crm-ficha-cab { padding: 14px 14px 12px; }
    .crm-ficha-cuerpo { padding: 12px 14px 24px; }
    .crm-rapidas .vf-btn-primary { margin-left: 0; }
    .crm-datos { grid-template-columns: 1fr; gap: 0 0; }
    .crm-datos dd { margin-bottom: 8px; }
    .crm-et { grid-template-columns: 18px 32px minmax(0, 1fr) 34px; padding: 10px 12px; }
    .crm-et .vf-select { grid-column: 3; }
    .crm-et-n { grid-column: 3; text-align: left; }
    .crm-et-borrar { grid-row: 1; grid-column: 4; }
}
.crm-ficha .vf-btn .fa, .crm-page .vf-btn .fa, .vf-modal .vf-btn .fa, .crm-composer-tabs .fa { width: auto !important; margin: 0 3px 0 0 !important; }
.crm-ficha .vf-btn, .crm-composer-pie .vf-btn { display: inline-flex; align-items: center; gap: 4px; }

/* CRM (2) 15/10/2026 — formulario web y avisos (campos_crm.php) */
.crm-cfg-ancha { grid-column: 1 / -1; }
.crm-cw-activar { margin-bottom: 14px; font-size: 14px; }
.crm-cw-enlace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 18px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 8px; padding: 12px 14px 4px; margin-bottom: 16px; }
.crm-cw-enlace.crm-cw-off { opacity: .55; }
.crm-cw-copiar { display: flex; gap: 6px; align-items: flex-start; }
.crm-cw-copiar input, .crm-cw-copiar textarea { flex: 1; min-width: 0; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 9px; font-size: 12.5px; background: #fff; font-family: Menlo, Consolas, monospace; color: var(--vf-texto); }
.crm-cw-copiar input { height: 32px; }
.crm-cw-copiar textarea { resize: none; height: 64px; }
.crm-cw-copiar .vf-btn { white-space: nowrap; }
.crm-cw-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 0 22px; }
.crm-cfg-body .vf-field textarea { width: 100%; border: 1px solid #cfd8e3; border-radius: 4px; padding: 7px 10px; font-size: 13.5px; font-family: inherit; resize: vertical; color: var(--vf-texto); }
.crm-cw-datos { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 4px 12px; }
.crm-cw-datos > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; border-top: 1px solid #eef1f5; font-size: 13.5px; min-height: 40px; }
.crm-cw-datos > div:first-child { border-top: 0; }
.crm-cw-datos .vf-select { width: 140px; height: 32px; }
.crm-cw-datos #cw_campos { display: block; padding: 0; border-top: 0; }
.crm-cw-datos #cw_campos label { display: flex; padding: 7px 0; border-top: 1px solid #eef1f5; }
.crm-cw-stats { margin-top: 14px; font-size: 13px; color: var(--vf-suave); background: var(--vf-info-bg); border-radius: 6px; padding: 8px 10px; }
.crm-cw-stats .fa { color: var(--vf-turquesa); }
.crm-cw-op { display: flex; margin-bottom: 10px; line-height: 1.4; }
@media (max-width: 900px) { .crm-cw-enlace, .crm-cw-grid { grid-template-columns: minmax(0, 1fr); } }


/* =============================================================================
   CRM (3) 15/10/2026 — Clientes en riesgo de baja (crm_riesgo.php)
   Usa además los estilos del CRM (crm-*)
   ============================================================================= */
.rg-revisado { font-size: 12.5px; color: var(--vf-suave); margin: -4px 0 12px; }
.rg-revisado .fa { color: var(--vf-ok); margin-right: 4px; }
.rg-page #rg_banner .vf-banner { margin-bottom: 14px; }
.rg-kpis .vf-kpi { cursor: pointer; }
.rg-fila.rg-n-A { box-shadow: inset 3px 0 0 #c0392b; }
.rg-fila.rg-n-M { box-shadow: inset 3px 0 0 #d68910; }
.rg-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 2px; }
.rg-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 10px; background: var(--vf-gris-bg); color: #4a5b6e; white-space: nowrap; }
.rg-chip .fa { font-size: 10.5px; }
.rg-chip.rg-DEV, .rg-chip.rg-DEU, .rg-chip.rg-BLQ, .rg-chip.rg-MAN { background: var(--vf-error-bg); color: var(--vf-error); }
.rg-chip.rg-TAR, .rg-chip.rg-FIN { background: var(--vf-aviso-bg); color: var(--vf-aviso); }
.rg-chip.rg-BAJ { background: var(--vf-info-bg); color: var(--vf-info); }
.rg-debe { color: var(--vf-error) !important; }

/* Ficha */
.rg-estado { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; background: #f6f8fb; border: 1px solid var(--vf-borde); border-radius: 8px; margin-bottom: 12px; }
.rg-estado-btns { display: flex; flex-wrap: wrap; gap: 6px; }
.rg-estado .vf-btn.rg-btn-ok { border-color: #a9dcc1; color: var(--vf-ok); }
.rg-estado .vf-btn.rg-btn-ok:hover { background: var(--vf-ok-bg); }
.rg-motivo { display: flex; gap: 10px; padding: 10px 12px; border-radius: 8px; background: #fdf6f5; border: 1px solid #f5d5d0; margin-bottom: 8px; }
.rg-motivo > .fa { color: var(--vf-error); font-size: 16px; margin-top: 2px; width: 18px; text-align: center; }
.rg-motivo.rg-TAR, .rg-motivo.rg-FIN { background: #fffaf0; border-color: #f3dcb0; }
.rg-motivo.rg-TAR > .fa, .rg-motivo.rg-FIN > .fa { color: var(--vf-aviso); }
.rg-motivo.rg-BAJ { background: #f2f9fb; border-color: #c7e3ec; }
.rg-motivo.rg-BAJ > .fa { color: var(--vf-info); }
.rg-motivo b { font-weight: 600; color: var(--vf-texto); }
.rg-que { font-size: 12.5px; color: #4a5b6e; margin-top: 4px; line-height: 1.45; }
.rg-que .fa { color: #d4a017; margin-right: 3px; }
.rg-prox-actual { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px; padding: 8px 10px; margin-bottom: 8px; background: var(--vf-info-bg); border-radius: 6px; font-size: 13px; }
.rg-linea { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid #eef1f5; font-size: 13px; }
.rg-linea:first-child { border-top: none; }
.rg-imp { white-space: nowrap; font-weight: 600; color: var(--vf-texto); }
.rg-extra { font-size: 12px; color: var(--vf-error); font-weight: 600; }
.rg-tarjeta .fa { color: var(--vf-suave); margin-right: 4px; }
.rg-mas { font-size: 12.5px; padding-top: 6px; }

/* Configuración */
.rg-cfg-op { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; padding: 10px 0; border-top: 1px solid #eef1f5; margin: 0; cursor: pointer; line-height: 1.5; }
.rg-cfg-op:first-child { border-top: none; }
.rg-cfg-op input[type=checkbox] { opacity: 1 !important; position: static !important; float: none !important; margin: 4px 0 0 !important; flex: 0 0 auto; }
.rg-cfg-principal { padding-bottom: 14px; }
.rg-cfg-email { border-top: 2px solid var(--vf-borde); margin-top: 6px; padding-top: 14px; }
.rg-num { width: 64px; padding: 2px 6px; border: 1px solid var(--vf-borde); border-radius: 4px; text-align: right; display: inline-block; }
.rg-off { opacity: .45; pointer-events: none; }

@media (max-width: 600px) {
    .rg-estado { flex-direction: column; align-items: flex-start; }
    .rg-chip { font-size: 10.5px; }
}
.rg-total { border-top: 2px solid var(--vf-borde); }
.rg-imp .vf-sub { font-weight: 400; font-size: 11px; text-align: right; }
.rg-como h5 { color: #01397F; font-weight: 600; font-size: 14.5px; margin: 16px 0 6px; }
.rg-como h5:first-child { margin-top: 0; }
.rg-como ul { padding-left: 18px; margin: 0 0 6px; }
.rg-como li { margin-bottom: 4px; line-height: 1.45; }
.rg-como-tabla { width: 100%; border-collapse: collapse; font-size: 13px; margin-bottom: 8px; }
.rg-como-tabla th { background: #f6f8fb; color: var(--vf-suave); font-weight: 600; text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--vf-borde); }
.rg-como-tabla td { padding: 7px 8px; border-bottom: 1px solid #eef1f5; vertical-align: top; line-height: 1.45; }
.rg-como-tabla td:first-child { white-space: nowrap; font-weight: 600; }
@media (max-width: 600px) { .rg-como-tabla td:first-child { white-space: normal; } }
.rg-pdf { margin-top: 5px; }
.rg-pdf .vf-btn-pdf { padding: 2px 8px; font-size: 11.5px; }
.rg-nota { font-size: 12.5px; color: #0f5468; background: var(--vf-info-bg); border-radius: 6px; padding: 7px 10px; margin-bottom: 6px; line-height: 1.45; }
.rg-nota { font-size: 12.5px; color: #0f5468; background: var(--vf-info-bg); border-radius: 6px; padding: 7px 10px; margin-bottom: 6px; line-height: 1.45; }
.rg-pasado .rg-chip, .rg-pasado.rg-chips .rg-chip { background: var(--vf-gris-bg) !important; color: var(--vf-suave) !important; }
#rf_motivos.rg-pasado .rg-motivo { background: #f6f8fb; border-color: var(--vf-borde); }
#rf_motivos.rg-pasado .rg-motivo > .fa { color: var(--vf-suave); }
#rf_motivos.rg-pasado .rg-que { display: none; }

/* 15/10/2026 (6): detalle al pasar el ratón por el riesgo o el motivo */
.rg-tipzona { cursor: help; }
.rg-tip { position: fixed; z-index: 2000; display: none; width: 420px; max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow: auto; background: #fff; border: 1px solid var(--vf-borde); border-radius: 10px; box-shadow: 0 10px 30px rgba(16, 40, 70, .18); padding: 12px 14px; font-size: 12.5px; color: var(--vf-texto); line-height: 1.45; pointer-events: none; }
.rg-tip-cab { display: flex; align-items: center; gap: 8px; font-size: 13.5px; margin-bottom: 4px; }
.rg-tip-pts { font-weight: 600; color: #4a5b6e; margin-bottom: 8px; }
.rg-tip-pts span { font-weight: 400; color: var(--vf-suave); font-size: 11.5px; }
.rg-ficha-pts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rg-tip-mot { display: flex; gap: 9px; padding: 8px 0; border-top: 1px solid #eef1f5; }
.rg-tip-mot > .fa { color: var(--vf-error); width: 16px; text-align: center; margin-top: 2px; }
.rg-tip-mot.rg-TAR > .fa, .rg-tip-mot.rg-FIN > .fa { color: var(--vf-aviso); }
.rg-tip-mot.rg-BAJ > .fa { color: var(--vf-info); }
.rg-tip-tit { font-weight: 600; }
.rg-tip-tit b, .rg-mot-pts { color: var(--vf-error); }
.rg-tip-mot ul { padding-left: 16px; margin: 2px 0 0; }
.rg-tip-mot li { margin-bottom: 2px; }
.rg-tip-desg { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.rg-tip-desg span { background: #f6f8fb; border: 1px solid #eef1f5; border-radius: 10px; padding: 1px 7px; font-size: 11px; color: #4a5b6e; }
.rg-tip-pie { border-top: 1px solid #eef1f5; padding-top: 8px; color: #4a5b6e; }
.rg-tip-mas { margin-top: 6px; color: var(--vf-suave); font-size: 11.5px; }
.rg-mot-pts { float: right; font-weight: 700; font-size: 12px; margin-left: 8px; }
@media (hover: none) { .rg-tip { display: none !important; } .rg-tipzona { cursor: inherit; } }


/* =============================================================================
   CONTRATOS: CHECKS ACEPTADOS Y RECHAZADOS 15/10/2026 (clientes_contratos_rechazados.php)
   ============================================================================= */
.ck-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ck-page .vf-toolbar .vf-select { flex: 0 1 auto; max-width: 280px; }
.ck-page .inf-fila:not(.inf-cab) > div { align-self: start; }
.ck-kpis .vf-kpi { cursor: pointer; }
.ck-resumen { padding: 14px 16px; }
.ck-resumen-tit { font-weight: 600; color: #01397F; font-size: 14.5px; margin-bottom: 4px; }
.ck-resumen-tit .fa { margin-right: 4px; }
.ck-res { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(220px, 1fr); gap: 8px 24px; align-items: center; padding: 10px 0; border-top: 1px solid #eef1f5; }
.ck-res:first-child { border-top: none; }
.ck-res-txt { font-size: 13px; line-height: 1.45; color: var(--vf-texto); }
.ck-num { display: inline-block; font-size: 11px; font-weight: 600; color: var(--vf-suave); background: var(--vf-gris-bg); border-radius: 10px; padding: 1px 7px; white-space: nowrap; }
.ck-res-datos .inf-barra { height: 9px; margin: 0 0 6px; }
.inf-barra .ck-b-ok { background: var(--vf-ok); }
.inf-barra .ck-b-no { background: var(--vf-error); }
.ck-res-num { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; }
.ck-res-num .vf-btn-link { padding: 0; font-size: 12.5px; }
.ck-res-num .ck-ok { color: var(--vf-ok); }
.ck-res-num .ck-no { color: var(--vf-error); }
.ck-res-num .vf-btn-link[disabled] { color: var(--vf-suave); opacity: .7; cursor: default; text-decoration: none; }
.ck-fila.ck-fila-no { box-shadow: inset 3px 0 0 var(--vf-error); }
.ck-fila.ck-fila-si { box-shadow: inset 3px 0 0 var(--vf-ok); }
.ck-cli { color: var(--vf-texto); }
.ck-cli:hover { color: var(--vf-turquesa); }
.ck-contacto a { color: var(--vf-turquesa); }
.ck-lista { list-style: none; margin: 0; padding: 0; }
.ck-lista li { display: flex; gap: 7px; padding: 3px 0; font-size: 12.5px; line-height: 1.4; }
.ck-lista li > .fa { font-size: 15px; margin-top: 1px; width: 16px; text-align: center; }
.ck-lista .ck-si > .fa, .ck-lista .ck-si .ck-estado { color: var(--vf-ok); }
.ck-lista .ck-no > .fa, .ck-lista .ck-no .ck-estado { color: var(--vf-error); }
.ck-estado { font-weight: 600; }
.ck-texto { color: #4a5b6e; }
.ck-lista .ck-elegido { background: #f6f8fb; border-radius: 6px; padding: 3px 6px; margin: 0 -6px; }
.ck-info { color: var(--vf-suave); cursor: help; margin-top: 2px; }
.ck-firmado { color: var(--vf-ok); }
.ck-pdf { display: inline-block; margin-top: 3px; font-size: 12.5px; color: var(--vf-turquesa); }
.ck-pdf .fa { color: #D9302A; margin-right: 3px; }
@media (max-width: 991px) {
    .ck-res { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .ck-kpis { grid-template-columns: 1fr 1fr; }
    .ck-kpis .vf-kpi:last-child { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
    .ck-page .inf-fila > div:nth-child(2) { grid-column: 1 / -1; }
}


/* =============================================================================
   APLAZAR FACTURAS 15/10/2026 (enlaces_deudas.php, asistente_deudas.php, configuracion_deudas.php)
   y página pública ext_deudas.php (.ext-apl)
   ============================================================================= */
.apl-rojo { color: var(--vf-error) !important; }
.apl-verde { color: var(--vf-ok) !important; }
.apl-kpis .vf-kpi { cursor: pointer; }
.apl-fila.apl-atn { box-shadow: inset 3px 0 0 var(--vf-error); }
.apl-fila.apl-e-CO { box-shadow: inset 3px 0 0 var(--vf-ok); }
.apl-acc .vf-acciones { justify-content: flex-end; }
.apl-prog { height: 6px; border-radius: 3px; background: var(--vf-gris-bg); margin: 6px 0 2px; overflow: hidden; max-width: 180px; }
.apl-prog span { display: block; height: 100%; background: var(--vf-ok); border-radius: 3px; }
.apl-msg { color: var(--vf-turquesa); }
.apl-copiado { border-color: #a9dcc1 !important; color: var(--vf-ok) !important; }
.apl-num { text-align: right; }
.apl-check { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; margin: 0; cursor: pointer; }
.apl-page input[type=checkbox], .apl-page input[type=radio] { opacity: 1 !important; position: static !important; float: none !important; margin: 0 !important; width: 16px; height: 16px; flex: 0 0 auto; }
.apl-h5 { color: #01397F; font-weight: 600; font-size: 14.5px; margin: 18px 0 8px; }
.apl-btn-borrar { color: var(--vf-error); }

/* Detalle */
.apl-m-estado { padding: 10px 12px; border-radius: 8px; background: #f6f8fb; border: 1px solid var(--vf-borde); }
.apl-m-estado .vf-sub { margin-top: 4px; }
.apl-cal { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 6px; margin-bottom: 8px; }
.apl-cuota { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 6px 8px; font-size: 12.5px; display: flex; flex-direction: column; }
.apl-cuota span { color: var(--vf-suave); font-size: 11px; }
.apl-cuota em { font-style: normal; color: var(--vf-suave); font-size: 11.5px; }
.apl-cuota.apl-pagada { background: var(--vf-ok-bg); border-color: #a9dcc1; }
.apl-cuota.apl-pagada em { color: var(--vf-ok); }
.apl-ops { display: flex; flex-wrap: wrap; gap: 8px; }
.apl-op-mini { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 6px 10px; display: flex; flex-direction: column; font-size: 13px; }
.apl-lineas { border: 1px solid var(--vf-borde); border-radius: 8px; }
.apl-linea { display: flex; justify-content: space-between; gap: 10px; padding: 8px 12px; border-top: 1px solid #eef1f5; font-size: 13px; }
.apl-linea:first-child { border-top: none; }
.apl-linea.apl-total { background: #f6f8fb; }
.apl-imp { white-space: nowrap; text-align: right; font-weight: 600; }
.apl-tipo { display: inline-block; font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 10px; background: var(--vf-gris-bg); color: #4a5b6e; white-space: nowrap; }
.apl-tipo.apl-t-R { background: var(--vf-error-bg); color: var(--vf-error); }
.apl-tipo.apl-t-F { background: var(--vf-info-bg); color: var(--vf-info); }
.apl-mensaje { display: flex; gap: 8px; padding: 8px 10px; border-radius: 8px; background: var(--vf-info-bg); margin-bottom: 6px; font-size: 13px; }
.apl-mensaje > .fa { color: var(--vf-info); margin-top: 3px; }
.apl-enlace { display: flex; gap: 6px; flex-wrap: wrap; }
.apl-enlace input { flex: 1 1 260px; min-width: 0; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 5px 8px; font-size: 12.5px; background: #f6f8fb; }

/* Configuración */
.apl-opciones { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; padding: 14px 16px; }
.apl-opcion { border: 1px solid var(--vf-borde); border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; background: #fff; }
.apl-opcion.apl-no-aplica { background: #fafbfd; }
.apl-op-cab { display: flex; align-items: center; gap: 10px; }
.apl-op-n { width: 38px; height: 38px; border-radius: 50%; background: #01397F; color: #fff; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; flex: 0 0 auto; }
.apl-no-aplica .apl-op-n { background: #b8c2ce; }
.apl-op-ej { font-size: 13.5px; }
.apl-op-pie { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px; border-top: 1px solid #eef1f5; padding-top: 8px; font-size: 12.5px; }
.apl-num-ej { width: 90px; display: inline-block; border: 1px solid var(--vf-borde); border-radius: 5px; padding: 2px 6px; }
.apl-rango { display: flex; align-items: center; gap: 6px; }
.apl-rango input { min-width: 0; }
.apl-rango span { color: var(--vf-suave); font-size: 12.5px; }
.apl-prev { margin-top: 14px; padding: 10px 12px; background: var(--vf-info-bg); border-radius: 8px; font-size: 13px; }
.apl-prev-cal { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 6px; font-size: 12px; color: #0f5468; }
.apl-como { padding: 14px 18px; }
.apl-como h5 { color: #01397F; font-weight: 600; margin: 0 0 6px; }
.apl-como ul { margin: 0; padding-left: 18px; font-size: 13px; color: #4a5b6e; }
.apl-como li { margin-bottom: 4px; }

/* Nuevo aplazamiento: pasos */
.apl-pasos { display: flex; gap: 6px; list-style: none; padding: 0; margin: 0 0 14px; }
.apl-pasos li { flex: 1 1 0; display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; color: var(--vf-suave); font-weight: 500; font-size: 13.5px; }
.apl-pasos li span { width: 24px; height: 24px; border-radius: 50%; background: var(--vf-gris-bg); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; flex: 0 0 auto; }
.apl-pasos li.activo { border-color: #01397F; color: #01397F; box-shadow: 0 0 0 1px #01397F inset; }
.apl-pasos li.activo span { background: #01397F; color: #fff; }
.apl-pasos li.hecho span { background: var(--vf-ok); color: #fff; }
.apl-modos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 16px; }
.apl-modo { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left; padding: 14px 16px; border: 1px solid var(--vf-borde); border-radius: 10px; background: #fff; color: var(--vf-texto); }
.apl-modo .fa { font-size: 20px; color: var(--vf-suave); margin-bottom: 4px; }
.apl-modo span { font-size: 12.5px; color: var(--vf-suave); }
.apl-modo.activo { border-color: #01397F; box-shadow: 0 0 0 1px #01397F inset; background: #f5f8fd; }
.apl-modo.activo .fa { color: #01397F; }
.na-res { display: flex; flex-direction: column; padding: 0 16px 6px; }
.na-cli { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: none; border-top: 1px solid #eef1f5; background: #fff; text-align: left; width: 100%; }
.na-cli:hover { background: #f5f8fd; }
.na-cli b { flex: 0 1 auto; }
.na-cli .vf-sub { flex: 1 1 auto; min-width: 0; }
.na-cli .fa { color: var(--vf-suave); }
.na-pista { padding: 0 16px 10px; }
.na-alta-link { padding: 8px 16px 14px; }
.na-alta { margin: 0 16px 16px; padding: 14px; }
.na-alta-pie { text-align: right; margin-top: 8px; }
.na-vlista { display: flex; flex-direction: column; }
.na-vcli, .na-item { display: grid; grid-template-columns: auto minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 16px; border-top: 1px solid #eef1f5; margin: 0; font-weight: 400; cursor: pointer; }
.na-item { grid-template-columns: auto minmax(0, 1fr) auto; padding: 8px 12px; }
.na-vcli.na-on { background: #f5f8fd; }
.na-dis { opacity: .55; cursor: default; }
.na-vcli-n, .na-item-t { display: flex; flex-direction: column; min-width: 0; }
.na-vcli-i, .na-item-i { font-weight: 600; white-space: nowrap; text-align: right; }
.na-vcli-i .vf-sub { display: block; font-weight: 400; font-size: 11.5px; }
.na-concepto { padding: 14px 16px 4px; max-width: 640px; }
.na-qcli { margin: 10px 16px; border: 1px solid var(--vf-borde); border-radius: 10px; overflow: hidden; }
.na-qcli-cab { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 10px 12px; background: #f6f8fb; }
.na-qcli-cab > div:first-child { flex: 1 1 220px; display: flex; flex-direction: column; min-width: 0; }
.na-qcli-tot { font-weight: 700; font-size: 16px; color: #01397F; }
.na-items-cab { display: flex; justify-content: space-between; padding: 8px 12px 4px; font-size: 12px; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .3px; }
.na-items-cab span:last-child { text-transform: none; }
.na-otro { padding: 10px 12px; border-top: 1px solid #eef1f5; }
.na-otro label { font-weight: 500; font-size: 12.5px; color: var(--vf-suave); }
.na-otro-f { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.na-otro-f .apl-num { width: 120px; flex: 0 0 auto; }
.na-otro-f input:last-child { flex: 1 1 220px; min-width: 0; }
.na-qcli .rg-nota { margin: 10px 12px 0; }
.na-pls { display: flex; flex-direction: column; gap: 8px; padding: 12px 16px; }
.na-pl { display: grid; grid-template-columns: auto minmax(0, auto) minmax(0, 1fr) auto; gap: 14px; align-items: center; border: 1px solid var(--vf-borde); border-radius: 10px; padding: 10px 14px; }
.na-pl.na-on { border-color: #01397F; background: #f5f8fd; }
.na-pl-campos { display: flex; gap: 8px; }
.na-pl-campos label { display: flex; flex-direction: column; font-weight: 400; font-size: 11.5px; color: var(--vf-suave); margin: 0; }
.na-pl-campos input { width: 92px; height: 32px; padding: 4px 8px; }
.na-pl-ej { font-size: 13.5px; }
.na-pl-add { padding: 0 16px 12px; }
.na-pl-como { padding: 0 16px 14px; }
.na-res-cab { display: flex; flex-wrap: wrap; gap: 10px 30px; padding: 14px 16px; border-bottom: 1px solid #eef1f5; }
.na-res-cab > div { display: flex; flex-direction: column; }
.na-res-lista { display: flex; flex-direction: column; }
.na-res-cli { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) auto; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid #eef1f5; }
.na-res-op { display: flex; flex-wrap: wrap; gap: 4px; }
.na-res-i { font-weight: 700; white-space: nowrap; text-align: right; }
.apl-chip-op { font-size: 11.5px; padding: 2px 8px; border-radius: 10px; background: var(--vf-info-bg); color: #0f5468; white-space: nowrap; }
.na-enviar { padding: 14px 16px 2px; }
.na-enviar-sub { padding: 0 16px 14px 40px; }
.na-fin-cab { display: flex; gap: 12px; align-items: center; padding: 18px 16px; font-size: 15px; }
.na-fin-cab > .fa { font-size: 30px; color: var(--vf-ok); }
.na-fin-acc { padding: 14px 16px; border-top: 1px solid #eef1f5; }
.apl-navbar { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; gap: 12px; padding: 10px 14px; margin-top: 10px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 10px; box-shadow: 0 -4px 14px rgba(16, 40, 70, .06); }
.apl-nav-info { flex: 1 1 auto; text-align: center; font-size: 13px; color: #4a5b6e; }

@media (max-width: 991px) {
    .apl-pasos li { font-size: 12px; padding: 8px; }
    .na-pl { grid-template-columns: auto minmax(0, 1fr); }
    .na-pl-ej { grid-column: 2 / -1; }
}
@media (max-width: 600px) {
    .apl-pasos li { flex-direction: column; text-align: center; gap: 2px; font-size: 11px; }
    .apl-modos { grid-template-columns: 1fr; }
    .na-vcli { grid-template-columns: auto minmax(0, 1fr) auto; }
    .na-vcli-q { grid-column: 2 / 3; }
    .na-res-cli { grid-template-columns: minmax(0, 1fr) auto; }
    .na-res-op { grid-column: 1 / -1; }
    .na-pl-campos input { width: 74px; }
    .apl-opciones { grid-template-columns: 1fr; }
}

/* Página pública del aplazamiento (ext_deudas.php) */
body.ext-apl { background: #f2f5f9; font-family: Roboto, "Helvetica Neue", Arial, sans-serif; color: #2c3e50; }
.ext-apl-wrap { max-width: 560px; margin: 0 auto; padding: 24px 16px 40px; }
.ext-apl-logo { text-align: center; margin-bottom: 18px; }
.ext-apl-logo img { max-height: 48px; max-width: 220px; }
.ext-apl-card { background: #fff; border-radius: 14px; box-shadow: 0 6px 24px rgba(16, 40, 70, .08); padding: 22px 20px; border-top: 4px solid var(--apl-color, #01397F); }
.ext-apl-cab { text-align: center; }
.ext-apl-cab p { margin: 0 0 6px; font-size: 15px; }
.ext-apl-importe { font-size: 34px; font-weight: 700; color: var(--apl-color, #01397F); line-height: 1.2; }
.ext-apl-concepto { color: #6b7a8c; margin-top: 2px; }
.ext-apl-vermas { border: none; background: none; color: #1B799B; font-size: 13.5px; padding: 6px 0; margin-top: 6px; }
.ext-apl-det { text-align: left; border: 1px solid #e3e8ef; border-radius: 10px; margin-top: 8px; }
.ext-apl-linea { display: flex; justify-content: space-between; gap: 10px; padding: 8px 12px; border-top: 1px solid #eef1f5; font-size: 13.5px; }
.ext-apl-linea:first-child { border-top: none; }
.ext-apl-linea span { display: block; color: #6b7a8c; font-size: 12px; }
.ext-apl-linea-i { white-space: nowrap; font-weight: 600; }
.ext-apl-pdf { border: none; background: none; color: #D9302A; padding: 0 0 0 6px; }
.ext-apl-h2 { font-size: 16px; font-weight: 600; margin: 22px 0 10px; }
.ext-apl-ops { display: flex; flex-direction: column; gap: 8px; }
.ext-apl-op { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1.5px solid #e3e8ef; border-radius: 12px; cursor: pointer; margin: 0; font-weight: 400; }
.ext-apl-op input { position: absolute; opacity: 0; pointer-events: none; }
.ext-apl-op-t { flex: 1 1 auto; display: flex; flex-direction: column; }
.ext-apl-op-t b { font-size: 16px; }
.ext-apl-op-t span { font-size: 13px; color: #6b7a8c; }
.ext-apl-op-total { font-size: 12px !important; }
.ext-apl-op > .fa { font-size: 22px; color: #d5dce5; }
.ext-apl-op.activo { border-color: var(--apl-color, #01397F); background: #f7f9fc; }
.ext-apl-op.activo > .fa { color: var(--apl-color, #01397F); }
.ext-apl-cal { display: none; margin-top: 10px; border-radius: 10px; background: #f6f8fb; padding: 8px 12px; font-size: 13px; }
.ext-apl-cal div { display: flex; justify-content: space-between; padding: 3px 0; border-top: 1px dashed #e3e8ef; }
.ext-apl-cal div:first-of-type { border-top: none; }
.ext-apl-cal-t { font-weight: 600; margin-bottom: 4px; }
.ext-apl-pagar { width: 100%; margin-top: 16px; border: none; border-radius: 10px; padding: 14px; font-size: 16px; font-weight: 600; color: #fff; background: var(--apl-color, #01397F); }
.ext-apl-pagar:disabled { opacity: .45; }
.ext-apl-sub { font-size: 12.5px; color: #6b7a8c; margin-top: 10px; text-align: center; }
.ext-apl-aviso { margin-top: 14px; padding: 10px 12px; border-radius: 10px; background: #e6f3f7; color: #0f5468; font-size: 13.5px; }
.ext-apl-desacuerdo { margin-top: 18px; border-top: 1px solid #eef1f5; padding-top: 8px; text-align: center; }
.ext-apl-desacuerdo textarea { width: 100%; border: 1px solid #e3e8ef; border-radius: 10px; padding: 10px; margin-top: 6px; font-size: 14px; }
.ext-apl-fb-pie { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; }
.ext-apl-enviar { border: 1px solid #e3e8ef; background: #fff; border-radius: 8px; padding: 7px 14px; }
.ext-apl-estado { text-align: center; padding: 10px 0; }
.ext-apl-estado > .fa { font-size: 44px; color: #b8c2ce; }
.ext-apl-estado.ext-ok > .fa { color: #1e8e5a; }
.ext-apl-estado h1 { font-size: 22px; font-weight: 600; line-height: 1.3; margin: 10px 0 8px; }
.ext-apl-prog { height: 8px; border-radius: 4px; background: #eef1f5; overflow: hidden; margin: 12px auto; max-width: 260px; }
.ext-apl-prog span { display: block; height: 100%; background: #1e8e5a; }
.ext-apl-pie { text-align: center; color: #8a99ab; font-size: 12px; margin-top: 18px; }
.apl-acc .vf-acciones { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.apl-como-t { color: #01397F; font-weight: 600; font-size: 14.5px; margin: 0 0 6px; }
.na-item-t .apl-tipo { margin-right: 4px; }

/* =============================================================================
   CLIENTES (15/10/2026): clientes.php, ficha_cliente.php, alta_cliente.php,
   importar_clientes.php (prefijo cl-)
   ============================================================================= */
.cl-page .vf-btn .fa, .cl-page .vf-chip .fa, .cl-page .vf-tag .fa, .cl-page .vf-kpi .fa { margin: 0 !important; width: auto; }
.cl-page .vf-banner a { font-weight: 600; text-decoration: underline; color: inherit; }
.cl-page .vf-banner .vf-btn { flex: none; }
.cl-page input[type=checkbox], .cl-page input[type=radio] { opacity: 1 !important; float: none !important; position: static !important; visibility: visible !important; width: 16px; height: 16px; margin: 0; display: inline-block !important; }
.cl-page .vf-search input:focus, .cl-page .vf-field input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.cl-oculto { display: none !important; }

/* Lista de clientes */
.cl-list .vf-row { grid-template-columns: 30px minmax(220px, 2fr) minmax(170px, 1.3fr) minmax(120px, .9fr) 150px 215px; align-items: center; cursor: pointer; }
.cl-c-acc .cl-alta { white-space: nowrap; }
.cl-list .vf-row.vf-row-head { cursor: default; }
.cl-list .vf-row-head .cl-c-debe, .cl-list .cl-c-debe { text-align: right; }
.cl-nom { font-weight: 600; color: var(--vf-azul); font-size: 14px; }
.cl-nom a { color: inherit; }
.cl-cod { font-family: Consolas, monospace; font-size: 11.5px; color: var(--vf-suave); margin-left: 6px; font-weight: 400; }
.cl-contacto { color: var(--vf-suave); font-size: 12px; margin-top: 2px; overflow-wrap: anywhere; }
.cl-contacto .fa { width: 13px; text-align: center; margin-right: 2px !important; color: #9aa8ba; }
.cl-pagos { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.cl-pagos .vf-badge { white-space: normal; text-align: left; }
.cl-activo { font-size: 12.5px; line-height: 1.5; }
.cl-activo b { font-variant-numeric: tabular-nums; }
.cl-nada { color: #9aa8ba; font-size: 12.5px; }
.cl-debe { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; color: var(--vf-error); }
.cl-debe.cero { color: #9aa8ba; font-weight: 400; font-size: 13px; }
.cl-c-acc { display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.cl-mas { position: relative; display: inline-block; }
.cl-mas .vf-menu { right: 0; left: auto; }
.cl-tag-cat { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 1px 7px; border-radius: 10px; background: #e6edf7; color: var(--vf-azul); margin-top: 4px; }
.cl-riesgo { margin-top: 4px; }
.cl-check { cursor: pointer; }
.cl-list .vf-row.seleccionada { background: #eef5fb !important; }
@media (max-width: 991px) {
    .cl-list .vf-row { grid-template-columns: 1fr 1fr; padding-left: 44px; }
    .cl-list .cl-c-check { position: absolute; left: 14px; top: 16px; }
    .cl-list .cl-c-cli, .cl-list .cl-c-acc { grid-column: 1 / -1; }
    .cl-list .cl-c-debe { text-align: left; }
    .cl-c-acc { justify-content: flex-start; }
}
@media (max-width: 600px) {
    .cl-page .vf-toolbar .vf-select { flex: 1 1 100%; width: 100%; }
    .cl-list .vf-row { grid-template-columns: 1fr; }
    .cl-mas { position: static; }
    .cl-mas .vf-menu { left: 12px; right: 12px; min-width: 0; }
}

/* Ficha del cliente */
.cl-head-tit { display: flex; gap: 14px; align-items: center; min-width: 0; }
.cl-head-tit .crm-avatar { width: 52px; height: 52px; font-size: 19px; background: var(--vf-azul); }
.cl-head-tit h2 { overflow-wrap: anywhere; }
.cl-head-sub { color: var(--vf-suave); font-size: 13px; margin-top: 3px; display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
.cl-head-sub .vf-badge { font-size: 11px; }
.cl-hacer { list-style: none; margin: 0; padding: 0; }
.cl-hacer li { padding: 3px 0; }
.cl-hacer li + li { border-top: 1px dashed rgba(0,0,0,.08); }
.cl-pane { display: none; padding: 16px; }
.cl-pane.activo { display: block; }
.cl-pane > .vf-card:last-child { margin-bottom: 0; }
.cl-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.cl-cols > .vf-card { margin-bottom: 0; }
.cl-bloque-tit { font-size: 12px; text-transform: uppercase; letter-spacing: .4px; font-weight: 700; color: var(--vf-azul); margin: 0 0 8px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cl-bloque-tit .vf-btn-link { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 12.5px; }
.cl-items { border: 1px solid var(--vf-borde); border-radius: 6px; overflow: hidden; }
.cl-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 10px 12px; border-top: 1px solid var(--vf-borde); font-size: 13px; align-items: start; }
.cl-item:first-child { border-top: none; }
/* 16/10/2026: sin opacity en la fila (dejaba el menú «Más» difuminado y por debajo de las filas siguientes) */
.cl-item.tenue .cl-item-tit, .cl-item.tenue .cl-item-sub, .cl-item.tenue .cl-item-imp, .cl-item.tenue .cl-item-der .vf-badge { opacity: .65; }
.cl-item-tit { font-weight: 600; overflow-wrap: anywhere; }
.cl-item-sub { color: var(--vf-suave); font-size: 12px; margin-top: 2px; line-height: 1.45; overflow-wrap: anywhere; }
.cl-item-der { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cl-item-der .vf-badge { margin-top: 3px; }
.cl-item-imp { font-weight: 700; }
.cl-item-acc { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.cl-vacio { padding: 18px 12px; text-align: center; color: var(--vf-suave); font-size: 13px; border: 1px dashed var(--vf-borde); border-radius: 6px; }
.cl-iban { font-family: Consolas, monospace; letter-spacing: .5px; }
.cl-tipo { display: inline-flex; border: 1px solid #cfd8e3; border-radius: 6px; overflow: hidden; }
.cl-tipo button { border: none; background: #fff; padding: 8px 16px; font-size: 13px; color: var(--vf-texto); cursor: pointer; }
.cl-tipo button + button { border-left: 1px solid #cfd8e3; }
.cl-tipo button.activo { background: var(--vf-azul); color: #fff; font-weight: 600; }
.cl-tipo button .fa { margin-right: 4px !important; }
.cl-switch { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; font-weight: 500; text-transform: none; }
.cl-field-ancho { grid-column: 1 / -1; }
.cl-page .vf-field textarea { width: 100%; min-height: 80px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 8px 10px; font-size: 13.5px; font-family: inherit; color: var(--vf-texto); resize: vertical; }
.cl-page .vf-field input[type=date], .cl-page .vf-field input[type=datetime-local], .cl-page .vf-field input[type=email], .cl-page .vf-field input[type=tel] {
    width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; color: var(--vf-texto);
}
.cl-page .vf-field input[disabled] { background: var(--vf-fondo); color: var(--vf-suave); }
.cl-page label.error { color: var(--vf-error); font-size: 11.5px; font-weight: 400; margin-top: 3px; display: block; text-transform: none; }
.cl-page input.error, .cl-page select.error { border-color: var(--vf-error) !important; }
.cl-plegable .vf-card-head { cursor: pointer; }
.cl-plegable .vf-card-head .cl-flecha { margin-left: auto; color: var(--vf-suave); transition: transform .15s; }
.cl-plegable.abierto .vf-card-head .cl-flecha { transform: rotate(180deg); }
.cl-plegable:not(.abierto) .vf-card-body { display: none; }
.cl-nota-txt { white-space: normal; font-size: 13px; line-height: 1.5; margin-top: 4px; overflow-wrap: anywhere; }
.cl-buscador { max-width: 720px; margin: 0 auto; }
.cl-buscador .vf-search input { height: 46px; font-size: 16px; padding-left: 38px; }
.cl-buscador .vf-search i { left: 14px; font-size: 16px; }
.cl-res { margin-top: 10px; }
.cl-res .cl-item { cursor: pointer; }
.cl-res .cl-item:hover { background: #fafcff; }
.cl-hecho { text-align: center; padding: 26px 16px; }
.cl-hecho > .fa { font-size: 46px; color: var(--vf-ok); }
.cl-hecho h3 { color: var(--vf-azul); font-size: 20px; margin: 10px 0 6px; font-weight: 600; }
.cl-siguientes { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-top: 18px; text-align: left; }
.cl-sig { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px; color: var(--vf-texto) !important; text-decoration: none !important; background: #fff; cursor: pointer; }
.cl-sig:hover { border-color: var(--vf-turquesa); box-shadow: 0 2px 8px rgba(1,57,127,.08); }
.cl-sig > .fa { font-size: 18px; color: var(--vf-turquesa); margin-top: 2px !important; width: 20px; text-align: center; }
.cl-sig b { display: block; font-size: 13.5px; color: var(--vf-azul); }
.cl-sig span { display: block; font-size: 12px; color: var(--vf-suave); margin-top: 2px; line-height: 1.4; }
.cl-dup { margin-top: 8px; }
@media (max-width: 991px) {
    .cl-cols { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .cl-pane { padding: 12px; }
    .cl-head-tit .crm-avatar { width: 42px; height: 42px; font-size: 16px; }
    .cl-tipo { display: flex; }
    .cl-tipo button { flex: 1; }
}

/* Importar clientes */
.cl-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cl-paso { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; background: #fff; }
.cl-paso-n { display: inline-flex; width: 22px; height: 22px; border-radius: 50%; background: var(--vf-azul); color: #fff; font-size: 12px; font-weight: 700; align-items: center; justify-content: center; margin-right: 6px; }
.cl-paso b { font-size: 13.5px; }
.cl-paso p { font-size: 12.5px; color: var(--vf-suave); margin: 6px 0 10px; line-height: 1.45; }
.cl-imp-list .vf-row { grid-template-columns: 50px minmax(200px, 1.6fr) minmax(170px, 1.2fr) minmax(160px, 1fr) minmax(220px, 1.4fr); align-items: start; }
.cl-imp-fila { font-family: Consolas, monospace; color: var(--vf-suave); font-size: 12px; }
.cl-prog { height: 10px; border-radius: 5px; background: var(--vf-gris-bg); overflow: hidden; margin: 8px 0; }
.cl-prog span { display: block; height: 100%; width: 0; background: var(--vf-ok); transition: width .2s; }
@media (max-width: 991px) {
    .cl-pasos { grid-template-columns: 1fr; }
    .cl-imp-list .vf-row { grid-template-columns: 1fr 1fr; }
    .cl-imp-list .cl-c-cli, .cl-imp-list .cl-c-est { grid-column: 1 / -1; }
}
@media (max-width: 600px) { .cl-imp-list .vf-row { grid-template-columns: 1fr; } }
.cl-page .vf-count:empty { display: none; }
.cl-page input.cl-oculto, .cl-page .cl-oculto input { display: none !important; }
.cl-page .vf-help { font-size: 12.5px; color: var(--vf-suave); line-height: 1.5; }
.cl-sig { text-align: left; width: 100%; font: inherit; }
/* custom.css pinta un check falso en la etiqueta que va detrás de un checkbox (input + label): en la zona de clientes no */
.cl-page input[type=checkbox] + label, .cl-page input[type=checkbox]:checked + label { background: none !important; padding: 0 !important; }
.cl-switch input[type=checkbox] { margin-right: 2px !important; }
/* Ventana «Cobrar con tarjeta» (clientes_modal_cargo_tarjeta.php) */
.ct-modal .vf-field input[type=text] { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; }
.ct-modal .vf-field select { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; }
.ct-imp { position: relative; }
.ct-imp input { padding-right: 34px !important; font-size: 18px !important; font-weight: 600; font-variant-numeric: tabular-nums; }
.ct-imp span { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--vf-suave); font-weight: 600; }
.ct-fijo { display: flex; align-items: center; min-height: 38px; padding: 0 10px; border: 1px dashed #cfd8e3; border-radius: 4px; background: var(--vf-fondo); font-size: 13px; }
.ct-ops { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.ct-op { display: flex; gap: 10px; align-items: flex-start; border: 1.5px solid var(--vf-borde); border-radius: 6px; padding: 10px 12px; cursor: pointer; margin: 0; font-weight: 400; text-transform: none; }
.ct-op:hover { border-color: var(--vf-turquesa); }
.ct-op.activo { border-color: var(--vf-azul); background: #f7faff; }
.ct-op.desactivada { opacity: .55; cursor: not-allowed; background: var(--vf-fondo); }
.ct-op > .fa { font-size: 18px; color: var(--vf-turquesa); width: 20px; text-align: center; margin-top: 1px !important; }
.ct-op b { display: block; font-size: 13.5px; color: var(--vf-texto); }
.ct-op span { display: block; font-size: 12px; color: var(--vf-suave); line-height: 1.4; margin-top: 2px; }
.vf-modal .vf-field label.ct-op { display: flex; position: relative; font-size: 13px; margin: 0; }
.ct-op input[type=radio] { position: absolute !important; opacity: 0 !important; pointer-events: none; width: 1px; height: 1px; }
.vf-modal .vf-field.invalido input { border-color: var(--vf-error); }
.ct-aviso { margin-top: 10px; padding: 8px 10px; border-radius: 6px; background: var(--vf-aviso-bg); color: #7a4a00; font-size: 12.5px; line-height: 1.45; }
/* 16/10/2026: acciones de la ficha (antes en Acceso rápido): ficha_cliente_acciones_vf.js */
.cl-items { overflow: visible; }
.cl-item-acc { align-items: center; gap: 6px 8px; margin-top: 4px; }
.cl-item-acc .vf-btn-link { padding: 0 4px; }
.fa-nota { margin-top: 6px; padding: 6px 9px; border-left: 3px solid #e8c547; background: #fffbea; border-radius: 0 4px 4px 0; color: #5b4a12; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.fa-nopuede { font-size: 12px; color: var(--vf-suave); }
.ct-op.ct-no { display: none !important; }
.fa-modal .vf-field input[type=text], .fa-modal .vf-field input[type=date], .fa-modal .vf-field select, .fa-modal .vf-field textarea { width: 100%; min-height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; }
.fa-modal .vf-field input:disabled { background: var(--vf-fondo); color: var(--vf-suave); }
.fa-modal .vf-field textarea { resize: vertical; line-height: 1.45; }
.fa-modal .vf-field .vf-err { display: none; color: var(--vf-error); font-size: 12px; margin-top: 3px; }
.fa-modal .vf-field.invalido .vf-err { display: block; }
.fa-modal .vf-field.invalido input, .fa-modal .vf-field.invalido textarea { border-color: var(--vf-error); }
.fa-meses { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.fa-mes { border: 1.5px solid var(--vf-borde); background: var(--vf-fondo); color: var(--vf-suave); border-radius: 6px; padding: 9px 4px; font-size: 13px; font-weight: 600; cursor: pointer; }
.fa-mes .fa { margin-right: 3px !important; }
.fa-mes.activo { border-color: var(--vf-ok); background: #eefaf2; color: #1d6b3a; }
.fa-mes:not(.activo) { text-decoration: line-through; }
@media (max-width: 600px) { .fa-meses { grid-template-columns: repeat(3, 1fr); } }
.fa-linea { list-style: none; margin: 0; padding: 0 0 0 4px; }
.fa-linea li { display: flex; gap: 12px; align-items: flex-start; position: relative; padding: 0 0 14px; }
.fa-linea li:not(:last-child)::before { content: ""; position: absolute; left: 13px; top: 28px; bottom: 0; width: 2px; background: var(--vf-borde); }
.fa-linea li > .fa { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex: none; margin: 0 !important; background: #e6edf7; color: var(--vf-azul); font-size: 13px; }
.fa-linea li.ok > .fa { background: #e1f5e7; color: var(--vf-ok); }
.fa-linea li.error > .fa { background: #fde4e4; color: var(--vf-error); }
.fa-linea li.aviso > .fa { background: var(--vf-aviso-bg); color: #b26a00; }
.fa-linea li.gris > .fa { background: #eef1f5; color: var(--vf-suave); }
.fa-linea b { display: block; font-size: 13.5px; }
.fa-linea span { font-size: 12px; color: var(--vf-suave); }
/* Alta: varios clientes con el mismo NIF (forzar nuevo cliente) */
.al-dup-fila { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 5px 0; border-top: 1px dashed rgba(0,0,0,.1); }
.al-dup-fila:first-of-type { margin-top: 6px; }
.al-dup-fila .vf-btn { margin-left: auto; }
.cl-item-der .cl-mas-mini { margin-left: 6px; vertical-align: middle; }
.cl-mas-mini > .vf-btn { padding: 2px 8px; min-height: 0; line-height: 1.4; }
.cl-item { position: relative; }
@media (max-width: 600px) { .cl-item .cl-mas .vf-menu { left: 8px; right: 8px; } }
/* 16/10/2026: menús «Más» de las listas de la ficha: se abren hacia la derecha del botón (no tapan el menú de la app) y por encima de todo */
.cl-item:has(.vf-menu.abierto) { z-index: 60; }
.cl-items .cl-mas .vf-menu { left: 0; right: auto; z-index: 70; }
.cl-items .cl-item-der .cl-mas .vf-menu, .cl-items .cl-mas .vf-menu.fa-der { left: auto; right: 0; }
.cl-mas .vf-menu.fa-der { left: auto; right: 0; }
@media (max-width: 600px) { .cl-items .cl-mas .vf-menu, .cl-items .cl-mas .vf-menu.fa-der, .cl-items .cl-item-der .cl-mas .vf-menu { left: 8px; right: 8px; } }
/* Enlaces (mandato y pago con tarjeta) con botón de copiar */
.fa-enlace { display: flex; align-items: center; gap: 6px; margin-top: 6px; max-width: 560px; }
.fa-enlace > .fa { color: var(--vf-suave); flex: none; }
.fa-enlace input { flex: 1; min-width: 0; height: 30px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 12px; background: var(--vf-fondo); color: var(--vf-texto); font-family: Consolas, monospace; }
.fa-enlace .vf-btn { flex: none; }
.fa-chk { display: flex !important; gap: 8px; align-items: flex-start; margin: 12px 0 4px !important; font-weight: 400 !important; text-transform: none !important; font-size: 13px !important; cursor: pointer; }
.fa-chk input { margin-top: 2px !important; }
@media (max-width: 991px) { .cl-solo-ancho { display: none; } }
/* 16/10/2026: avisos con el formato nuevo (sustituyen a la sweetalert antigua en la zona de clientes) */
.vf-aviso-capa { position: fixed; inset: 0; z-index: 1100; background: rgba(15, 30, 55, .45); display: none; align-items: center; justify-content: center; padding: 16px; }
.vf-aviso-capa.abierto { display: flex; }
.vf-aviso-caja { background: #fff; border-radius: 10px; box-shadow: 0 12px 40px rgba(0,0,0,.25); width: 100%; max-width: 440px; padding: 22px 22px 16px; text-align: center; border-top: 4px solid var(--vf-azul); animation: vfAvisoEntra .15s ease-out; }
.vf-aviso-caja.ok { border-top-color: var(--vf-ok); }
.vf-aviso-caja.error { border-top-color: var(--vf-error); }
.vf-aviso-caja.aviso { border-top-color: #e2a400; }
.vf-aviso-caja.info { border-top-color: var(--vf-turquesa); }
.vf-aviso-icono { width: 48px; height: 48px; border-radius: 50%; margin: 0 auto 10px; display: flex; align-items: center; justify-content: center; font-size: 22px; background: #e6edf7; color: var(--vf-azul); }
.vf-aviso-caja.ok .vf-aviso-icono { background: #e1f5e7; color: var(--vf-ok); }
.vf-aviso-caja.error .vf-aviso-icono { background: #fde4e4; color: var(--vf-error); }
.vf-aviso-caja.aviso .vf-aviso-icono { background: var(--vf-aviso-bg); color: #b26a00; }
.vf-aviso-caja.info .vf-aviso-icono { background: #e3f3f7; color: var(--vf-turquesa); }
.vf-aviso-icono .fa { margin: 0 !important; }
.vf-aviso-tit { margin: 0 0 6px; font-size: 17px; font-weight: 700; color: var(--vf-texto); line-height: 1.3; }
.vf-aviso-txt { font-size: 13.5px; color: var(--vf-suave); line-height: 1.5; overflow-wrap: anywhere; max-height: 50vh; overflow-y: auto; }
.vf-aviso-btns { display: flex; gap: 8px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
.vf-aviso-btns .vf-btn { min-width: 110px; justify-content: center; }
@keyframes vfAvisoEntra { from { transform: translateY(8px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.fa-filtro:empty { display: none; }
.fa-filtro { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 8px; }
/* 16/10/2026: capa de «cargando» con el formato nuevo (sustituye al gif; solo se ve si la llamada tarda) */
.cl-body .loader { background: rgba(244, 247, 251, .55) none !important; display: flex; align-items: center; justify-content: center; animation: vfCargaAparece .2s ease .35s both; cursor: progress; }
.cl-body .loader::before { content: ""; width: 42px; height: 42px; border-radius: 50%; border: 4px solid rgba(17, 60, 120, .15); border-top-color: var(--vf-azul); border-right-color: var(--vf-turquesa); animation: vfCargaGira .8s linear infinite; box-shadow: 0 0 0 10px rgba(255,255,255,.85), 0 6px 24px 10px rgba(15,30,55,.12); background: #fff; }
@keyframes vfCargaGira { to { transform: rotate(360deg); } }
@keyframes vfCargaAparece { from { opacity: 0; } to { opacity: 1; } }
.fc-pasarela { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 10px; background: #eef2f8; color: var(--vf-azul); }
.fc-pasarela .fa { margin: 0 !important; font-size: 10px; }
/* 16/10/2026: en el móvil, cada dato de las listas de la ficha en su línea */
@media (max-width: 600px) {
    .cl-item-sub .fc-sep { display: block; height: 0; overflow: hidden; }
    .cl-item-sub .fc-pasarela { margin: 2px 0; }
    .cl-item { grid-template-columns: minmax(0, 1fr) auto; }
    .cl-item-der { max-width: 46vw; white-space: normal; }
    .cl-item-der .vf-badge { white-space: normal; text-align: right; }
}
.cl-item-enlaces { flex: 1 1 100%; display: flex; flex-direction: column; gap: 6px; }
.cl-item-enlaces .fa-enlace { margin-top: 0; max-width: 640px; width: 100%; }
@media (max-width: 600px) {
    .cl-list .fc-sep, .cl-res .fc-sep { display: block; height: 0; overflow: hidden; }
    .fa-enlace input { font-size: 11px; }
}
.cl-item-sub .fc-pasarela + .fc-sep { display: none; }
.cl-item-sub .fc-pasarela { margin-right: 4px; }
/* 16/10/2026: posición de los menús «Más» según el sitio que haya (clientes_comun_vf.js) */
@media (min-width: 601px) {
    .cl-page .vf-menu.vf-abre-der { left: 0 !important; right: auto !important; }
    .cl-page .vf-menu.vf-abre-izq { left: auto !important; right: 0 !important; }
}

/* ===================== 16/10/2026 (2): categorías, plantillas, notificaciones, duplicadas, edición ===================== */
.fa-modal input[type=checkbox], .fa-modal input[type=radio] { opacity: 1 !important; float: none !important; position: static !important; visibility: visible !important; width: 16px; height: 16px; margin: 0; display: inline-block !important; flex: none; }
.cl-page .vf-field textarea, .cl-page .vf-field input[type=date] { width: 100%; min-height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 8px 10px; font-size: 13px; background: #fff; color: var(--vf-texto); }
.cl-page .vf-field textarea { resize: vertical; line-height: 1.45; }
.cl-page .vf-field textarea:focus, .cl-page .vf-field input[type=date]:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.cl-page .vf-field .vf-err { display: none; color: var(--vf-error); font-size: 12px; margin-top: 3px; }
.cl-page .vf-field.invalido .vf-err { display: block; }
.cl-page .vf-field.invalido input, .cl-page .vf-field.invalido textarea { border-color: var(--vf-error); }
.cl-page code { background: var(--vf-fondo); color: var(--vf-azul); padding: 0 4px; border-radius: 3px; font-size: 12px; }

/* Categorías */
#ca_lista { padding: 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; align-items: start; }
#ca_lista > .vf-vacio, #ca_lista > .vf-cargando, #ca_lista > .ca-sincat { grid-column: 1 / -1; }
.ca-cat { margin: 0; }
.ca-cat-head { display: flex; justify-content: space-between; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--vf-borde); align-items: flex-start; }
.ca-cat-txt { min-width: 0; }
.ca-cat-nom { font-weight: 700; color: var(--vf-azul); font-size: 15px; overflow-wrap: anywhere; }
.ca-cat-nom .fa { color: var(--vf-turquesa); margin-right: 2px; }
.ca-cat-der { display: flex; gap: 6px; align-items: center; flex: none; }
.ca-cat-body { padding: 10px 14px 12px; }
.ca-sin-sub { padding: 2px 0 4px; }
.ca-add { margin-top: 8px; padding: 0; }
.ca-sincat { padding: 0 2px; }
.ca-cat .cl-item-der { display: flex; align-items: center; gap: 4px; }

/* Plantillas */
.pl-lista { margin: 16px; }
.pl-acc { display: flex; gap: 6px; align-items: flex-start; flex-wrap: wrap; justify-content: flex-end; }
.pl-asunto { font-size: 12.5px; margin-top: 4px; overflow-wrap: anywhere; }
.pl-prev { font-size: 12.5px; color: var(--vf-texto); margin-top: 4px; background: var(--vf-fondo); border-radius: 4px; padding: 6px 9px; overflow-wrap: anywhere; max-width: 760px; }
.pl-editor { padding: 16px; max-width: 980px; }
.pl-editor-head { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.pl-editor-head .vf-btn-link { align-self: flex-start; padding: 0; }
.pl-editor-head h3 { margin: 0; font-size: 18px; font-weight: 600; color: var(--vf-azul); }
.pl-editor-pie { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--vf-borde); }
.pl-vars { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; }
.pl-vars .vf-chip .fa { margin-right: 3px; }
.pl-contador { margin-top: 6px; font-size: 12.5px; }
.pl-contador.pl-caro { color: var(--vf-aviso); }
.pl-aviso { color: var(--vf-aviso); margin-top: 3px; }
.pl-editor .note-editor { border: 1px solid #cfd8e3 !important; border-radius: 4px; }
.vf-field.invalido .note-editor { border-color: var(--vf-error) !important; }
.pl-sms-prev { margin-top: 12px; }
.pl-burbuja { background: #e9f1fb; border-radius: 14px 14px 14px 4px; padding: 10px 13px; margin-top: 6px; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; max-width: 420px; }

/* Notificaciones */
.nt-toolbar .vf-btn.activo { border-color: var(--vf-azul); color: var(--vf-azul); }
.nt-filtros { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px 14px; padding: 12px 16px; background: var(--vf-fondo); border-bottom: 1px solid var(--vf-borde); }
.nt-filtros .vf-field { margin: 0; }
.nt-filtros .vf-select { width: 100%; }
.nt-filtros-pie { display: flex; align-items: flex-end; }
.nt-resumen { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; padding: 8px 16px; font-size: 13px; border-bottom: 1px solid var(--vf-borde); }
.nt-list .vf-row { grid-template-columns: 30px minmax(200px, 1.6fr) minmax(180px, 1.3fr) minmax(120px, .8fr) minmax(170px, 1.2fr); align-items: center; cursor: pointer; }
.nt-list .vf-row.vf-row-head { cursor: default; }
.nt-list .vf-row.seleccionada { background: #eef5fb !important; }
.nt-c-email { overflow-wrap: anywhere; }
.nt-debe { color: var(--vf-error); }
.nt-prev { margin-top: 14px; }
.nt-email-prev { margin-top: 6px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; max-height: 320px; overflow: auto; font-size: 13px; background: #fff; }
.nt-email-prev img { max-width: 100%; height: auto; }
.nt-coste { margin-top: 12px; padding: 9px 12px; background: var(--vf-info-bg); border-radius: 6px; font-size: 13px; }
.nt-var { background: #fff; border: 1px dashed var(--vf-turquesa); color: var(--vf-turquesa); border-radius: 3px; padding: 0 4px; font-size: 11.5px; }
@media (max-width: 991px) {
    .nt-list .vf-row { grid-template-columns: 1fr 1fr; padding-left: 44px; }
    .nt-list .cl-c-check { position: absolute; left: 14px; top: 16px; }
    .nt-list .vf-row > .vf-cell:nth-child(2) { grid-column: 1 / -1; }
}
@media (max-width: 600px) { .nt-list .vf-row { grid-template-columns: 1fr; } }

/* Domiciliaciones duplicadas */
#du_lista { padding: 16px; }
.du-grupo { margin-bottom: 14px; }
.du-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 12px 14px; align-items: flex-start; }
.du-head-acc { display: flex; gap: 6px; flex-wrap: wrap; }
.du-nota { padding: 0 14px 8px; }
.du-grupo .cl-items { margin: 0 14px 14px; }
.du-baja { color: var(--vf-error); }
.du-bien i, .ed-bien i { color: var(--vf-ok) !important; }

/* Enlaces de edición */
.ed-lista { margin: 16px; }
.ed-lista .cl-item-der { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; white-space: normal; }
.ed-lista .cl-item-der .cl-mas-mini { margin: 0; }
.ed-est-txt { max-width: 230px; text-align: right; }
.ed-enlace { margin-top: 6px; }
.ed-enlace-grande { font-size: 15px; padding: 10px 12px; }
.ed-res { margin-top: 6px; max-height: 300px; overflow: auto; display: none; }
.ed-elegido { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--vf-borde); border-radius: 6px; background: var(--vf-fondo); }
.ed-dif-cab, .ed-dif { display: grid; grid-template-columns: 22px minmax(110px, .7fr) minmax(0, 1fr) 18px minmax(0, 1fr); gap: 8px; align-items: center; }
.ed-dif-cab { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; padding: 0 10px 6px; }
.ed-difs { border: 1px solid var(--vf-borde); border-radius: 6px; }
.ed-dif { padding: 9px 10px; border-top: 1px solid var(--vf-borde); margin: 0 !important; font-weight: 400 !important; text-transform: none !important; font-size: 13px !important; cursor: pointer; }
.ed-dif:first-child { border-top: none; }
.ed-dif-campo { font-weight: 600; }
.ed-dif-antes { color: var(--vf-suave); text-decoration: line-through; overflow-wrap: anywhere; }
.ed-dif-ahora { color: #145c3b; font-weight: 600; overflow-wrap: anywhere; }
.ed-dif-flecha { color: var(--vf-suave); }
.ed-dif.desmarcado .ed-dif-antes { text-decoration: none; color: var(--vf-texto); }
.ed-dif.desmarcado .ed-dif-ahora { text-decoration: line-through; color: var(--vf-suave); font-weight: 400; }
.ed-rev-pie { margin-top: 12px; display: flex; justify-content: flex-start; }
.ed-rechazar { color: var(--vf-error); }
@media (max-width: 600px) {
    .ed-dif-cab { display: none; }
    .ed-dif { grid-template-columns: 22px 1fr; }
    .ed-dif-antes, .ed-dif-ahora { grid-column: 2; }
    .ed-dif-flecha { display: none; }
    .ed-lista .cl-item-der { align-items: flex-start; }
    .ed-est-txt { text-align: left; }
    #ca_lista { grid-template-columns: 1fr; padding: 12px; }
}
.cl-page .vf-btn-link .fa { margin: 0 4px 0 0 !important; width: auto; }
.ca-add { font-size: 13px; }
.pl-editor .note-toolbar { background: var(--vf-fondo) !important; padding: 6px 8px 2px !important; border-bottom: 1px solid var(--vf-borde) !important; }
.pl-editor .note-toolbar .note-btn-group { margin: 0 6px 4px 0 !important; }
.pl-editor .note-toolbar .btn { background: #fff !important; color: var(--vf-texto) !important; border: 1px solid #cfd8e3 !important; border-radius: 0 !important; padding: 4px 9px !important; font-size: 13px !important; line-height: 1.4 !important; min-width: 0 !important; height: auto !important; box-shadow: none !important; margin: 0 0 0 -1px !important; opacity: 1 !important; }
.pl-editor .note-toolbar .note-btn-group > .btn:first-child { border-radius: 4px 0 0 4px !important; margin-left: 0 !important; }
.pl-editor .note-toolbar .note-btn-group > .btn:last-child, .pl-editor .note-toolbar .note-btn-group > .btn:only-child { border-radius: 0 4px 4px 0 !important; }
.pl-editor .note-toolbar .note-btn-group > .btn:only-child { border-radius: 4px !important; }
.pl-editor .note-toolbar .btn:hover, .pl-editor .note-toolbar .btn.active { background: #e6edf7 !important; color: var(--vf-azul) !important; }
.pl-editor .note-editable { font-size: 14px; line-height: 1.5; }
.pl-editor .note-toolbar.panel-heading { display: block !important; }
.ed-der-fila { display: flex; align-items: center; gap: 4px; }
.ca-cat, .du-grupo { position: relative; }
.ca-ver { text-decoration: none !important; cursor: pointer; } .ca-ver:hover { background: #d6e3f3; }
.du-det { margin-top: 6px; font-size: 12.5px; line-height: 1.6; color: var(--vf-texto); }
.du-det .fc-pasarela { margin-right: 2px; }
.du-ok { color: var(--vf-ok); } .du-mal { color: var(--vf-error); } .du-emi { color: var(--vf-aviso); }
.du-cargando { margin-top: 6px; }
.du-pista { margin: 0 14px 10px; padding: 8px 11px; border-radius: 6px; background: var(--vf-info-bg); color: #0f5468; font-size: 12.5px; }
.du-pista.mal { background: var(--vf-error-bg); color: #8a271d; }
.du-grupo .cl-item-acc .vf-btn-link { font-size: 12.5px; }
@media (max-width: 600px) { .du-det .fc-sep, .du-grupo .fc-sep { display: block; height: 0; overflow: hidden; } }

/* ext_edicion_cliente.php (página pública) */
.ext-eec-wrap { max-width: 680px; }
.ext-eec-cab { text-align: center; margin-bottom: 14px; }
.ext-eec-comercio { font-size: 13px; text-transform: uppercase; letter-spacing: .5px; color: var(--apl-color, #01397F); font-weight: 700; }
.ext-eec-cab h1 { font-size: 24px; font-weight: 600; margin: 4px 0 8px; color: #2c3e50; }
.ext-eec-cab p { margin: 0 0 6px; font-size: 14.5px; color: #4a5a6c; }
.ext-eec-nota { font-size: 12.5px !important; color: #6b7a8c !important; }
.ext-eec-tipo { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 10px 12px; background: #f6f8fb; border-radius: 10px; margin-bottom: 4px; }
.ext-eec-chk { display: inline-flex !important; align-items: center; gap: 8px; margin: 0 !important; font-weight: 500 !important; font-size: 14px !important; text-transform: none !important; color: #2c3e50 !important; cursor: pointer; }
.ext-eec input[type=checkbox] { opacity: 1 !important; position: static !important; visibility: visible !important; width: 17px; height: 17px; margin: 0 !important; display: inline-block !important; }
.ext-eec-h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .5px; font-weight: 700; color: var(--apl-color, #01397F); margin: 20px 0 10px; }
.ext-eec-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.ext-eec-campos .eec-ancho { grid-column: 1 / -1; }
.ext-eec .vf-field label { font-size: 13px; color: #4a5a6c; }
.ext-eec .vf-field input, .ext-eec .vf-field select { width: 100%; min-height: 44px; border: 1px solid #cfd8e3; border-radius: 8px; padding: 9px 12px; font-size: 15px; background: #fff; color: #2c3e50; }
.ext-eec .vf-field input:focus, .ext-eec .vf-field select:focus { outline: none; border-color: var(--apl-color, #01397F); box-shadow: 0 0 0 3px rgba(1, 57, 127, .12); }
.ext-eec .vf-field .vf-err { display: none; color: #c0392b; font-size: 12.5px; margin-top: 4px; }
.ext-eec .vf-field.invalido .vf-err { display: block; }
.ext-eec .vf-field.invalido input { border-color: #c0392b; }
.ext-eec .vf-field.eec-cambiado input, .ext-eec .vf-field.eec-cambiado select { border-color: #1e8e5a; background: #f3fbf6; }
.ext-eec .vf-field.eec-cambiado label::after { content: " · cambiado"; color: #1e8e5a; font-weight: 500; }
.ext-eec-cambios { margin-top: 18px; font-size: 14px; color: #145c3b; text-align: center; }
.ext-eec-cambios .eec-sin { color: #6b7a8c; }
.ext-eec-error { background: #fdecea !important; color: #8a271d !important; }
.ext-eec .ext-apl-estado .ext-apl-enviar { margin-top: 10px; }
@media (max-width: 600px) { .ext-eec-campos { grid-template-columns: 1fr; } .ext-eec-cab h1 { font-size: 21px; } }
.ed-hist { margin-top: 6px; font-size: 12.5px; line-height: 1.5; }
.ed-hist .vf-btn-link { font-size: 12.5px; padding: 0 2px; }
.ed-hist-rev { margin-bottom: 14px; }
.ed-hist-tit { margin-bottom: 6px; font-size: 13px; }
.ed-dif-hist { cursor: default; }
.ed-avisos { margin-top: 10px; padding: 8px 12px; background: var(--vf-fondo); border-radius: 6px; }
.ed-avisos .fa-chk { margin: 4px 0 !important; }
.crm-pregunta input[type=checkbox] { opacity: 1 !important; position: static !important; visibility: visible !important; width: 16px; height: 16px; margin: 0; display: inline-block !important; flex: none; }
.ext-eec .vf-field.invalido input, .ext-eec .vf-field.invalido select { border-color: #c0392b !important; background: #fff8f7 !important; }
/* Página pública: cambio de cuenta bancaria con código (16/10/2026) */
.ext-eec-cuenta { margin-top: 26px; padding-top: 6px; border-top: 1px solid #e3e8ef; }
.ext-eec-cuenta .ext-eec-h2 i { color: var(--apl-color, #01397F); margin-right: 4px; }
.ext-eec-cu-actual { margin: 0 0 12px; color: #34495e; }
.ext-eec-cu-actual b { letter-spacing: 1px; }
.ext-eec-cu-pend { background: #fff6e0 !important; color: #7a5a00 !important; margin-bottom: 12px; }
.ext-eec-cu-txt { margin: 0 0 12px; color: #34495e; }
.ext-eec-cu-txt .fa-check-circle { color: #1e8e5a; }
.ext-eec-cu-sub { font-size: 13px; color: #6b7a8c; margin: 10px 0 0; }
.ext-eec-cu-canales { display: flex; flex-direction: column; gap: 8px; margin-bottom: 4px; }
.ext-eec-cu-canal { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid #d5dde8; border-radius: 10px; cursor: pointer; font-weight: 400; margin: 0; background: #fff; }
.ext-eec-cu-canal:has(input:checked) { border-color: var(--apl-color, #01397F); background: #f3f7fc; }
.ext-eec-cu-canal i { width: 18px; text-align: center; color: #6b7a8c; font-size: 17px; }
.ext-eec-cu-canal input { margin: 0; }
.ext-eec-cu-canal b { word-break: break-all; }
.ext-eec .ext-eec-cu-cod { font-size: 26px !important; letter-spacing: 8px; text-align: center; max-width: 240px; font-family: monospace; }
.ext-eec .ext-eec-cu-iban { font-family: monospace; letter-spacing: 1px; text-transform: uppercase; }
.ext-eec-cu-paso .ext-apl-pagar { margin-top: 12px; }
.ext-eec-cu-ok { display: flex; gap: 12px; align-items: flex-start; background: #eaf7f0; color: #145c3b; border-radius: 10px; padding: 14px; }
.ext-eec-cu-ok > i { font-size: 26px; color: #1e8e5a; }
.ext-eec-cu-ok p { margin: 0; }
#eec_cu_error { margin-top: 12px; }
.ext-eec-cu-actual b { white-space: nowrap; }
/* Cambios por revisar: cuenta bancaria nueva (16/10/2026) */
.ed-cuenta-linea { margin-top: 4px; font-size: 13px; color: #34495e; }
.ed-cuenta-linea i { color: #01397F; margin-right: 3px; }
.ed-dif-cuenta .ed-dif-antes, .ed-dif-cuenta .ed-dif-ahora { font-family: monospace; font-size: 12.5px; word-break: break-all; }
.ed-dif-cuenta .ed-dif-antes .vf-sub, .ed-dif-cuenta .ed-dif-ahora .vf-sub { font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; }
.ed-dif-cuenta .ed-dif-campo i { color: #01397F; }
.ct-aviso.ed-cuenta-aviso { margin: 10px 0 4px; }
.ct-aviso.ed-cuenta-aviso.error { background: #fdecea; color: #8a271d; border-color: #f5c6c0; }
/* Enviar enlace: qué se le pide (16/10/2026) */
.ed-que { margin: 12px 0 6px; }
.ed-que-tit { font-weight: 600; font-size: 13px; color: #34495e; margin-bottom: 6px; }
.ed-que-op { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid #d5dde8; border-radius: 8px; margin: 0 0 6px; font-weight: 400; cursor: pointer; }
.ed-que-op:has(input:checked) { border-color: #01397F; background: #f3f7fc; }
.ed-que-op input { margin-top: 3px; }
.ed-que-op.desactivado { opacity: .65; cursor: not-allowed; }
.ext-eec-cuenta.ext-eec-solo-cuenta { margin-top: 0; padding-top: 0; border-top: 0; }
.fa-porque { font-size: 12px; color: #6b7a8c; align-self: center; }
/* 16/10/2026: la página del cliente con la misma letra que el resto de pantallas (Inter, como custom.css) */
body.ext-eec, body.ext-eec input, body.ext-eec select, body.ext-eec button, body.ext-eec textarea, body.ext-eec label, body.ext-eec h1, body.ext-eec h2, body.ext-eec p { font-family: "Inter", "Helvetica Neue", Arial, sans-serif; }
body.ext-eec .ext-eec-cu-cod, body.ext-eec .ext-eec-cu-iban { font-family: Consolas, Menlo, monospace; }
body.ext-eec .vf-field input, body.ext-eec .vf-field select { font-weight: 400; color: #2c3e50; }
/* 16/10/2026 (2): la página del cliente con el mismo aspecto que las pantallas del panel (cabecera con barra azul,
   tarjetas con icono, campos de 38 px, botones vf-btn) */
body.ext-eec { background: #f4f6f9; }
.ext-eec .ext-eec-wrap { max-width: 780px; }
.ext-eec .ext-apl-card { background: transparent; box-shadow: none; border: 0; padding: 0; border-radius: 0; }
.ext-eec .ext-apl-logo { margin-bottom: 14px; }
.ext-eec .ext-eec-cab { text-align: left; background: #fff; border-radius: 6px; padding: 18px 20px; margin-bottom: 16px; border-left: 4px solid var(--vf-azul); box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.ext-eec .ext-eec-cab h1 { font-size: 22px; font-weight: 600; color: var(--vf-azul); margin: 2px 0 4px; }
.ext-eec .ext-eec-cab p { font-size: 13px; color: var(--vf-suave); margin: 0; line-height: 1.5; }
.ext-eec .ext-eec-comercio { font-size: 11.5px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--vf-suave); }
.ext-eec .ext-eec-cab .ext-apl-aviso, .ext-eec .ext-eec-cab .ext-eec-nota { margin: 10px 0 0; }
.ext-eec .vf-card { margin-bottom: 16px; }
.ext-eec .vf-card-body > .ext-eec-tipo { margin-bottom: 14px; }
.ext-eec .ext-eec-tipo { background: transparent; padding: 0; gap: 8px 20px; }
.ext-eec .ext-eec-chk { font-size: 13px !important; font-weight: 500 !important; }
.ext-eec .ext-eec-campos { gap: 12px 16px; }
.ext-eec .vf-field { margin-bottom: 0; }
.ext-eec .vf-field label { font-size: 12px; font-weight: 600; color: var(--vf-texto); margin-bottom: 5px; }
.ext-eec .vf-field input, .ext-eec .vf-field select { min-height: 0; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 14px; }
.ext-eec .vf-field input:focus, .ext-eec .vf-field select:focus { border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.ext-eec .vf-field.eec-cambiado input, .ext-eec .vf-field.eec-cambiado select { border-color: #1e8e5a; background: #f3fbf6; }
.ext-eec .eec-pie { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 18px; }
.ext-eec .eec-pie .ext-eec-cambios { margin: 0; text-align: left; font-size: 13px; flex: 1; min-width: 200px; }
.ext-eec .eec-btn { padding: 9px 18px; font-size: 14px; }
.ext-eec .eec-btn-sec { padding: 8px 14px; font-size: 13.5px; }
.ext-eec .ext-eec-cu-paso .eec-btn { margin-top: 12px; }
.ext-eec .ext-apl-sub { text-align: left; font-size: 12px; margin: 0 0 16px; }
.ext-eec .ext-apl-aviso { border-radius: 6px; font-size: 13px; }
.ext-eec #eec_error { margin: 0 0 12px; }
.ext-eec .ext-eec-cuenta { border-top: 1px solid var(--vf-borde); margin-top: 0; padding-top: 0; }
.ext-eec .ext-eec-cu-actual, .ext-eec .ext-eec-cu-txt { font-size: 13.5px; }
.ext-eec .ext-eec-cu-canal { border-radius: 6px; padding: 10px 12px; font-size: 13.5px; }
.ext-eec .ext-eec-cu-cod { height: 48px !important; font-size: 24px !important; }
.ext-eec .ext-apl-estado { background: #fff; border-radius: 6px; padding: 26px 20px; box-shadow: 0 1px 2px rgba(0,0,0,.06); border: 1px solid var(--vf-borde); }
.ext-eec .ext-apl-estado h1 { font-size: 20px; color: var(--vf-azul); }
.ext-eec .ext-apl-pie { margin-top: 6px; }
@media (max-width: 600px) {
  .ext-eec .ext-eec-wrap { padding: 14px 10px 30px; }
  .ext-eec .eec-pie .eec-btn, .ext-eec .ext-eec-cu-paso .eec-btn { width: 100%; }
  .ext-eec .vf-field input, .ext-eec .vf-field select { height: 42px; font-size: 16px; } /* 16 px: iOS no hace zoom */
}

/* =============================================================================
   CALENDARIO Y POSICIÓN GLOBAL DE DOMICILIACIONES (18/10/2026)
   calendar.php (calendar_vf.js) y dashboard.php (dashboard_vf.js)
   ============================================================================= */
.cal-page { --cal-prev: #1B799B; --cal-cob: #1e8e5a; --cal-dev: #c0392b; --cal-tar: #6a4fb3; --cal-tra: #01397F; }
.cal-kpis { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.cal-kpis .vf-kpi { cursor: default; }
.cal-kpis .vf-kpi:hover { transform: none; }
.cal-kpis .vf-kpi-num { font-size: 23px; white-space: nowrap; }
.vf-kpi.cal-k-tar { border-top-color: #6a4fb3; } .vf-kpi.cal-k-tar .vf-kpi-num { color: #5a3fa3; }
.cal-panel { margin-bottom: 20px; }
.cal-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid var(--vf-borde); }
.cal-nav { display: flex; align-items: center; gap: 8px; }
.cal-nav .vf-btn-sm { height: 34px; min-width: 34px; justify-content: center; }
.cal-nav .vf-btn:disabled { opacity: .45; cursor: not-allowed; }
.cal-mes { margin: 0 4px; font-size: 18px; font-weight: 700; color: var(--vf-azul); min-width: 150px; text-align: center; }
.cal-filtros { display: flex; gap: 6px; flex-wrap: wrap; }
.cal-filtro { border: 1px solid var(--vf-borde); background: #fff; color: var(--vf-suave); border-radius: 16px; padding: 4px 11px; font-size: 12.5px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.cal-filtro:hover { border-color: var(--vf-turquesa); }
.cal-filtro.activo { color: var(--vf-texto); background: var(--vf-fondo); border-color: #c9d3df; }
.cal-filtro:not(.activo) .cal-punto { background: #fff !important; box-shadow: inset 0 0 0 2px #b7c2cf; }
.cal-filtro:not(.activo) { text-decoration: line-through; text-decoration-color: #b7c2cf; }
.cal-punto { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.cal-punto.cal-c-prev { background: var(--cal-prev); } .cal-punto.cal-c-cob { background: var(--cal-cob); } .cal-punto.cal-c-dev { background: var(--cal-dev); }
.cal-punto.cal-c-tar { background: var(--cal-tar); } .cal-punto.cal-c-tra { background: var(--cal-tra); }
.cal-banner { margin: 12px 16px 0; }
.cal-cuerpo { padding: 12px 16px 16px; }

/* Mes */
.cal-grid { border: 1px solid var(--vf-borde); border-radius: 6px; overflow: hidden; }
.cal-sem { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-sem + .cal-sem { border-top: 1px solid var(--vf-borde); }
.cal-cab { background: var(--vf-fondo); font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); }
.cal-cab > div { padding: 8px 8px; }
.cal-corto { display: none; }
.cal-dia-celda { position: relative; display: flex; flex-direction: column; align-items: stretch; text-align: left; min-height: 112px; padding: 6px 6px 8px; border: none; border-right: 1px solid var(--vf-borde); background: #fff; cursor: pointer; color: var(--vf-texto); font: inherit; min-width: 0; }
.cal-dia-celda:last-child { border-right: none; }
.cal-dia-celda:hover { background: #f3f8fb; }
.cal-dia-celda:focus-visible { outline: 2px solid var(--vf-turquesa); outline-offset: -2px; }
.cal-dia-celda.finde { background: #fafbfd; }
.cal-dia-celda.fuera { background: #f6f8fb; }
.cal-dia-celda.fuera .cal-num { color: #b7c2cf; }
.cal-dia-celda.hoy { box-shadow: inset 0 0 0 2px var(--vf-turquesa); }
.cal-num { font-size: 13px; font-weight: 700; color: var(--vf-texto); margin-bottom: 4px; }
.cal-dia-celda.pasado:not(.hoy) .cal-num { color: var(--vf-suave); }
.cal-num small { font-size: 10px; font-weight: 700; text-transform: uppercase; background: var(--vf-turquesa); color: #fff; border-radius: 8px; padding: 1px 6px; vertical-align: 1px; }
.cal-chips { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cal-chip { display: block; font-size: 11.5px; line-height: 1.3; padding: 2px 6px 2px 8px; border-radius: 4px; border-left: 3px solid; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; color: var(--vf-texto); }
.cal-chip b { font-weight: 700; }
.cal-chip em { font-style: normal; color: var(--vf-suave); font-size: 11px; }
.cal-chip.cal-c-prev { border-color: var(--cal-prev); background: #e6f3f7; }
.cal-chip.cal-c-cob { border-color: var(--cal-cob); background: #e7f6ee; }
.cal-chip.cal-c-dev { border-color: var(--cal-dev); background: #fdecea; }
.cal-chip.cal-c-tar { border-color: var(--cal-tar); background: #f0ecfa; }
.cal-chip.cal-c-tra { border-color: var(--cal-tra); background: #e6edf7; }
.cal-nota { display: block; font-size: 11px; color: #7a4a00; background: #fff4e0; border-radius: 4px; padding: 2px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-mas { position: absolute; top: 6px; right: 7px; font-size: 10px; color: var(--vf-turquesa); opacity: 0; transition: opacity .15s; }
.cal-dia-celda:hover .cal-mas, .cal-dia-celda:focus-visible .cal-mas { opacity: 1; }
.cal-dia-celda.fuera .cal-mas { display: none; }

/* Lista */
.cal-lista { display: flex; flex-direction: column; gap: 6px; }
.cal-fila { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; padding: 8px 12px; cursor: pointer; font: inherit; color: var(--vf-texto); }
.cal-fila:hover { border-color: var(--vf-turquesa); background: #f3f8fb; }
.cal-fila.hoy { box-shadow: inset 3px 0 0 var(--vf-turquesa); }
.cal-fila-fecha { flex: none; width: 46px; text-align: center; line-height: 1.1; }
.cal-fila-fecha b { display: block; font-size: 20px; color: var(--vf-azul); }
.cal-fila-fecha span { font-size: 11px; text-transform: uppercase; color: var(--vf-suave); }
.cal-fila.pasado .cal-fila-fecha b { color: var(--vf-suave); }
.cal-fila .cal-chips { flex: 1; flex-direction: row; flex-wrap: wrap; gap: 5px; }
.cal-fila .cal-chip, .cal-fila .cal-nota { font-size: 12.5px; padding: 3px 8px 3px 9px; max-width: 100%; }
.cal-fila-ir { color: #b7c2cf; flex: none; }

/* Panel del día */
.cal-dia .cal-dia-num { background: var(--vf-turquesa); font-size: 18px; }
.cal-dia-res { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.cal-dia-res .cal-chip { font-size: 12.5px; padding: 4px 9px 4px 10px; }
.cal-dia .cal-banner { margin: 0 0 4px; }
.cal-tot { font-size: 13px; color: var(--vf-texto); text-transform: none; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.cal-items { border: 1px solid var(--vf-borde); border-radius: 6px; }
.cal-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 12px; }
.cal-item + .cal-item { border-top: 1px solid var(--vf-borde); }
.cal-item.tenue { opacity: .6; }
.cal-item-main { min-width: 0; }
.cal-item-tit { font-weight: 600; font-size: 13.5px; word-break: break-word; }
.cal-item-tit a { color: var(--vf-azul); }
.cal-item-sub { font-size: 12px; color: var(--vf-suave); margin-top: 1px; word-break: break-word; }
.cal-item-sub .vf-num { font-size: 11px; color: #9aa8ba; margin-left: 4px; }
.cal-item-der { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex: none; }
.cal-item-der b { font-variant-numeric: tabular-nums; font-size: 13.5px; }
.cal-ver { display: inline-block; font-size: 12.5px; margin-top: 6px; }
.cal-dia-vacio { padding: 30px 10px; }
.cal-dia-notas { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--vf-borde); }
.cal-nota-txt { width: 100%; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 8px 10px; font-size: 13.5px; resize: vertical; min-height: 74px; color: var(--vf-texto); }
.cal-nota-txt:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.cal-nota-acc { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; gap: 10px; }
.cal-nota-acc .vf-btn-sm { height: 32px; padding: 0 12px; }
.cal-nota-acc #cal_nota_guardar { margin-left: auto; }
.vf-btn-link.peligro { color: var(--vf-error); }

@media (max-width: 1100px) {
  .cal-dia-celda { min-height: 96px; padding: 5px 4px 6px; }
  .cal-chip { font-size: 10.5px; padding: 1px 4px 1px 5px; }
  .cal-chip em { display: none; }
}
@media (max-width: 900px) {
  .cal-largo { display: none; } .cal-corto { display: inline; }
  .cal-barra { flex-direction: column; align-items: stretch; }
  .cal-nav { justify-content: space-between; }
  .cal-vista { align-self: flex-start; }
}
@media (max-width: 600px) {
  .cal-cuerpo { padding: 10px; }
  .cal-vista { display: none; }   /* en el móvil siempre la lista */
  .cal-mes { font-size: 16px; min-width: 0; flex: 1; }
  .cal-kpis .vf-kpi-num { font-size: 20px; }
}

/* Posición global de domiciliaciones (dashboard.php) */
.pgd-kpis-tit { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); margin: 0 0 8px; }
.pgd-kpis-tit .vf-sub { display: inline; text-transform: none; letter-spacing: 0; font-weight: 400; }
.pgd-kpis a.vf-kpi { display: block; text-decoration: none; color: inherit; cursor: pointer; }
.pgd-kpis a.vf-kpi[href]:hover { box-shadow: 0 0 0 2px var(--vf-turquesa) inset; }
.pgd-kpis a.vf-kpi:not([href]) { cursor: default; }
.pgd-page #pgd_aviso .vf-banner { margin-bottom: 16px; }
.pgd-cifras { display: flex; gap: 28px; flex-wrap: wrap; padding: 12px 16px 0; }
.pgd-cifras:empty { display: none; }
.pgd-cifras .pg-pend-cifra b { display: block; font-size: 19px; font-variant-numeric: tabular-nums; color: var(--vf-texto); }
.pgd-cifras .pg-pend-cifra span { font-size: 12px; color: var(--vf-suave); }
.pgd-cifras .pgd-atras { padding-left: 24px; border-left: 1px solid var(--vf-borde); }
.pgd-graf-med { height: 260px; }
.pgd-page .pg-bloque-acc { flex-wrap: wrap; }
.pgd-page .pg-bloque-acc .li-seg-btn { height: 30px; padding: 0 11px; font-size: 12.5px; }
@media (max-width: 900px) { .pgd-page .pg-dos { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { .pgd-cifras { gap: 16px; } .pgd-cifras .pgd-atras { padding-left: 0; border-left: none; } .pgd-graf-med, .pgd-page .pg-grafico { height: 240px; } }
.cal-page .li-seg-btn .fa, .cal-filtro .fa { width: auto !important; margin: 0 4px 0 0 !important; }

/* =============================================================================
   CUENTA Y AJUSTES — pantallas del menú de usuario («menú oculto») (18/10/2026)
   Prefijo cu-. El menú lateral tiene su estilo en navbar1.php (sale en todas las pantallas).
   ============================================================================= */
.cu-page .vf-head h2 .fa { margin-right: 6px; }
/* Pestañas con las pantallas del mismo grupo (cuenta_menu_vf.php → cuentaPestanas) */
.cu-pestanas { display: flex; gap: 6px; flex-wrap: wrap; margin: -4px 0 16px; }
.cu-pestana { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 13px; border: 1px solid var(--vf-borde); border-radius: 17px; background: #fff; color: var(--vf-texto) !important; font-size: 13px; font-weight: 500; text-decoration: none !important; }
.cu-pestana .fa { color: var(--vf-suave); }
.cu-pestana:hover { border-color: var(--vf-turquesa); }
.cu-pestana.activa { background: var(--vf-azul); border-color: var(--vf-azul); color: #fff !important; }
.cu-pestana.activa .fa { color: #fff; }
/* Campos (amplía .vf-field: number, email, tel, fecha, textarea) */
.vf-field input[type=number], .vf-field input[type=email], .vf-field input[type=tel], .vf-field input[type=date], .vf-field input.cu-input, .cu-page .vf-field input[type=text] {
    width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; color: var(--vf-texto); box-shadow: none;
}
.vf-field textarea { width: 100%; min-height: 90px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 8px 10px; font-size: 13.5px; color: var(--vf-texto); resize: vertical; }
.vf-field input:disabled, .vf-field select:disabled, .vf-field input[readonly], .cu-page .vf-field input:disabled, .cu-page .vf-field input[readonly] { background: var(--vf-fondo); color: var(--vf-suave); }
.vf-field textarea:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.vf-field.invalido textarea { border-color: var(--vf-error); }
.vf-field.cu-ancho { grid-column: 1 / -1; }
.cu-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 22px; }
.cu-page label.error { display: block; font-size: 12px; color: var(--vf-error); font-weight: 400; margin: 4px 0 0; text-transform: none; }
.cu-page input.error, .cu-page select.error, .cu-page textarea.error { border-color: var(--vf-error) !important; }
@media (max-width: 767px) { .cu-grid3 { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .cu-page .vf-field input, .cu-page .vf-field select, .cu-page .vf-field textarea { height: 42px; font-size: 16px; } .cu-page .vf-field textarea { height: auto; } }
/* Interruptor: <label class="cu-sw"><input type="checkbox"><span class="cu-sw-pista"></span><span class="cu-sw-txt">...</span></label> */
.cu-sw { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; margin: 0; font-weight: 500; font-size: 13px; text-transform: none; color: var(--vf-texto); position: relative; user-select: none; }
.cu-sw input[type=checkbox], .cu-page .cu-sw input[type=checkbox], .vf-modal .cu-sw input[type=checkbox] { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; margin: 0 !important; }
.cu-sw .cu-sw-pista { flex: none; position: relative; width: 40px; height: 22px; border-radius: 11px; background: #cfd8e3; transition: background .15s; }
.cu-sw .cu-sw-pista::after { content: ""; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: left .15s; }
.cu-sw input:checked + .cu-sw-pista { background: var(--vf-ok); }
.cu-sw input:checked + .cu-sw-pista::after { left: 21px; }
.cu-sw input:focus-visible + .cu-sw-pista { box-shadow: 0 0 0 3px rgba(27,121,155,.25); }
.cu-sw input:disabled + .cu-sw-pista { opacity: .45; }
.cu-sw.bloqueado { cursor: not-allowed; }
.cu-sw.cargando .cu-sw-pista { opacity: .5; }
/* Listas de opciones con interruptor (filas) */
.cu-lista { list-style: none; margin: 0; padding: 0; }
.cu-fila { display: flex; align-items: center; gap: 14px; padding: 11px 18px; border-top: 1px solid var(--vf-borde); }
.cu-fila:first-child { border-top: none; }
.cu-fila .cu-fila-txt { flex: 1; min-width: 0; }
.cu-fila .cu-fila-tit { font-size: 13.5px; font-weight: 600; color: var(--vf-texto); }
.cu-fila .cu-fila-sub { font-size: 12px; color: var(--vf-suave); margin-top: 2px; line-height: 1.45; }
.cu-fila .cu-fila-acc { flex: none; display: flex; align-items: center; gap: 8px; }
.cu-fila.apagada .cu-fila-tit { color: var(--vf-suave); }
.cu-fila.fija .cu-fila-sub::before { content: "\f023"; font-family: FontAwesome; margin-right: 5px; }
/* Grupo (sección) dentro de un panel: cabecera con acciones */
.cu-grupo { border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; margin-bottom: 14px; overflow: hidden; }
.cu-grupo-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 11px 18px; background: var(--vf-fondo); border-bottom: 1px solid var(--vf-borde); }
.cu-grupo-head h3 { margin: 0; font-size: 14.5px; font-weight: 600; color: var(--vf-azul); text-transform: none; }
.cu-grupo-head h3 small { font-size: 12px; font-weight: 400; color: var(--vf-suave); margin-left: 6px; }
.cu-grupo-head .cu-grupo-acc { display: flex; gap: 6px; flex-wrap: wrap; }
@media (max-width: 600px) { .cu-fila { padding: 11px 12px; } .cu-grupo-head { padding: 10px 12px; } }
/* Medidor de contraseña */
.cu-medidor { height: 6px; border-radius: 3px; background: var(--vf-gris-bg); overflow: hidden; margin-top: 7px; }
.cu-medidor span { display: block; height: 100%; width: 0; background: var(--vf-error); transition: width .2s, background .2s; }
.cu-medidor.n2 span { background: #e0a800; } .cu-medidor.n3 span { background: var(--vf-ok); }
.cu-reglas { list-style: none; margin: 8px 0 0; padding: 0; font-size: 12px; color: var(--vf-suave); }
.cu-reglas li { margin: 2px 0; } .cu-reglas li .fa { width: 14px; } .cu-reglas li.ok { color: var(--vf-ok); }
/* Tarjetas de proveedores de pago / conexiones */
.cu-provs { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.cu-prov { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: #fff; }
.cu-prov-logo { height: 40px; display: flex; align-items: center; }
.cu-prov-logo img { max-height: 36px; max-width: 170px; }
.cu-prov-txt { font-size: 12.5px; color: var(--vf-suave); line-height: 1.5; flex: 1; }
.cu-prov .vf-btn { align-self: flex-start; }
/* Vacío dentro de un panel */
.cu-vacio { text-align: center; padding: 36px 16px; color: var(--vf-suave); font-size: 13px; }
.cu-vacio .fa { font-size: 28px; display: block; margin-bottom: 10px; color: #b7c3d1; }
.cu-page .vf-btn .fa, .cu-page .vf-chip .fa, .cu-page .vf-tag .fa, .cu-page .vf-kpi .fa { margin: 0 !important; width: auto; }
.cu-page .vf-banner .vf-btn { margin-top: 8px; }
/* Pantallas del menú: dos columnas de opciones en pantallas anchas */
@media (min-width: 1100px) {
    .pm-page .cu-lista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pm-page .cu-fila:nth-child(2) { border-top: none; }
    .pm-page .cu-fila:nth-child(even) { border-left: 1px solid var(--vf-borde); }
}
/* Datos de la empresa (datos_usuario.php) */
.du-page .vf-card { scroll-margin-top: 12px; transition: box-shadow .3s; }
.du-page .vf-card.du-resalta { box-shadow: 0 0 0 3px rgba(27,121,155,.35); }
.du-page #du_estado .vf-ci-text a { font-weight: 600; }
.du-page .cu-prov .vf-sub { font-size: 12px; color: var(--vf-suave); margin-left: 4px; }
.du-page .vf-card-head h3.oculto { display: none; }
.du-page .vf-banner.oculto { display: none; }
@media (max-width: 767px) { .du-page .cu-grid3 .vf-field[style*="span 2"] { grid-column: auto !important; } .du-page .cu-grid3 .vf-field:empty { display: none; } }

/* ---- Cuenta y ajustes: contraseña, dos pasos, baja, tarifas (18/10/2026) ---- */
/* ---- Cambiar contraseña (cs-) ---- */
.cs-page .cs-card { max-width: 560px; }
.cs-page .vf-card-body .vf-field + .vf-field { margin-top: 16px; }
.cs-pie { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 18px; border-top: 1px solid var(--vf-borde); background: var(--vf-fondo); border-radius: 0 0 6px 6px; }
.cs-pie .vf-sub { font-size: 12px; color: var(--vf-suave); }
.cs-ok { color: var(--vf-ok) !important; } .cs-mal { color: var(--vf-aviso) !important; }
@media (max-width: 600px) { .cs-pie { flex-direction: column; align-items: stretch; } .cs-pie .vf-btn { justify-content: center; } }
/* ---- Verificación en dos pasos (cs-) ---- */
.cs-page .oculto { display: none !important; }
.cs-page .vf-card-head .vf-badge { align-self: center; }
.cs-estado-acc { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cs-estado-acc .cs-nota { flex-basis: 100%; font-size: 12px; color: var(--vf-suave); }
.cs-page .vf-btn.cs-peligro { color: var(--vf-error); border-color: #f0c4be; }
.cs-page .vf-btn.cs-peligro:hover { background: var(--vf-error-bg); }
.cs-pasos { margin: 0 0 16px; padding: 0; list-style: none; counter-reset: paso; }
.cs-pasos > li { position: relative; padding: 0 0 18px 44px; counter-increment: paso; font-size: 13.5px; }
.cs-pasos > li::before { content: counter(paso); position: absolute; left: 0; top: -2px; width: 28px; height: 28px; border-radius: 50%; background: var(--vf-azul); color: #fff; font-weight: 600; display: flex; align-items: center; justify-content: center; font-size: 13px; }
.cs-pasos > li:not(:last-child)::after { content: ""; position: absolute; left: 13px; top: 30px; bottom: 4px; width: 2px; background: var(--vf-borde); }
.cs-pasos .vf-sub { font-size: 12.5px; color: var(--vf-suave); margin-top: 3px; line-height: 1.5; }
.cs-qr { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.cs-qr-img { width: 172px; height: 172px; border: 1px solid var(--vf-borde); border-radius: 8px; display: flex; align-items: center; justify-content: center; background: #fff; padding: 6px; text-align: center; }
.cs-qr-img img { max-width: 100%; max-height: 100%; }
.cs-clave { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.cs-clave code { font-size: 15px; letter-spacing: 1px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); color: var(--vf-texto); padding: 6px 10px; border-radius: 4px; word-break: break-all; }
.cs-codigo { max-width: 200px; margin-top: 10px; }
.cs-codigo input { font-size: 20px !important; letter-spacing: 4px; text-align: center; }
.cs-codigo.cs-valido input { border-color: var(--vf-ok) !important; box-shadow: 0 0 0 3px rgba(30,142,90,.15); }
.cs-codigo.cs-valido::after { content: "✓ Código correcto"; font-weight: 600; display: block; font-size: 12px; color: var(--vf-ok); margin-top: 5px; }
.cs-confirma { display: flex; gap: 8px; align-items: center; font-size: 13px; font-weight: 500; text-transform: none; margin-top: 8px; color: var(--vf-texto); }
.cs-page .cs-aviso { margin-bottom: 0; }
.cs-page #row_qr_2fa .cs-pie { justify-content: flex-end; }
/* ---- Baja de cuenta (db-) ---- */
.db-acciones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.db-accion { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 14px; display: flex; flex-direction: column; gap: 12px; justify-content: space-between; font-size: 13.5px; }
.db-accion b .fa { color: var(--vf-suave); margin-right: 4px; }
.db-accion .vf-sub, .db-page .vf-sub { font-size: 12.5px; color: var(--vf-suave); margin-top: 3px; }
.db-accion .vf-btn { align-self: flex-start; }
.db-page .vf-btn.db-peligro { color: var(--vf-error); border-color: #f0c4be; }
.db-page .vf-btn.db-peligro:hover { background: var(--vf-error-bg); }
.db-page .vf-btn.db-peligro-fuerte { background: var(--vf-error); border-color: var(--vf-error); color: #fff; }
.db-page .vf-btn.db-peligro-fuerte:disabled { opacity: .45; cursor: not-allowed; }
.db-cerrar { border-color: #f0c4be; }
.db-cerrar .vf-card-head { background: var(--vf-error-bg); border-radius: 6px 6px 0 0; border-bottom-color: #f5c6c0; }
.db-cerrar .vf-card-icon { background: #fff !important; color: var(--vf-error) !important; }
.db-cerrar .vf-card-head h3 { color: #8a271d; }
.db-lista { list-style: none; margin: 0 0 14px; padding: 0; font-size: 13px; }
.db-lista li { margin: 4px 0; } .db-lista .fa { width: 18px; } .db-lista .fa-times-circle { color: var(--vf-error); } .db-lista .fa-info-circle { color: var(--vf-info); }
.db-entiendo { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; font-weight: 500; text-transform: none; margin: 14px 0 0; color: var(--vf-texto); }
.db-entiendo input { margin-top: 2px !important; flex: none; }
.db-pie { display: flex; justify-content: flex-end; padding: 12px 18px; border-top: 1px solid var(--vf-borde); background: var(--vf-fondo); border-radius: 0 0 6px 6px; }
@media (max-width: 767px) { .db-acciones { grid-template-columns: 1fr; } .db-accion .vf-btn, .db-pie .vf-btn { align-self: stretch; justify-content: center; width: 100%; } }
/* custom.css oculta los checkbox: aquí se ven (el oculto de 2FA lleva cl-oculto) */
.db-page input[type=checkbox], .cs-page input[type=checkbox]:not(.cl-oculto) { opacity: 1 !important; float: none !important; position: static !important; visibility: visible !important; width: 16px; height: 16px; margin: 0; display: inline-block !important; }
.db-page input[type=checkbox] + label, .cs-page input[type=checkbox] + label { background: none !important; padding: 0 !important; }
/* ---- Tarifas aplicadas (ta-) ---- */
.ta-page .oculto { display: none !important; }
.ta-limites { margin: 6px 0 8px; padding-left: 18px; }
.ta-titulo { padding: 14px 18px; border-bottom: 1px solid var(--vf-borde); }
.ta-titulo h3 { margin: 0; font-size: 16px; font-weight: 600; color: var(--vf-azul); }
.ta-titulo p { margin: 3px 0 0; font-size: 12.5px; color: var(--vf-suave); line-height: 1.5; }
.ta-titulo-suelto { padding: 0 0 12px; border: none; }
.ta-tabla { font-size: 13px; }
.ta-fila { display: grid; grid-template-columns: 1.3fr 1.3fr 1.1fr 1.1fr .8fr 1.2fr; gap: 12px; padding: 11px 18px; border-top: 1px solid var(--vf-borde); align-items: center; }
.ta-fila.ta-cab { border-top: none; background: var(--vf-fondo); font-size: 11.5px; font-weight: 600; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .3px; }
.ta-fila .vf-label { display: none; }
.ta-rango { font-weight: 600; color: var(--vf-azul); }
.ta-vig { color: var(--vf-suave); }
.ta-planes { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.ta-plan { position: relative; background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; padding: 18px; display: flex; flex-direction: column; gap: 8px; }
.ta-plan.elegido { border: 2px solid var(--vf-ok); box-shadow: 0 2px 10px rgba(30,142,90,.12); }
.ta-tuyo { position: absolute; top: 14px; right: 14px; }
.ta-plan-nombre { font-size: 15px; font-weight: 600; color: var(--vf-azul); padding-right: 80px; }
.ta-plan-precio { font-size: 26px; font-weight: 700; color: var(--vf-texto); font-variant-numeric: tabular-nums; }
.ta-plan-precio span { font-size: 13px; font-weight: 400; color: var(--vf-suave); }
.ta-plan-inc { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.ta-plan-inc li { margin: 4px 0; } .ta-plan-inc .fa { width: 18px; color: var(--vf-ok); } .ta-plan-inc .fa-calendar-o { color: var(--vf-suave); }
.ta-uso { margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--vf-borde); }
.ta-uso-tit { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); margin-bottom: 6px; }
.ta-uso-linea { margin: 6px 0; font-size: 13px; }
.ta-uso-barra { height: 6px; border-radius: 3px; background: var(--vf-gris-bg); overflow: hidden; margin-top: 4px; }
.ta-uso-barra span { display: block; height: 100%; background: var(--vf-turquesa); }
.ta-uso-barra.casi span { background: #e0a800; } .ta-uso-barra.lleno span { background: var(--vf-error); }
@media (max-width: 991px) {
    .ta-fila.ta-cab { display: none; }
    .ta-fila { grid-template-columns: 1fr 1fr; gap: 8px 14px; padding: 14px 16px; }
    .ta-fila .ta-rango { grid-column: 1 / -1; font-size: 14px; }
    .ta-fila .vf-label { display: block; font-size: 11px; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .3px; font-weight: 600; margin-bottom: 1px; }
    .ta-fila .ta-rango .vf-label { display: none; }
}

/* ---- Cuenta y ajustes: correos (18/10/2026) ---- */
/* -----------------------------------------------------------------------------
   Correos (Cuenta y ajustes → Correos): definicion_correos, configuracion_correos,
   texto_adicional_correos, copias_correos (18/10/2026). Prefijo co-.
   ----------------------------------------------------------------------------- */
.co-page .vf-kpi { cursor: pointer; }
.co-listas { padding: 14px; }
.co-page .cu-grupo-head h3 .fa { margin-right: 4px; color: var(--vf-turquesa); }
.co-page .cu-fila-tit .co-estado { margin-left: 6px; font-weight: 600; vertical-align: 1px; }
.co-enls { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 5px; }
.co-enl { font-size: 12.5px; color: var(--vf-turquesa) !important; text-decoration: none !important; white-space: nowrap; }
.co-enl:hover { text-decoration: underline !important; }
.co-enl .fa { margin-right: 3px; }
/* Ventana «Ver el correo» */
.co-ver .co-ver-asunto { display: flex; gap: 10px; align-items: baseline; padding: 0 0 10px; margin-bottom: 10px; border-bottom: 1px solid var(--vf-borde); font-size: 14px; }
.co-ver .co-ver-asunto span { font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); }
.co-ver .co-ver-marco { width: 100%; height: 300px; border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; display: block; }
.co-ver .co-ver-nota { margin-top: 10px; font-size: 12px; color: var(--vf-suave); line-height: 1.5; }
/* Lista de correos (izquierda) + editor (derecha) */
.co-dos { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: start; }
.co-tipos { background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; overflow: hidden; position: sticky; top: 10px; }
.co-tipos .vf-search { margin: 10px; min-width: 0; }
.co-tipos-lista { list-style: none; margin: 0; padding: 0 0 6px; max-height: 62vh; overflow-y: auto; }
.co-tipo { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: none; background: none; padding: 9px 14px; border-left: 3px solid transparent; font-size: 13px; color: var(--vf-texto); cursor: pointer; line-height: 1.35; }
.co-tipo:hover { background: var(--vf-fondo); }
.co-tipo.activo { background: #e6edf7; border-left-color: var(--vf-azul); font-weight: 600; color: var(--vf-azul); }
.co-tipo > span:first-child { flex: 1; min-width: 0; }
.co-tipo .vf-badge { font-size: 10.5px; padding: 2px 7px; }
.co-tipos-tit { padding: 10px 14px 4px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--vf-suave); }
.co-sel-movil { display: none; }
.co-editor-vacio { text-align: center; padding: 50px 20px; color: var(--vf-suave); }
.co-editor-vacio .fa { font-size: 30px; display: block; margin-bottom: 10px; color: #b7c3d1; }
.co-datos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.co-datos .vf-chip { font-size: 11.5px; }
.co-datos .vf-chip.falta { border-color: #f0c36d; background: var(--vf-aviso-bg); }
.co-bloqueado .note-editable { background: var(--vf-fondo); color: var(--vf-suave); }
.co-original { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; background: var(--vf-fondo); max-height: 260px; overflow-y: auto; font-size: 13.5px; line-height: 1.55; overflow-wrap: anywhere; }
.co-original img { max-width: 100%; height: auto; }
.co-acciones { display: flex; gap: 8px; flex-wrap: wrap; }
/* Copias ocultas */
.co-alcances { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.co-alcance { display: flex !important; gap: 10px; align-items: flex-start; border: 1px solid #cfd8e3; border-radius: 6px; padding: 10px 12px; cursor: pointer; margin: 0 !important; font-weight: 400 !important; text-transform: none !important; font-size: 13px !important; color: var(--vf-texto) !important; }
.co-alcance:hover { border-color: var(--vf-turquesa); }
.co-alcance.activo { border-color: var(--vf-azul); background: #f2f6fb; box-shadow: 0 0 0 1px var(--vf-azul) inset; }
.co-alcance input { margin-top: 2px !important; }
.co-alcance b { display: block; font-weight: 600; }
.co-alcance small { display: block; color: var(--vf-suave); font-size: 12px; margin-top: 1px; }
.co-copia-email { font-weight: 600; overflow-wrap: anywhere; }
.co-copia .vf-btn-link.peligro, .co-copia .peligro { color: var(--vf-error) !important; }
@media (max-width: 991px) {
    .co-dos { grid-template-columns: 1fr; }
    .co-tipos { display: none; }
    .co-sel-movil { display: block; margin-bottom: 14px; }
}
@media (max-width: 600px) {
    .co-alcances { grid-template-columns: 1fr; }
    .co-page .cu-fila { align-items: flex-start; }
    .co-acciones .vf-btn { flex: 1 1 100%; justify-content: center; }
}
.co-page .note-editor { margin: 0 !important; }
.co-page .vf-field.pl-editor { padding: 0; }
.co-page input[type=radio] { opacity: 1 !important; float: none !important; position: static !important; visibility: visible !important; width: 16px; height: 16px; margin: 0; display: inline-block !important; flex: none; }
.co-page .vf-btn.peligro { color: var(--vf-error); border-color: #f0c4be; }
.co-page .vf-btn.peligro:hover { background: var(--vf-error-bg); }
.co-page .vf-toolbar .vf-sub { font-size: 12.5px; color: var(--vf-suave); }
.co-page .vf-field.invalido input, .co-page .vf-field.invalido select { border-color: var(--vf-error) !important; }

/* ---- Cuenta y ajustes: autorizados y campos personalizados (18/10/2026) ---- */
/* -----------------------------------------------------------------------------
   Usuarios autorizados / Perfiles de autorizados / Campos personalizados (18/10/2026)
   Prefijos au- (autorizados), pf- (perfiles), nc- (nombre de campos)
   ----------------------------------------------------------------------------- */
.au-page .au-acceso { align-items: center; }
.au-page .au-acceso .vf-banner-body { line-height: 1.9; }
.au-codigo { display: inline-block; padding: 0 8px; border-radius: 4px; background: #fff; border: 1px solid #c7e3ec; font-family: Consolas, monospace; font-size: 14px; letter-spacing: .5px; color: var(--vf-azul); }
.au-page .au-acceso .vf-btn { margin: 0 2px; vertical-align: 1px; }
.au-page .vf-kpi { cursor: pointer; }
.au-list .vf-row { grid-template-columns: minmax(220px, 2fr) minmax(150px, 1fr) minmax(130px, .9fr) 200px; align-items: center; }
.au-cell-persona { display: flex; align-items: center; gap: 12px; }
.au-avatar { flex: none; width: 36px; height: 36px; border-radius: 50%; background: #e6edf7; color: var(--vf-azul); font-weight: 700; font-size: 13px; display: flex; align-items: center; justify-content: center; }
.au-persona { min-width: 0; }
.au-nombre { font-weight: 600; color: var(--vf-texto); overflow-wrap: anywhere; }
.au-row-baja .au-nombre, .vf-row.au-baja .au-nombre, .vf-row.au-baja .au-avatar { color: var(--vf-suave); }
.vf-row.au-baja .au-avatar { background: var(--vf-gris-bg); }
.au-badge-admin { background: #fff4e0; color: #8a5300; }
.au-badge-perfil { background: #e6edf7; color: var(--vf-azul); }
.au-acc { display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.au-mas { position: relative; display: inline-block; }
.au-mas .vf-menu { right: 0; left: auto; }
.au-der { text-align: right; }
.au-ok { color: var(--vf-ok) !important; }
.au-ko { color: var(--vf-error) !important; }
.au-blist .vf-row { grid-template-columns: minmax(180px, 1.6fr) minmax(170px, 1.4fr) 110px 120px 120px; align-items: center; }
.au-modal .vf-field input[type=email], .au-modal .vf-field input[type=password], .au-modal .vf-field input[type=text], .au-modal .vf-field select, .au-modal .vf-field textarea {
    width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; background: #fff; color: var(--vf-texto); box-shadow: none;
}
.au-modal .vf-field textarea { height: auto; min-height: 80px; resize: vertical; }
.au-modal .vf-field input:focus, .au-modal .vf-field select:focus, .au-modal .vf-field textarea:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.au-modal .vf-field.invalido input, .au-modal .vf-field.invalido select { border-color: var(--vf-error); }
.au-modal .vf-field .vf-err { font-size: 12px; color: var(--vf-error); margin-top: 4px; display: none; }
.au-modal .vf-field.invalido .vf-err { display: block; }
.au-modal .vf-field.cu-ancho { grid-column: 1 / -1; }
.au-modal .vf-help a { color: var(--vf-turquesa); text-decoration: underline; }
@media (max-width: 991px) {
    .au-list .vf-row { grid-template-columns: 1fr 1fr; }
    .au-list .au-cell-persona, .au-list .vf-cell-acciones { grid-column: 1 / -1; }
    .au-acc { justify-content: flex-start; }
    .au-blist .vf-row { grid-template-columns: 1fr 1fr 1fr; }
    .au-blist .vf-row > .vf-cell:nth-child(1), .au-blist .vf-row > .vf-cell:nth-child(2) { grid-column: 1 / -1; }
    .au-der { text-align: left; }
    .au-mas { position: static; }
    .vf-row .au-mas .vf-menu { left: 12px; right: 12px; min-width: 0; }
    .au-list .vf-row { position: relative; }
}
@media (max-width: 600px) {
    .au-list .vf-row { grid-template-columns: 1fr 1fr; }
    .au-blist .vf-row { grid-template-columns: 1fr 1fr 1fr; }
    .au-page .au-acceso .vf-banner-body { line-height: 1.7; }
    .au-modal .vf-field input, .au-modal .vf-field select { height: 42px; font-size: 16px; }
}
/* Perfiles de autorizados */
.pf-lista { padding: 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 12px; }
.pf-lista .cu-vacio { grid-column: 1 / -1; }
.pf-tarjeta { display: flex; flex-wrap: wrap; gap: 12px 14px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--vf-borde); border-radius: 8px; background: #fff; }
.pf-tarjeta.pf-admin { background: #fffbf3; border-color: #f3dfb8; }
.pf-t-icono { flex: none; width: 38px; height: 38px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 17px; }
.pf-admin .pf-t-icono { background: #fff4e0; color: #b26a00; }
.pf-t-txt { flex: 1; min-width: 0; }
.pf-t-nombre { font-size: 15px; font-weight: 600; color: var(--vf-texto); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pf-t-desc { font-size: 12.5px; color: var(--vf-suave); margin-top: 3px; line-height: 1.45; overflow-wrap: anywhere; }
.pf-t-desc .pf-sin { font-style: italic; opacity: .8; }
.pf-t-usuarios { font-size: 12px; color: var(--vf-texto); margin-top: 8px; }
.pf-t-usuarios .fa { color: var(--vf-suave); margin-right: 3px; }
.pf-t-acc { flex-basis: 100%; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; padding-top: 10px; border-top: 1px dashed var(--vf-borde); }
.pf-t-acc .au-mas { margin-left: auto; }
.pf-modal-pant .pf-p-barra { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.pf-modal-pant .pf-p-barra .vf-search { flex: 1 1 220px; }
.pf-modal-pant .modal-body { max-height: calc(100vh - 230px); overflow-y: auto; }
.pf-modal-pant .pf-p-pie { margin-right: auto; font-size: 12.5px; color: var(--vf-suave); }
.pf-modal-pant .cu-fila { padding: 9px 14px; }
@media (max-width: 600px) {
    .pf-lista { grid-template-columns: 1fr; padding: 10px; }
    .pf-t-acc .au-mas { margin-left: 0; }
    .pf-modal-pant .modal-body { max-height: none; }
}
.au-modal .cu-sw input[type=checkbox] { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; margin: 0 !important; }
.au-modal .cu-sw + label, .au-modal .cu-sw input + .cu-sw-pista { background-image: none; }
/* Campos personalizados */
.nc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.nc-card .vf-card-icon { font-weight: 700; font-size: 15px !important; }
.nc-card .vf-card-head p { min-height: 18px; }
.nc-modos { margin-top: 16px; }
.nc-modos-tit { font-size: 12px; font-weight: 600; margin-bottom: 6px; }
.nc-modo { display: flex; gap: 10px; align-items: flex-start; padding: 9px 12px; border: 1px solid var(--vf-borde); border-radius: 6px; margin: 0 0 6px; cursor: pointer; font-weight: 400; text-transform: none; color: var(--vf-texto); }
.nc-modo:hover { border-color: #b7c9dc; }
.nc-modo.activo { border-color: var(--vf-turquesa); background: #f1f8fb; }
.cu-page .nc-modo input[type=radio] { margin-top: 2px !important; flex: none; accent-color: var(--vf-azul); }
.nc-modo b { display: block; font-size: 13px; font-weight: 600; }
.nc-modo small { display: block; font-size: 12px; color: var(--vf-suave); line-height: 1.4; margin-top: 1px; }
.nc-page .vf-savebar > span:last-child { display: flex; gap: 8px; }
@media (max-width: 767px) { .nc-grid { grid-template-columns: 1fr; } .nc-page .vf-savebar > span:last-child { flex-direction: column; } }

/* ---- Cuenta y ajustes: notificaciones, Slack, propuestas (18/10/2026) ---- */
/* ---- Notificaciones (notificaciones.php) 18/10/2026 ---- */
.no-lista { list-style: none; margin: 0; padding: 0; }
.no-item { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; border-top: 1px solid var(--vf-borde); }
.no-item:first-child { border-top: none; }
.no-item:not(.leida) { background: #f7fbfd; }
.no-punto { flex: none; width: 9px; height: 9px; border-radius: 50%; margin-top: 6px; background: var(--vf-turquesa); }
.no-item.leida .no-punto { background: transparent; border: 1px solid #c7d3e0; }
.no-cuerpo { flex: 1; min-width: 0; }
.no-tit { font-size: 14px; font-weight: 600; color: var(--vf-texto); }
.no-item.leida .no-tit { font-weight: 500; }
.no-tit .vf-badge { font-size: 10.5px; padding: 1px 7px; margin-left: 6px; vertical-align: 1px; }
.no-desc { font-size: 13px; color: var(--vf-texto); margin-top: 4px; line-height: 1.55; overflow-wrap: anywhere; }
.no-desc img { max-width: 100%; height: auto; }
.no-desc p { margin: 0 0 6px; font-size: inherit; line-height: inherit; color: inherit; }
.no-desc a { color: var(--vf-turquesa); text-decoration: underline; }
.no-fecha { font-size: 11.5px; color: var(--vf-suave); margin-top: 5px; }
.no-acc { flex: none; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.no-acc .no-borrar, .no-acc .no-borrar .fa { color: var(--vf-error); }
.no-acc .no-borrar:hover { border-color: var(--vf-error); }
.no-acc .no-borrar span { display: none; }
@media (max-width: 767px) {
    .no-item { flex-wrap: wrap; padding: 12px; }
    .no-cuerpo { flex-basis: calc(100% - 25px); }
    .no-acc { width: 100%; justify-content: flex-start; padding-left: 21px; }
    .no-acc .no-borrar span { display: inline; }
}
/* ---- Avisos en Slack (configuracion_slack.php) 18/10/2026 ---- */
.sl-lista { list-style: none; margin: 0; padding: 0; }
.sl-item { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(0, 2fr) auto; gap: 16px; align-items: start; padding: 14px 18px; border-top: 1px solid var(--vf-borde); }
.sl-item:first-child { border-top: none; }
.sl-ev-tit { font-size: 13.5px; font-weight: 600; color: var(--vf-azul); }
.sl-ev-tit .fa { color: #e0a800; margin-right: 3px; }
.sl-ev-desc { font-size: 12px; color: var(--vf-suave); margin-top: 3px; line-height: 1.45; }
.sl-msg-txt { font-size: 13px; line-height: 1.55; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; padding: 8px 10px; overflow-wrap: anywhere; }
.sl-var { display: inline-block; padding: 0 6px; border-radius: 4px; background: #e6edf7; color: var(--vf-azul); font-size: 11.5px; font-weight: 600; font-family: Menlo, Consolas, monospace; }
.sl-suave { color: var(--vf-suave); }
.sl-canal { font-size: 12px; color: var(--vf-suave); margin-top: 6px; overflow-wrap: anywhere; }
.sl-acc { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.sl-acc .sl-borrar, .sl-acc .sl-borrar .fa { color: var(--vf-error); }
.sl-acc .sl-borrar span { display: none; }
.sl-pie { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; margin-top: 5px; }
.sl-pie .vf-help { margin-top: 0; }
.sl-contador { font-size: 12px; color: var(--vf-suave); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sl-contador.lleno { color: var(--vf-aviso); font-weight: 600; }
.sl-vars { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sl-vars .vf-chip .fa { font-size: 10px; margin-right: 3px !important; color: var(--vf-turquesa); }
.sl-page #sl_modal textarea { min-height: 110px; }
@media (max-width: 991px) {
    .sl-item { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
    .sl-acc { justify-content: flex-start; }
    .sl-acc .sl-borrar span { display: inline; }
}
/* ---- Propuestas de mejora (propuesta_desarrollo.php) 18/10/2026 ---- */
.pd-page .vf-chips { align-items: center; }
.pd-page .vf-chip .fa { margin-right: 4px !important; }
.pd-page #pd_orden { height: 30px; font-size: 12.5px; }
.pd-lista { list-style: none; margin: 0; padding: 0; }
.pd-item { display: flex; gap: 16px; padding: 16px 18px; border-top: 1px solid var(--vf-borde); }
.pd-item:first-child { border-top: none; }
.pd-votos { flex: none; display: flex; flex-direction: column; gap: 6px; width: 58px; }
.pd-voto { display: flex; align-items: center; justify-content: center; gap: 6px; height: 34px; border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; color: var(--vf-suave); font-size: 13px; cursor: pointer; padding: 0 6px; }
.pd-voto .fa { font-size: 15px; color: var(--vf-turquesa); }
.pd-voto.no .fa { color: #9aa7b6; }
.pd-voto b { font-weight: 600; color: var(--vf-texto); font-variant-numeric: tabular-nums; }
.pd-voto:hover { border-color: var(--vf-turquesa); }
.pd-voto.mio { background: #e6f3f7; border-color: var(--vf-turquesa); }
.pd-voto.no.mio { background: var(--vf-error-bg); border-color: #f0b8b1; }
.pd-voto.no.mio .fa { color: var(--vf-error); }
.pd-cuerpo { flex: 1; min-width: 0; }
.pd-cab { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pd-tit { font-size: 15px; font-weight: 600; color: var(--vf-azul); overflow-wrap: anywhere; }
.pd-texto { font-size: 13.5px; line-height: 1.6; margin-top: 6px; color: var(--vf-texto); overflow-wrap: anywhere; }
.pd-meta { font-size: 12px; color: var(--vf-suave); margin-top: 6px; }
.pd-gestor { margin-top: 10px; padding: 10px 12px; border-left: 3px solid var(--vf-turquesa); background: var(--vf-info-bg); border-radius: 0 6px 6px 0; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; }
.pd-gestor-tit { font-size: 12px; font-weight: 600; color: var(--vf-turquesa); margin-bottom: 3px; }
.pd-gestor p, .pd-com p { margin: 0 0 4px; font-size: inherit; color: inherit; }
.pd-acc { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.pd-borrar, .pd-borrar .fa { color: var(--vf-error) !important; }
.pd-resp:empty { display: none; }
.pd-resp { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.pd-com { padding: 9px 12px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; }
.pd-com.tadosi { background: var(--vf-info-bg); border-color: #c7e3ec; }
.pd-com-cab { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--vf-suave); margin-bottom: 3px; }
.pd-com-cab b { color: var(--vf-texto); }
.pd-com.tadosi .pd-com-cab b { color: var(--vf-turquesa); }
.pd-com-cab .vf-btn-link { margin-left: auto; padding: 0 4px; }
.pd-pie { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; margin-top: 5px; }
.pd-pie .vf-help { margin-top: 0; }
.pd-contador { font-size: 12px; color: var(--vf-suave); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pd-contador.lleno { color: var(--vf-aviso); font-weight: 600; }
.pd-page #pd_modal textarea { min-height: 160px; }
@media (max-width: 600px) {
    .pd-item { gap: 10px; padding: 12px; }
    .pd-votos { width: 50px; }
    .pd-page .vf-toolbar .vf-chips { width: 100%; }
    .pd-page #pd_orden { flex: 1; }
}
/* Baja de cuenta: «Ver qué incluye» de cada grupo desactivado (19/10/2026) */
.db-page .db-tanda .cu-fila-acc { flex-wrap: wrap; justify-content: flex-end; }
.db-page li.db-det { list-style: none; padding: 0 18px 14px; border-top: none; }
.db-page li.db-det.oculto { display: none; }
.db-det-cab { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 10px 12px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px 6px 0 0; font-size: 13px; }
.db-det-res .vf-badge { margin-left: 4px; }
.db-det-buscar-c { flex: 0 1 260px; min-width: 180px; }
.db-det-lista { border: 1px solid var(--vf-borde); border-top: none; border-radius: 0 0 6px 6px; max-height: 360px; overflow-y: auto; }
.db-det-fila { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto 128px; gap: 10px; align-items: center; padding: 8px 12px; border-top: 1px solid var(--vf-borde); font-size: 13px; }
.db-det-fila:first-child { border-top: none; }
.db-det-tipo .fa { color: var(--vf-suave); }
.db-det-txt { min-width: 0; display: flex; flex-direction: column; }
.db-det-cli { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db-det-con { font-size: 12px; color: var(--vf-suave); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db-det-imp { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.db-det-est { text-align: right; }
.db-det-no .db-det-cli, .db-det-no .db-det-imp { color: var(--vf-suave); }
.db-det-pie { padding: 12px; text-align: center; font-size: 12.5px; color: var(--vf-suave); }
.db-det-pie.oculto { display: none; }
.db-det-aviso { margin: 0; }
.vf-aviso-txt .db-q-lista { text-align: left; margin: 10px auto 0; padding-left: 18px; max-width: 360px; font-size: 13px; }
.vf-aviso-txt .db-q-lista li { margin: 2px 0; }
.vf-aviso-txt .db-q-imp { color: var(--vf-suave); white-space: nowrap; }
.vf-aviso-txt .db-q-nota { margin-top: 8px; font-size: 12.5px; color: var(--vf-suave); }
@media (max-width: 600px) {
    .db-page li.db-det { padding: 0 12px 12px; }
    .db-det-fila { grid-template-columns: 20px minmax(0, 1fr) auto; }
    .db-det-est { grid-column: 2 / -1; text-align: left; }
    .db-det-buscar-c { flex: 1 1 100%; }
}

/* =============================================================================
   MENÚ DOMICILIACIONES (19/10/2026): rentas.php, nueva_renta.php, asistente.php, envio_enlace_cliente.php,
   calculo_fechas_gc.php, domiciliaciones_emitidas.php, domiciliaciones_devueltas.php, cancelacion_masiva.php,
   rentas_cliente.php, rentas_mod_masiva.php, envio_dom_masiva.php, movimientos_renta.php, modificar_cuenta.php,
   stripe_pay.php, custom_mandate.php y ventanas de domiciliaciones
   Prefijos: dv- (común), rn-, nr-, as-, ee-, cfc-, re-, rd-, cm-, rc-, mm-, em-, mr-, mcu-, sp-, cmd-, vm-
   ============================================================================= */

/* -- 00_DV -- */
/* -- Común del menú Domiciliaciones (domiciliaciones_comun_vf.js, objeto DV) -- */
.dv-pas { display: inline-block; font-size: 10.5px; font-weight: 600; letter-spacing: .2px; padding: 1px 7px; border-radius: 10px; border: 1px solid var(--vf-borde); color: var(--vf-suave); background: #fff; white-space: nowrap; vertical-align: middle; }
.dv-pas-gc { color: #1B799B; border-color: #b9dce8; background: #f0f8fb; }
.dv-pas-ms { color: #7a3fa0; border-color: #dcc8ea; background: #f8f2fc; }
.dv-cod { font-family: Consolas, monospace; font-size: 11.5px; color: var(--vf-suave); font-weight: 400; }
a.dv-cli { color: var(--vf-azul); font-weight: 600; }
a.dv-cli:hover { color: var(--vf-turquesa, #1B799B); text-decoration: underline; }
.dv-mas-ico { padding-left: 8px; padding-right: 8px; }
.dv-vacio { margin: 10px 0; }

/* =============================================================================
   VENTANAS COMPARTIDAS DE DOMICILIACIONES (19/10/2026): DV.ventanasFormatoNuevo (.vm-legacy)
   (../includes/modals + modal_generar_recibo.php: solo cambia el aspecto en las pantallas que lo llaman)
   ============================================================================= */
.vm-legacy .vm-oculto { display: none !important; }
.vm-legacy .modal-header h4.modal-title { text-transform: none; text-align: left !important; }
.vm-legacy .modal-header #myLargeModalLabel { text-transform: none; }
.vm-legacy .modal-body .titulo-tabla { background: none; box-shadow: none; padding: 0; margin: 0; border: 0; font-size: inherit; color: inherit; }
.vm-legacy h4.titulo-tabla { font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 700; margin: 18px 0 8px; background: none; box-shadow: none; padding: 0; }
.vm-legacy .modal-footer { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; align-items: center; }
.vm-legacy .modal-footer .vf-btn, .vm-legacy .modal-body .vf-btn { margin: 0 !important; float: none !important; min-width: 0; height: auto; box-shadow: none; }
.vm-legacy .form-group { margin-bottom: 12px; position: relative; }
.vm-legacy .control-label, .vm-legacy label { font-size: 12px; font-weight: 600; color: var(--vf-texto); text-transform: none; letter-spacing: 0; }
.vm-legacy star { color: var(--vf-error); margin-left: 2px; }
.vm-legacy .icon_info, .vm-legacy #icon_info, .vm-legacy .icono-info { color: #9aa8ba; font-size: 12px; }
.vm-legacy .form-control { border: 1px solid #cfd8e3; border-radius: 4px; height: 38px; box-shadow: none; font-size: 13px; color: var(--vf-texto); }
.vm-legacy textarea.form-control { height: auto; }
.vm-legacy .form-control:focus { border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
/* El <select> nativo que deja bootstrap-select debajo: invisible y sin ocupar sitio, pero «visible» para la validación (no display:none) */
.vm-legacy .bootstrap-select > select, .rn-modal-mod .bootstrap-select > select { width: .5px !important; height: .5px !important; opacity: 0 !important; pointer-events: none; position: absolute !important; padding: 0 !important; border: 0 !important; }
.vm-legacy .alert { border-radius: 6px; font-size: 13px; line-height: 1.5; box-shadow: none; }
.vm-legacy .alert-danger, .vm-legacy .alert-warning { background: var(--vf-aviso-bg); color: #7a4a00; border: 1px solid #f3dcb0; }
.vm-legacy .alert-info { background: var(--vf-info-bg); color: #0f5468; border: 1px solid #c7e3ec; }
/* Casillas: la casilla de verdad delante del texto (sin la imagen de custom.css, que salía repetida) */
.vm-legacy input[type=checkbox] { vertical-align: middle; accent-color: var(--vf-azul); margin-right: 6px !important; }
.vm-legacy input[type=checkbox] + label { background: none !important; padding: 0 !important; display: inline !important; vertical-align: middle; float: none !important; font-size: 13px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important; color: var(--vf-texto) !important; }
.vm-legacy input[type=radio] { vertical-align: middle; margin: 0 6px 0 0; accent-color: var(--vf-azul); }
.vm-legacy input[type=radio] + label { display: inline; font-weight: 500; font-size: 13px; }
/* Tablas de bootstrap-table como listas vf */
.vm-legacy .bootstrap-table .fixed-table-container { border: 1px solid var(--vf-borde) !important; border-radius: 6px; box-shadow: none !important; }
.vm-legacy .bootstrap-table .table > thead > tr > th, .vm-legacy table.table thead th { background: var(--vf-fondo) !important; color: var(--vf-suave) !important; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; border-bottom: 1px solid var(--vf-borde) !important; }
.vm-legacy .bootstrap-table .table > thead > tr > th .th-inner { color: var(--vf-suave) !important; }
.vm-legacy .bootstrap-table .table > tbody > tr > td { border-top: 0; border-bottom: 1px solid #eef1f5; font-size: 13px; color: var(--vf-texto); background: #fff !important; padding: 8px 10px; }
.vm-legacy .bootstrap-table .table > tbody > tr:hover > td { background: #fafcff !important; }
.vm-legacy .fixed-table-toolbar .columns { display: none !important; }
.vm-legacy .fixed-table-toolbar { padding: 0 0 8px; }
.vm-legacy .fixed-table-toolbar .search { float: none !important; width: 100%; max-width: 320px; margin: 0; position: relative; }
.vm-legacy .fixed-table-toolbar .search input { height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 6px 10px 6px 30px; font-size: 13px; box-shadow: none; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236b7a8c' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") no-repeat 10px center; }
.vm-legacy .fixed-table-pagination .pagination > li > a { border-radius: 4px; margin: 0 2px; }
.vm-legacy .fixed-table-pagination .pagination-info, .vm-legacy .fixed-table-pagination .page-list { font-size: 12px; color: var(--vf-suave); }
.vm-legacy .fila-seleccion-tabla-cancelada td { color: var(--vf-suave) !important; }
/* Productos */
.vm-modal-seleccion-producto .reducir-cantidad, .vm-modal-seleccion-producto .anadir-cantidad { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--vf-borde); background: #fff; color: var(--vf-azul); font-weight: 700; padding: 0; box-shadow: none; cursor: pointer; }
.vm-modal-seleccion-producto .reducir-cantidad:hover, .vm-modal-seleccion-producto .anadir-cantidad:hover { border-color: var(--vf-turquesa); background: #f5fafc; }
.vm-modal-seleccion-producto .span-btn-plus-minus { display: inline-block; min-width: 26px; text-align: center; font-weight: 700; border: 0; }
.vm-modal-seleccion-producto .modal-footer .div-mandato-firmado { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; padding: 7px 12px !important; margin: 0 auto 0 0 !important; box-shadow: none; }
.vm-modal-seleccion-producto .input-modificar-concepto { display: flex; align-items: center; gap: 6px; }
/* Pagos por fuera */
.vm-modal-pagos-por-fuera #btnInsertarCobroFF { float: right !important; }
.vm-modal-pagos-por-fuera .borrar-cobro { color: var(--vf-error); cursor: pointer; }
.vm-modal-pagos-por-fuera #col_tipo_seleccion_fecha_fin_ff label { display: inline; }
/* Generar recibo */
.vm-modal-generar-recibo #titulo_modal_generar_recibo { text-align: left !important; margin-top: 4px !important; font-size: 13px; color: var(--vf-suave); font-weight: 600; }
.vm-modal-generar-recibo .leer-mas-span { font-weight: 600; }
.vm-modal-generar-recibo .vf-help { font-size: 12px; color: var(--vf-suave); margin-top: 4px; }
.vm-modal-generar-recibo .rn-rec-min:empty { display: none; }
.vm-modal-generar-recibo .rn-rec-min { color: var(--vf-ok); font-weight: 600; }
/* Meses */
.vm-modal-seleccion-meses #div_tabla_normal_meses, .vm-modal-seleccion-meses #div_tabla_responsive_meses { display: none !important; }
.vm-ayuda { border: 1px solid var(--vf-borde); border-radius: 6px; margin-bottom: 12px; background: var(--vf-fondo); }
.vm-meses { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.vm-mes { display: flex; align-items: center; gap: 10px; border: 1px solid var(--vf-borde); border-radius: 8px; background: #fff; padding: 9px 10px; text-align: left; cursor: pointer; color: var(--vf-texto); }
.vm-mes:hover { border-color: var(--vf-turquesa); }
.vm-mes-sw { flex: none; width: 34px; height: 20px; border-radius: 10px; background: #cfd8e3; position: relative; transition: background .15s; }
.vm-mes-sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: left .15s; }
.vm-mes.on .vm-mes-sw { background: var(--vf-ok); }
.vm-mes.on .vm-mes-sw::after { left: 16px; }
.vm-mes-txt b { display: block; font-size: 13px; font-weight: 600; }
.vm-mes-txt small { font-size: 11.5px; color: var(--vf-suave); }
.vm-mes:not(.on) .vm-mes-txt b { color: var(--vf-suave); text-decoration: line-through; }
.vm-mes.no-toca { background: #fafbfd; }
.vm-mes.no-toca .vm-mes-txt b { color: var(--vf-suave); }
/* Versiones */
.vm-modal-mod-domiciliaciones #div_tabla_normal_mod_domiciliaciones, .vm-modal-mod-domiciliaciones #div_tabla_responsive_mod_domiciliaciones { display: none !important; }
.vm-versiones { list-style: none; margin: 0; padding: 0; }
.vm-ver { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid #eef1f5; }
.vm-ver > .fa { flex: none; width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; background: #e6edf7; color: var(--vf-azul); }
.vm-ver.ok > .fa { background: var(--vf-ok-bg); color: var(--vf-ok); } .vm-ver.error > .fa { background: var(--vf-error-bg); color: var(--vf-error); } .vm-ver.gris > .fa { background: var(--vf-gris-bg); color: var(--vf-suave); }
.vm-ver-cuerpo { flex: 1; min-width: 0; }
.vm-ver-cab { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; font-size: 13px; }
.vm-ver-cab span { font-size: 12px; color: var(--vf-suave); }
.vm-ver-datos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.vm-ver-dato { font-size: 12px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 12px; padding: 2px 9px; }
.vm-ver-dato em { font-style: normal; color: var(--vf-suave); }
.vm-ver-dato.cambio { background: #fff4d6; border-color: #f3dcb0; }
.vm-ver-dato s { color: var(--vf-suave); }
@media (max-width: 600px) {
    .vm-meses { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vm-legacy .modal-footer { justify-content: stretch; }
    .vm-legacy .modal-footer .vf-btn { flex: 1; justify-content: center; }
    .vm-modal-seleccion-producto .modal-footer .div-mandato-firmado { flex-basis: 100%; text-align: center; }
}
/* Plan de pagos (antes en F1.css como .rn-legacy) */
.vm-modal-plan-pagos #toolbar_plan_pagos { display: flex; flex-wrap: wrap; gap: 8px 6px; align-items: center; margin-bottom: 6px; }
.vm-modal-plan-pagos #toolbar_plan_pagos .d-inline { display: flex !important; align-items: center; }
.vm-modal-plan-pagos #toolbar_plan_pagos label { float: none !important; white-space: nowrap; cursor: help; padding-right: 18px !important; }
.vm-modal-plan-pagos #toolbar_plan_pagos input[type=checkbox] { float: none !important; position: static !important; opacity: 1 !important; width: 15px; height: 15px; margin: 0 6px 0 0 !important; cursor: pointer; }
.vm-modal-plan-pagos .rn-pp-ayuda { margin: 4px 0 10px; font-size: 12px; }
/* .vf-modal .oculto lleva !important (tadosi-ui.css): en estas ventanas el JS antiguo enseña con .show() cosas que llevan «oculto» (tablas del móvil) */
.vm-legacy .oculto[style*="display: block"] { display: block !important; }
.vm-legacy .oculto[style*="display: inline"] { display: inline !important; }
.vm-meses-ej { margin-top: 12px; font-size: 12px; color: var(--vf-suave); }
@media (max-width: 600px) { .vm-fa-meses { grid-template-columns: repeat(4, 1fr); } }

/* -- F1 -- */
/* =============================================================================
   DOMICILIACIONES — rentas.php (19/10/2026): lista, ficha lateral y ventanas (.rn-)
   ============================================================================= */
.rn-page .rn-especial { padding: 0; margin-bottom: 16px; }
.rn-page .rn-especial-in { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 16px; }
.rn-page .rn-especial-in .vf-search { flex: 1 1 320px; }
.rn-page .rn-especial-txt { border-bottom: 0; border-top: 1px solid var(--vf-borde); }
.rn-page .rn-especial-txt .fa { color: var(--vf-turquesa); margin-right: 4px; }
.rn-page #div_resultados { align-items: center; }
.rn-page #div_resultados .vf-banner-body a { font-weight: 600; text-decoration: underline; }
.rn-page #div_resultados .crm-cerrar { margin-left: auto; }

.rn-page .rn-kpis .vf-kpi { cursor: pointer; }
.rn-page a.vf-tab { display: inline-block; text-decoration: none; }
.rn-page .vf-tab .fa { margin-right: 3px; }
.rn-page #a_ampliar_busqueda.activo { border-color: var(--vf-azul); color: var(--vf-azul); }
.rn-page .rn-nfiltros { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--vf-azul); color: #fff; font-size: 10.5px; }
.rn-page #rn_pasarela { height: 34px; }

/* Filtros (Ampliar búsqueda) */
.rn-filtros { padding: 14px 16px 12px; border-bottom: 1px solid var(--vf-borde); background: #fbfcfe; }
.rn-filtros-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px 14px; }
.rn-filtros .vf-field label { display: block; font-size: 11.5px; font-weight: 600; color: var(--vf-suave); margin-bottom: 4px; text-transform: uppercase; letter-spacing: .3px; }
.rn-filtros .vf-field select, .rn-filtros .vf-field input { width: 100%; height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 4px 8px; font-size: 13px; background: #fff; color: var(--vf-texto); }
.rn-filtros-pie { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }

/* Lista */
.rn-list .vf-row { grid-template-columns: minmax(220px, 1.6fr) minmax(170px, 1.1fr) minmax(150px, 1fr) minmax(200px, 1.4fr) 150px; align-items: start; cursor: pointer; }
.rn-list .vf-row.vf-row-head { cursor: default; }
.rn-list .rn-row { border-left: 3px solid transparent; }
.rn-list .rn-row.rn-n-error { border-left-color: var(--vf-error); }
.rn-list .rn-row.rn-n-aviso { border-left-color: #e0a800; }
.rn-list .rn-row.rn-baja .rn-concepto, .rn-list .rn-row.rn-baja .rn-imp { color: var(--vf-suave); }
.rn-concepto { font-weight: 600; color: var(--vf-azul); font-size: 14px; line-height: 1.3; }
.rn-cli { margin-top: 3px; font-size: 13px; }
.rn-cli a.dv-cli { font-weight: 500; }
.rn-pie { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.rn-nota-ico { font-size: 11px; color: #8a5300; background: #fff4d6; border-radius: 10px; padding: 1px 7px; }
.rn-imp { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; }
.rn-imp .rn-per { font-weight: 500; font-size: 12px; color: var(--vf-suave); }
.rn-imp-sp { font-weight: 600; font-size: 13px; color: var(--vf-texto); }
.rn-imp-sp .fa { color: var(--vf-turquesa); }
.rn-prox .fa, .rn-meses .fa, .rn-inicial .fa { color: var(--vf-turquesa); width: 14px; }
.rn-meses { color: #8a5300; }
.rn-ok { color: var(--vf-ok); }
.rn-pend { color: #8a5300; font-weight: 600; }
.rn-aviso-txt { color: #8a5300; }
.rn-recibos { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.rn-r { font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rn-r .fa { width: 13px; text-align: center; }
.rn-r.ok { color: var(--vf-ok); } .rn-r.error { color: var(--vf-error); } .rn-r.info { color: var(--vf-info); } .rn-r.aviso { color: var(--vf-aviso); }
.rn-badges { display: flex; flex-wrap: wrap; gap: 4px; }
.rn-que { margin-top: 6px; }
.rn-c-acc { text-align: right; }
.rn-c-acc .rn-alta { display: block; margin-bottom: 6px; }
.rn-btns { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; align-items: center; }
.rn-btns .vf-btn-primary { white-space: nowrap; }
.rn-list .cl-mas .vf-menu { min-width: 270px; text-align: left; max-height: 70vh; overflow-y: auto; }
#rn_lista.rn-recargando { opacity: .55; pointer-events: none; transition: opacity .15s; }
.vf-btn.rn-btn-peligro { background: var(--vf-error); border-color: var(--vf-error); color: #fff; }
.vf-btn.rn-btn-peligro-borde { color: var(--vf-error); border-color: #f0b8b1; }
.vf-btn.rn-btn-peligro-borde:hover { background: var(--vf-error-bg); }

@media (max-width: 991px) {
    .rn-list .vf-row { grid-template-columns: 1fr 1fr; }
    .rn-list .rn-c-dom, .rn-list .rn-c-sit { grid-column: 1 / -1; }
    .rn-list .rn-c-acc { grid-column: 1 / -1; text-align: left; position: relative; }
    .rn-list .rn-c-acc .rn-alta { display: none; }
    .rn-btns { justify-content: flex-start; }
}
@media (max-width: 600px) {
    .rn-list .vf-row { grid-template-columns: 1fr; }
    .rn-page .rn-especial-in .vf-btn { flex: 1; justify-content: center; }
    .rn-page .vf-tabs { overflow-x: auto; }
}

/* Ficha lateral */
.rn-ficha .crm-ficha-tit h3 { font-size: 17px; }
.rn-f-avatar { background: var(--vf-ok); }
.rn-f-avatar.rn-av-aviso { background: #e0a800; } .rn-f-avatar.rn-av-error { background: var(--vf-error); } .rn-f-avatar.rn-av-gris { background: #9aa8ba; }
.rn-f-badges { margin-bottom: 12px; }
.rn-f-que ul { margin: 4px 0 0; padding-left: 18px; }
.rn-f-que .fa-lightbulb-o { font-size: 20px; }
.rn-f-txt { margin: 0 0 8px; font-size: 13px; }
.rn-f-nota { background: #fffaf0; border: 1px solid #f3e2bd; border-radius: 8px; padding: 8px 10px; font-size: 13px; white-space: normal; }
.rn-ficha .crm-datos { grid-template-columns: 110px minmax(0, 1fr); }
.rn-tabla-rec { width: 100%; font-size: 13px; border-collapse: collapse; }
.rn-tabla-rec td { padding: 5px 4px; border-bottom: 1px solid #eef1f5; }
.rn-tabla-rec td.rn-n { text-align: center; width: 50px; color: var(--vf-suave); }
.rn-tabla-rec tr.ok td:first-child { color: var(--vf-ok); } .rn-tabla-rec tr.error td:first-child { color: var(--vf-error); }
.rn-tabla-rec tr.info td:first-child { color: var(--vf-info); } .rn-tabla-rec tr.aviso td:first-child { color: var(--vf-aviso); } .rn-tabla-rec tr.gris td { color: var(--vf-suave); }
.rn-tabla-rec tr.rn-total td { font-weight: 700; border-top: 2px solid var(--vf-borde); }
.rn-enlace { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 8px; padding: 8px 10px; margin: 6px 0 4px; }
.rn-enlace-tit { font-size: 11.5px; font-weight: 600; color: var(--vf-suave); margin-bottom: 5px; }
.rn-enlace-fila { display: flex; gap: 6px; }
.rn-enlace-fila input { flex: 1; min-width: 0; height: 30px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 3px 8px; font-size: 12px; background: #fff; color: var(--vf-texto); }
.rn-f-grupo { margin-bottom: 10px; }
.rn-f-grupo-tit { font-size: 11px; color: var(--vf-suave); font-weight: 600; margin-bottom: 4px; }
.rn-f-acciones { display: flex; flex-wrap: wrap; gap: 6px; }
.rn-f-acc { border: 1px solid var(--vf-borde); background: #fff; border-radius: 16px; padding: 4px 11px; font-size: 12.5px; color: var(--vf-texto); cursor: pointer; text-align: left; }
.rn-f-acc:hover { border-color: var(--vf-turquesa); color: var(--vf-azul); background: #f5fafc; }
.rn-f-acc .fa { color: var(--vf-turquesa); margin-right: 3px; }
.rn-f-acc.peligro, .rn-f-acc.peligro .fa { color: var(--vf-error); }
.rn-f-pie { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 600px) { .rn-ficha .crm-datos { grid-template-columns: 1fr; } .rn-ficha .crm-datos dt { margin-top: 4px; } }

/* Ventana Modificar (modal_modificar_renta.php) */
.rn-modal-mod .rn-mod-actual { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 8px; padding: 10px 14px 4px; margin-bottom: 14px; }
.rn-modal-mod .rn-mod-actual-tit { font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 700; margin-bottom: 6px; }
.rn-modal-mod .rn-mod-dl { margin: 0; }
.rn-modal-mod .rn-mod-dl > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; padding: 3px 0; font-size: 13px; }
.rn-modal-mod .rn-mod-dl > div.d-none { display: none; }
.rn-modal-mod .rn-mod-dl dt { color: var(--vf-suave); font-weight: 500; }
.rn-modal-mod .rn-mod-dl dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.rn-modal-mod .rn-mod-tabs .nav { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--vf-borde); margin: 0 0 14px; padding: 0; }
.rn-modal-mod .rn-mod-tabs .nav > li { float: none; width: auto !important; margin: 0; }
.rn-modal-mod .rn-mod-tabs .nav > li > a { border: none; border-bottom: 3px solid transparent; border-radius: 0; padding: 10px 14px 9px; color: var(--vf-suave); background: none !important; font-size: 13px; font-weight: 500; margin: 0; }
.rn-modal-mod .rn-mod-tabs .nav > li.active > a, .rn-modal-mod .rn-mod-tabs .nav > li > a:hover { color: var(--vf-azul); border-bottom-color: var(--vf-azul); }
.rn-modal-mod .rn-mod-tabs .nav > li.active > a { font-weight: 600; }
.rn-modal-mod .rn-mod-importe { display: flex; gap: 8px; max-width: 360px; }
.rn-modal-mod .rn-mod-importe input { flex: 1; }
.rn-modal-mod .rn-mod-fin { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 14px 0 10px; }
.rn-modal-mod .rn-radios { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.rn-modal-mod .rn-radios.d-none { display: none; }
.rn-modal-mod #dom_no_indefinida.d-none, .rn-modal-mod #group_cuotas.d-none { display: none; }
.rn-modal-mod .rn-mod-concepto { margin-top: 12px; }
.rn-check { display: inline-flex; align-items: center; gap: 7px; font-weight: 500; font-size: 13px; color: var(--vf-texto); cursor: pointer; margin: 0; text-transform: none; letter-spacing: 0; }
.rn-check input[type=checkbox], .rn-check input[type=radio] { opacity: 1 !important; position: static !important; float: none !important; margin: 0 !important; width: 16px; height: 16px; cursor: pointer; }
.rn-check-grande { font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.rn-modal-mod .rn-mod-conf .card { box-shadow: none; border: 1px solid var(--vf-borde); border-radius: 8px; }
.rn-modal-mod .rn-mod-conf .form-control, .rn-modal-mod .rn-mod-conf input[type=text], .rn-modal-mod .rn-mod-conf input[type=number], .rn-modal-mod .rn-mod-conf textarea { border: 1px solid #cfd8e3; border-radius: 4px; box-shadow: none; }
.rn-modal-mod .rn-mod-conf label { text-transform: none; font-size: 12px; }
.rn-modal-mod .bootstrap-datetimepicker-widget { z-index: 1060; }

.rn-modal-mod .rn-mod-tabs .nav > li > a { text-transform: none; letter-spacing: 0; }
.rn-enlace .vf-help, .rn-ficha .vf-help { font-size: 11.5px; color: var(--vf-suave); margin-top: 4px; }
/* Casillas de conf_facturas.php dentro de la ventana: la casilla normal (sin la imagen de custom.css) */
.rn-modal-mod .rn-mod-conf input[type=checkbox] { vertical-align: middle; margin-right: 6px !important; accent-color: var(--vf-azul); }
.rn-modal-mod .rn-mod-conf input[type=checkbox] + label { background: none !important; padding: 0 !important; display: inline !important; vertical-align: middle; font-size: 13px !important; font-weight: 500 !important; text-transform: none !important; color: var(--vf-texto) !important; letter-spacing: 0 !important; }
/* 19/10/2026: casillas del plan de pagos (y demás ventanas antiguas): la casilla de verdad a la izquierda, sin la imagen de custom.css */
.rn-modal-mod .rn-fc-col { margin-bottom: 8px; }
.rn-modal-mod .rn-fc-help { margin: 2px 0 0 22px; font-size: 12px; color: var(--vf-suave); }
.rn-modal-mod #row_idioma_factura .bootstrap-select { width: 100% !important; }
.rn-contrato { padding: 6px 0; border-bottom: 1px solid #eef1f5; font-size: 13px; }
.rn-contrato:last-child { border-bottom: 0; }
.rn-contrato .vf-badge { margin-left: 4px; }
.rn-modal-mod .rn-mod-conf .input-group-btn > .btn, .vm-legacy .input-group-btn > .btn { border-radius: 4px !important; height: 38px; min-width: 38px; padding: 0 12px; margin-left: 6px; box-shadow: none !important; background: #fff !important; color: var(--vf-azul) !important; border: 1px solid var(--vf-borde) !important; font-weight: 700; }
.rn-contacto { margin-top: 2px; display: flex; flex-wrap: wrap; gap: 4px 12px; }
.rn-contacto .fa { width: 12px; text-align: center; color: var(--vf-suave); }
/* 21/10/2026 */
.rn-pend-ini, .rn-pend.rn-pend-ini { color: #c0392b; font-weight: 700; }
.rn-row.rn-modificada { box-shadow: inset 4px 0 0 #2f6fd6; background: #f3f8ff; }
.rn-mod-marca { display: inline-block; font-size: 11.5px; font-weight: 600; color: #1d4f9c; background: #e3eefc; border-radius: 10px; padding: 1px 8px; margin-bottom: 3px; }
.vf-error-txt { color: #c0392b; }
a.rn-badge-link, a.rn-badge-link:hover, a.rn-badge-link:focus { text-decoration: none; cursor: pointer; }
a.rn-badge-link:hover { box-shadow: 0 0 0 1px currentColor; }
a.rn-badge-link .fa-external-link { font-size: 10px; opacity: .75; }
/* 21/10/2026: colores por grupo en el menú «···» y en «Qué puedes hacer» de la domiciliación */
.rn-g-tit[data-g] { display: flex; align-items: center; gap: 6px; }
.rn-g-tit[data-g]::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.rn-g-tit[data-g="cobros"]  { color: #1e8a52; }
.rn-g-tit[data-g="mandato"] { color: #b56a00; }
.rn-g-tit[data-g="dom"]     { color: #2563c9; }
.rn-g-tit[data-g="ver"]     { color: #6b46c1; }
[data-dv][data-g="cobros"]  > .fa { color: #1e8a52; }
[data-dv][data-g="mandato"] > .fa { color: #c27c0e; }
[data-dv][data-g="dom"]     > .fa { color: #2563c9; }
[data-dv][data-g="ver"]     > .fa { color: #6b46c1; }
[data-dv][data-acc="ver_devueltos"] > .fa, [data-dv][data-acc="mandato_ep"] > .fa, [data-dv].peligro > .fa { color: #c0392b; }
[data-dv][data-g="cobros"]:hover  { background: #eaf7f0; }
[data-dv][data-g="mandato"]:hover { background: #fdf4e6; }
[data-dv][data-g="dom"]:hover     { background: #edf3fd; }
[data-dv][data-g="ver"]:hover     { background: #f3effc; }
[data-dv].peligro:hover { background: #fdeeee; }
/* 21/10/2026: colores de las opciones de los menús «···» del resto de pantallas de domiciliaciones (DV.mi, data-c) */
[data-dv][data-c="cobro"]  > .fa { color: #1e8a52; }
[data-dv][data-c="ep"]     > .fa { color: #c27c0e; }
[data-dv][data-c="editar"] > .fa { color: #2563c9; }
[data-dv][data-c="ver"]    > .fa { color: #6b46c1; }
[data-dv][data-c="quitar"] > .fa { color: #c0392b; }
[data-dv][data-c="cobro"]:hover  { background: #eaf7f0; }
[data-dv][data-c="ep"]:hover     { background: #fdf4e6; }
[data-dv][data-c="editar"]:hover { background: #edf3fd; }
[data-dv][data-c="ver"]:hover    { background: #f3effc; }
[data-dv][data-c="quitar"]:hover { background: #fdeeee; }
/* 21/10/2026: calendario, persona de contacto de las empresas */
.cal-item-sub.cal-contacto { color: var(--vf-texto-suave, #6b7a8c); }
.cal-item-sub.cal-contacto .fa { font-size: 11px; margin-right: 2px; }

/* -- F2 -- */
/* =============================================================================
   NUEVA DOMICILIACIÓN (19/10/2026) — nueva_renta.php + nueva_renta_vf.js (prefijo nr-)
   ============================================================================= */
.nr-page .nr-oculto { display: none !important; }
.nr-page .vf-banner { margin-bottom: 12px; }
.nr-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 18px; align-items: start; }
.nr-main { min-width: 0; }

/* Pasos (el plugin del asistente pone anchos en % a cada paso: se anulan) */
.nr-page .nr-wizard { background: transparent; }
.nr-page ul.nr-pasos { display: flex; list-style: none; margin: 0 0 16px; padding: 10px 12px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; gap: 4px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.nr-page ul.nr-pasos > li { flex: 1 1 0; width: auto !important; float: none; margin: 0; position: relative; min-width: 0; }
.nr-page ul.nr-pasos > li > a { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 6px; color: var(--vf-suave); background: transparent !important; cursor: default; font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border: none !important; }
.nr-page ul.nr-pasos > li > a:hover, .nr-page ul.nr-pasos > li > a:focus { background: transparent; color: var(--vf-suave); }
.nr-page .nr-num { flex: none; width: 24px; height: 24px; border-radius: 50%; border: 2px solid #cfd8e3; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: var(--vf-suave); background: #fff; }
.nr-page ul.nr-pasos > li.active > a { color: var(--vf-azul); font-weight: 600; background: #eef3fa !important; }
.nr-page ul.nr-pasos > li.active .nr-num { background: var(--vf-azul); border-color: var(--vf-azul); color: #fff; }
.nr-page ul.nr-pasos > li.hecho > a { color: var(--vf-ok); }
.nr-page ul.nr-pasos > li.hecho .nr-num { background: var(--vf-ok-bg); border-color: var(--vf-ok); color: var(--vf-ok); font-size: 0; }
.nr-page ul.nr-pasos > li.hecho .nr-num:before { content: "\f00c"; font-family: FontAwesome; font-size: 11px; }
.nr-page ul.nr-pasos > li + li:before { content: ""; position: absolute; left: -4px; top: 50%; width: 4px; height: 2px; background: #dfe5ec; }

/* Campos (los de siempre con class form-control, jquery.validate y selectpicker) */
.nr-page .vf-field .form-control { height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13.5px; color: var(--vf-texto); background: #fff; box-shadow: none; width: 100%; }
.nr-page .vf-field .form-control:focus { border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); outline: none; }
.nr-page .vf-field .form-control[disabled] { background: #f4f6f9; color: var(--vf-suave); }
.nr-page .vf-field label star, .nr-page label star { color: var(--vf-error); margin-left: 2px; font-weight: 600; }
.nr-page label.error { display: block; color: var(--vf-error) !important; font-size: 12px !important; font-weight: 500 !important; margin: 4px 0 0 !important; text-transform: none !important; padding: 0 !important; background: none !important; }
.nr-page .form-control.error, .nr-page input.error { border-color: var(--vf-error) !important; }
.nr-page .vf-field code { background: #eef1f5; color: var(--vf-azul); padding: 0 4px; border-radius: 3px; font-size: 11.5px; }
.nr-page .bootstrap-select { width: 100% !important; }
.nr-page .bootstrap-select > .dropdown-toggle { height: 38px; border: 1px solid #cfd8e3 !important; border-radius: 4px !important; background: #fff !important; color: var(--vf-texto) !important; font-size: 13.5px; font-weight: 400; padding: 6px 28px 6px 10px; box-shadow: none !important; text-transform: none; opacity: 1; }
.nr-page .bootstrap-select > .dropdown-toggle:focus, .nr-page .bootstrap-select.open > .dropdown-toggle { border-color: var(--vf-turquesa) !important; box-shadow: 0 0 0 3px rgba(27,121,155,.15) !important; outline: none !important; }
.nr-page .bootstrap-select > .dropdown-toggle .filter-option { color: var(--vf-texto); }
.nr-page .bootstrap-select.disabled > .dropdown-toggle, .nr-page .bootstrap-select > .dropdown-toggle.disabled { background: #f4f6f9 !important; color: var(--vf-suave) !important; }
.nr-page .bootstrap-select .dropdown-menu { font-size: 13px; }
.nr-page .bootstrap-select .dropdown-menu > li > a { white-space: normal; }
.nr-page .vf-help b { color: var(--vf-texto); }
.nr-con-boton { display: flex; gap: 8px; }
.nr-con-boton .form-control { flex: 1; min-width: 0; }
.nr-con-boton .vf-btn { flex: none; }
.nr-nota { background: var(--vf-info-bg); color: #0f5468; border: 1px solid #c7e3ec; border-radius: 6px; padding: 9px 12px; font-size: 12.5px; line-height: 1.5; }
.nr-nota .fa { margin-right: 4px; }
.nr-sub { font-size: 12px; color: var(--vf-suave); font-weight: 400; }
.nr-valor { height: 38px; display: flex; align-items: center; font-weight: 600; color: var(--vf-azul); }
.nr-quien { display: inline-flex; align-items: center; gap: 8px; background: #eef3fa; color: var(--vf-azul); border-radius: 20px; padding: 6px 14px; font-size: 13px; font-weight: 600; margin-bottom: 12px; }
.nr-quien:empty, .nr-quien span:empty { display: none; }
.nr-quien .fa { font-size: 16px; }

/* Particular / empresa y opciones del cliente */
.nr-tipo-zona { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; }
.nr-tipo-opc { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.nr-existe { margin-top: 8px; }
.nr-existe-caja { display: flex; gap: 8px; align-items: flex-start; background: var(--vf-ok-bg); border: 1px solid #c5e8d5; color: #145c3b; border-radius: 6px; padding: 8px 10px; font-size: 12.5px; line-height: 1.45; }
.nr-existe-caja > .fa { margin-top: 2px; }
.nr-existe-caja.error { background: var(--vf-error-bg); border-color: #f5c6c0; color: #8a271d; }
.nr-existe-caja a { font-weight: 600; text-decoration: underline; }
.nr-firmado { display: inline-block; margin-top: 4px; }

/* Plazo */
.nr-plazo { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--vf-borde); }
.nr-plazo #div_row_final { margin-top: 12px; }

/* Opciones con explicación (checkbox + label for: el label se puede reescribir sin perder la casilla) */
.nr-opciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.nr-opcion { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 10px 12px; background: #fff; }
.nr-opcion:hover { border-color: #b9c6d6; }
.nr-opcion input[type=checkbox] { margin-top: 3px !important; flex: none; cursor: pointer; }
.nr-page .nr-opcion label { margin: 0 !important; font-weight: 400; cursor: pointer; text-transform: none; font-size: 13px; color: var(--vf-texto); line-height: 1.4; }
.nr-opcion label > b { display: block; font-weight: 600; color: var(--vf-azul); }
.nr-opcion label > span { display: block; font-size: 12px; color: var(--vf-suave); margin-top: 2px; }
.nr-opcion input:disabled + label { cursor: not-allowed; opacity: .75; }
.nr-inicial { margin-top: 14px; padding: 14px; border-radius: 6px; background: #f6f8fb; border: 1px solid var(--vf-borde); }
.nr-inicial .vf-banner { margin: 12px 0 0; }

/* Factura (tarjetas compartidas de configuración de facturas, ../includes/forms/cards) */
.nr-factura #row_idioma_factura { margin-bottom: 12px; }
.nr-factura .row { margin-left: -8px; margin-right: -8px; }
.nr-factura .card, .nr-factura .card.border-orange, .nr-factura .card.border-blue { border: none !important; box-shadow: none !important; margin: 0 !important; background: transparent; }
.nr-factura .card .content { padding: 0 !important; }
.nr-factura .form-group { margin-bottom: 14px; }
.nr-factura label, .nr-factura .control-label { font-size: 12px; font-weight: 600; color: var(--vf-texto); text-transform: none; }
.nr-factura .form-control { height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; box-shadow: none; font-size: 13.5px; }
.nr-factura textarea.form-control { height: auto; min-height: 80px; }
.nr-factura .input-group-btn { display: flex !important; gap: 6px; }
.nr-factura .input-group-btn > .btn { border: 1px solid #cfd8e3; background: #fff; color: var(--vf-azul); border-radius: 4px; height: 38px; min-width: 38px; }
.nr-factura input[type=checkbox] { margin-right: 6px !important; vertical-align: -2px; }
.nr-factura input[type=checkbox] + label { font-weight: 500; font-size: 12.5px; }
.nr-factura .panel { border: 1px solid var(--vf-borde) !important; border-radius: 6px; }
.nr-factura .panel-heading { background: #f6f8fb !important; }
.nr-factura .panel-title a { font-size: 13px; color: var(--vf-azul); }

/* Mandato con tarjetas (por debajo sigue #tipo_mandato) */
.nr-select-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.nr-mandatos { display: grid; gap: 10px; margin-bottom: 4px; }
.nr-mandato { display: flex; align-items: flex-start; gap: 12px; text-align: left; width: 100%; border: 1px solid var(--vf-borde); border-radius: 8px; background: #fff; padding: 12px 14px; cursor: pointer; color: var(--vf-texto) !important; font-size: 13px; }
.nr-mandato:hover { border-color: #9fb3cb; }
.nr-mandato > .fa:first-child { flex: none; width: 34px; height: 34px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: inline-flex; align-items: center; justify-content: center; font-size: 16px; }
.nr-mandato > span { flex: 1; min-width: 0; }
.nr-mandato b { color: var(--vf-azul); font-weight: 600; font-size: 13.5px; }
.nr-mandato em { font-style: normal; margin-left: 6px; vertical-align: 1px; }
.nr-mandato small { display: block; color: var(--vf-suave); font-size: 12px; line-height: 1.45; margin-top: 3px; }
.nr-mandato .nr-radio { flex: none; font-size: 18px; color: #b9c6d6; margin-top: 6px; }
.nr-mandato.activo { border-color: var(--vf-azul); box-shadow: 0 0 0 2px rgba(1,57,127,.12); background: #f7faff; }
.nr-mandato.activo .nr-radio { color: var(--vf-azul); }
.nr-mandato.deshab { opacity: .5; cursor: not-allowed !important; background-color: #eef1f5 !important; }
.nr-importar { margin-top: 12px; }
.nr-subir { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.nr-doc:not(:empty) { margin-top: 8px; display: inline-block; background: var(--vf-ok-bg); color: var(--vf-ok); border-radius: 6px; padding: 6px 10px; font-size: 12.5px; font-weight: 600; }
.nr-doc:not(:empty):before { content: "\f00c"; font-family: FontAwesome; margin-right: 6px; }

/* Contrato */
.nr-contrato { margin-top: 14px; }
.nr-editor { margin: 12px 0; }
.nr-page .note-editor { border: 1px solid #cfd8e3 !important; border-radius: 4px; }
.nr-contrato-previa { max-height: 65vh; overflow: auto; font-size: 13px; line-height: 1.6; }

/* Revisar y crear */
.nr-final { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.nr-f-blq { background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; }
.nr-f-tit { font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; margin-bottom: 8px; }
.nr-f-tit .fa { color: var(--vf-turquesa); margin-right: 4px; }
.nr-f-fila { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid #f0f3f7; font-size: 13px; }
.nr-f-fila:last-child { border-bottom: none; }
.nr-f-fila > span { color: var(--vf-suave); flex: none; }
.nr-f-fila > b { font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.nr-f-imp { font-size: 16px; color: var(--vf-azul); }
.nr-f-iban { font-family: Consolas, monospace; font-size: 13px; letter-spacing: .3px; }
.nr-f-llega { grid-column: 1 / -1; background: #f7faff; border-color: #c9d8ee; }
.nr-f-llega p { margin: 0; font-size: 13.5px; color: var(--vf-texto); }
.nr-meses-card .vf-card-body { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.nr-meses-card .nr-opcion { border: none; padding: 0; flex: 1; min-width: 220px; }
#icon_calendar.oculto { display: none; }

/* Barra de abajo */
.nr-barra { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 10px 14px; margin-top: 4px; box-shadow: 0 -4px 12px rgba(0,0,0,.05); }
.nr-barra .btn-back.disabled { opacity: .45; pointer-events: none; }
.nr-barra-info { flex: 1; text-align: center; font-size: 12.5px; color: var(--vf-suave); }
.nr-falta { color: var(--vf-error); font-weight: 600; }
.nr-barra .btn-next, .nr-barra .btn-finish { margin-left: auto; }

/* Resumen al lado */
.nr-lado { position: sticky; top: 12px; background: #fff; border: 1px solid var(--vf-borde); border-radius: 6px; box-shadow: 0 1px 2px rgba(0,0,0,.04); overflow: hidden; }
.nr-lado-tit { padding: 12px 14px; font-weight: 600; color: var(--vf-azul); border-bottom: 1px solid var(--vf-borde); background: #f6f8fb; font-size: 13.5px; }
.nr-lado-tit .fa { margin-right: 6px; }
.nr-r-blq { padding: 10px 14px; border-bottom: 1px solid #f0f3f7; }
.nr-r-blq:last-child { border-bottom: none; }
.nr-r-tit { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; margin-bottom: 6px; }
.nr-r-tit .fa { width: 14px; color: var(--vf-turquesa); }
.nr-r-lin { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; padding: 2px 0; }
.nr-r-lin > span { color: var(--vf-suave); flex: none; }
.nr-r-lin > b { font-weight: 600; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.nr-r-imp > b { color: var(--vf-azul); font-size: 14px; }
.nr-r-vacio { font-size: 12px; color: #9aa7b6; font-style: italic; }
.nr-r-nota { font-size: 11.5px; color: var(--vf-ok); margin-top: 4px; }
.nr-r-lista { font-size: 12.5px; line-height: 1.55; }
.nr-r-lista .fa-check { color: var(--vf-ok); margin-right: 4px; }
.nr-r-llega { background: #f7faff; }

/* Al terminar */
.nr-hecho-caja { background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; padding: 30px 24px; text-align: center; max-width: 720px; margin: 10px auto 24px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.nr-hecho-icono { width: 56px; height: 56px; border-radius: 50%; background: var(--vf-ok-bg); color: var(--vf-ok); display: inline-flex; align-items: center; justify-content: center; font-size: 26px; margin-bottom: 10px; }
.nr-hecho-caja h3 { margin: 0 0 6px; color: var(--vf-azul); font-size: 20px; font-weight: 600; }
.nr-hecho-caja > p { color: var(--vf-suave); margin: 0 0 12px; }
.nr-hecho-datos { font-size: 13.5px; line-height: 1.6; margin-bottom: 14px; }
.nr-hecho-btns { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 16px; }
.nr-enlace { text-align: left; background: #f6f8fb; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; }
.nr-enlace-tit { font-weight: 600; color: var(--vf-azul); margin-bottom: 4px; }
.nr-enlace p { font-size: 12.5px; color: var(--vf-suave); margin: 0 0 8px; }
.nr-enlace-caja { display: flex; gap: 8px; }
.nr-enlace-caja input { flex: 1; min-width: 0; height: 32px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 12.5px; background: #fff; }

/* Ventanas compartidas en esta pantalla (meses, productos, cliente con el mismo NIF) */
.nr-body .modal-content { border-radius: 8px; border: none; }
.nr-body .modal-header .modal-title { color: var(--vf-azul); font-weight: 600; }

@media (max-width: 1199px) {
    .nr-layout { grid-template-columns: minmax(0, 1fr); }
    .nr-lado { display: none; }
}
@media (max-width: 991px) {
    .nr-page ul.nr-pasos > li .nr-paso-txt { display: none; }
    .nr-page ul.nr-pasos > li.active .nr-paso-txt { display: inline; }
    .nr-page ul.nr-pasos > li { flex: 0 0 auto; }
    .nr-page ul.nr-pasos > li.active { flex: 1 1 auto; }
    .nr-final { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .nr-page .vf-grid { grid-template-columns: minmax(0, 1fr); }
    .nr-page .vf-field .form-control, .nr-page .bootstrap-select > .dropdown-toggle { height: 42px; font-size: 16px; }
    .nr-tipo-zona { display: block; }
    .nr-tipo-opc { margin-top: 10px; flex-direction: column; gap: 8px; }
    .nr-barra { padding: 8px 10px; flex-wrap: wrap; }
    .nr-barra-info { order: -1; flex-basis: 100%; }
    .nr-barra .vf-btn { flex: 1; justify-content: center; }
    .nr-f-fila { flex-direction: column; gap: 1px; }
    .nr-f-fila > b { text-align: left; }
    .nr-hecho-caja { padding: 22px 14px; }
    .nr-hecho-btns .vf-btn { width: 100%; justify-content: center; }
    .nr-enlace-caja { flex-direction: column; }
}
/* Lo que pone el estilo antiguo del asistente (light-bootstrap / custom.css) */
.nr-page .card-wizard { background: transparent; box-shadow: none; padding: 0; border-radius: 0; }
.nr-page .card-wizard .nav-pills { margin: 0 0 16px; font-weight: 500; }
.nr-page .card-wizard .nav-pills > li > a, .nr-page .card-wizard .nav-pills > li:first-child > a, .nr-page .card-wizard .nav-pills > li:last-child > a { text-transform: none; box-shadow: none; margin: 0; border-radius: 6px; text-align: left; font-weight: 500; }
.nr-page .card-wizard .nav-pills > li.active > a { font-weight: 600; }
.nr-page .card-wizard .footer { padding: 10px 14px; }
.nr-page .tab-content { min-height: 0; }
.nr-page .nr-mandato > span, .nr-page .nr-opcion span, .nr-page .cl-tipo button > span { vertical-align: baseline; }
.nr-page .nr-mandato > .fa, .nr-page .cl-tipo button > .fa { margin-right: 0; }
.nr-page .vf-btn > .fa { margin-right: 0; }
.nr-page .tab-content { padding: 0; background: transparent; }
.nr-page .tab-content > .tab-pane { padding: 0; }
.nr-page .bootstrap-select.form-control { border: none !important; padding: 0 !important; height: auto !important; box-shadow: none !important; background: transparent !important; }
.nr-factura .control-label, .nr-factura label { text-transform: none !important; letter-spacing: 0; }
.nr-factura .control-label .fa-info-circle, .nr-factura .icon_info { color: var(--vf-turquesa); font-size: 13px; }
.nr-factura .input-group-btn > .btn, .nr-factura #btn_add_impuesto, .nr-factura #btn_add_retencion { box-shadow: none !important; border-radius: 4px !important; padding: 0 12px; font-weight: 600; margin: 0 !important; }
.nr-factura .row > div:has(> input[type=checkbox]) { width: 100%; float: none; margin-bottom: 6px; }
.nr-factura input[type=checkbox] + label { display: inline !important; text-transform: none !important; font-size: 13px !important; color: var(--vf-texto); cursor: pointer; }
.nr-factura input[type=checkbox]:disabled + label { color: var(--vf-suave); cursor: not-allowed !important; background-color: #eef1f5 !important; }
.nr-factura .input-group-btn { flex-wrap: wrap; }
.nr-factura .input-group-btn > .bootstrap-select { flex: 1; min-width: 0; width: auto !important; }
.nr-factura .input-group-btn > label.error { flex-basis: 100%; order: 3; }
/* Barra del editor (summernote) con botones pequeños */
.nr-page .note-toolbar { background: #f6f8fb; border-bottom: 1px solid var(--vf-borde); padding: 6px 8px 2px; display: block !important; }
.nr-page .note-toolbar .btn-group { margin: 0 4px 4px 0; }
.nr-page .note-toolbar .btn { background: #fff !important; color: var(--vf-texto) !important; border: 1px solid #cfd8e3 !important; border-radius: 4px !important; box-shadow: none !important; padding: 4px 8px !important; min-width: 0 !important; height: 28px; font-size: 12px !important; margin: 0 2px 0 0 !important; opacity: 1; }
.nr-page .note-toolbar .btn:hover { border-color: var(--vf-turquesa) !important; color: var(--vf-turquesa) !important; }
.nr-page .note-toolbar .btn > .fa, .nr-page .note-toolbar .btn > i { margin: 0 !important; }
.nr-page .note-toolbar .btn > span { vertical-align: baseline; }
.nr-page .note-editable[contenteditable=false] { background: #f6f8fb; color: var(--vf-suave); }
@media (max-width: 600px) { .nr-plazo .cl-switch { flex-wrap: wrap; } .nr-plazo .cl-switch .nr-sub { flex-basis: 100%; padding-left: 24px; } }
.nr-mandatos.nr-falta-elegir .nr-mandato { border-color: #e0a800; background: var(--vf-aviso-bg); }
/* 19/10/2026 (2): el <select> nativo que bootstrap-select deja debajo (invisible) cogía el ancho de .vf-field select (100%)
   y tapaba el campo de al lado: al pulsar «Importe» se abría «Cada cuánto». Se deja como lo quiere bootstrap-select. */
.nr-page .bootstrap-select > select, .nr-page .vf-field .bootstrap-select > select { position: absolute !important; bottom: 0 !important; left: 50% !important; width: .5px !important; min-width: 0 !important; height: 100% !important; padding: 0 !important; border: none !important; opacity: 0 !important; pointer-events: none !important; box-shadow: none !important; }
.nr-con-boton { flex-wrap: wrap; }
.nr-con-boton > label.error { flex-basis: 100%; order: 3; }
.nr-campos-info:not(:empty) { background: var(--vf-info-bg); color: #0f5468; border: 1px solid #c7e3ec; border-radius: 6px; padding: 8px 12px; font-size: 12.5px; margin-bottom: 12px; }
/* La casilla «Generar factura automáticamente» de la tarjeta compartida repetía la del paso 2 (que la marca y desmarca): se oculta aquí */
.nr-factura .generar-factura-automaticamente-class { display: none !important; }
.nr-page .d-none { display: none !important; }
/* 21/10/2026: cuenta bloqueada de un cliente que ya existe */
.vf-page .vf-field input.form-control.nrv-bloq, input.nrv-bloq[readonly] { background: var(--vf-fondo); color: var(--vf-suave); cursor: not-allowed !important; background-color: #eef1f5 !important; }
.nrv-cuenta-bloq { color: #8a5a00 !important; }
.nrv-cuenta-bloq .fa { margin-right: 3px; }

/* -- F3 -- */
/* =============================================================================
   ASISTENTE DE DOMICILIACIONES (asistente.php, 19/10/2026) — clases as-
   ============================================================================= */
.as-page .as-pasos { margin-bottom: 16px; }
.as-page .as-pasos em { font-style: normal; }
.as-tit { font-size: 16px; font-weight: 600; color: var(--vf-azul); margin: 4px 0 12px; }

/* Tarjetas de «¿Qué quieres hacer?» */
.as-ops { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.as-ops-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.as-op { display: flex; gap: 14px; align-items: flex-start; text-align: left; background: #fff; border: 1px solid var(--vf-borde); border-radius: 8px; padding: 16px; cursor: pointer; color: var(--vf-texto); box-shadow: 0 1px 2px rgba(0,0,0,.04); transition: border-color .15s, box-shadow .15s, transform .15s; font: inherit; }
.as-op:hover, .as-op:focus { border-color: var(--vf-turquesa); box-shadow: 0 3px 10px rgba(1,57,127,.10); outline: none; transform: translateY(-1px); }
.as-op-ico { width: 42px; height: 42px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 18px; flex: none; background: #e6edf7; color: var(--vf-azul); }
.as-op-ico.ok { background: var(--vf-ok-bg); color: var(--vf-ok); }
.as-op-ico.error { background: var(--vf-error-bg); color: var(--vf-error); }
.as-op-ico.info { background: var(--vf-info-bg); color: var(--vf-info); }
.as-op-txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.as-op-txt b { font-size: 14.5px; font-weight: 600; color: var(--vf-azul); }
.as-op-txt span { font-size: 12.5px; color: var(--vf-suave); line-height: 1.45; }

/* Cliente elegido */
.as-cli { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--vf-borde); border-left: 4px solid var(--vf-turquesa); border-radius: 6px; padding: 10px 14px; margin-bottom: 14px; }
.as-cli-ico { width: 34px; height: 34px; border-radius: 50%; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; flex: none; }
.as-cli-txt { flex: 1; min-width: 0; }
.as-cli-nom { font-weight: 600; color: var(--vf-azul); font-size: 14px; }
.as-cli-est { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }

/* Buscar cliente */
.as-buscar { display: flex; gap: 8px; margin-bottom: 14px; }
.as-buscar .vf-search { flex: 1; max-width: none; }
.as-buscar .vf-search input { width: 100%; }

/* Listas (clientes, domiciliaciones, recibos) */
.as-lista { border: 1px solid var(--vf-borde); border-radius: 6px; overflow: hidden; }
.as-item { display: flex; align-items: center; gap: 14px; padding: 11px 14px; border-top: 1px solid var(--vf-borde); background: #fff; }
.as-item:first-child { border-top: 0; }
.as-item:hover { background: #fafcfe; }
.as-item-main { flex: 1; min-width: 0; }
.as-item-tit { font-weight: 600; color: var(--vf-texto); font-size: 13.5px; overflow-wrap: anywhere; }
.as-item-sub { color: var(--vf-suave); font-size: 12px; margin-top: 2px; overflow-wrap: anywhere; }
.as-item-est { flex: 0 0 170px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.as-item-imp { flex: 0 0 150px; text-align: right; font-weight: 600; color: var(--vf-texto); font-size: 14px; }
.as-item-imp > div { margin-top: 4px; font-weight: 400; }
.as-item-acc { flex: 0 0 auto; text-align: right; }
.as-falta { color: var(--vf-aviso); }
.as-total { text-align: right; font-size: 12.5px; color: var(--vf-suave); padding: 8px 2px 0; }
.as-page .vf-btn.as-peligro { color: var(--vf-error); border-color: #f0c3bd; }
.as-page .vf-btn.as-peligro:hover { background: var(--vf-error-bg); }
.as-lista-cont .vf-pager { margin-top: 10px; }

/* Formularios */
.as-campo { position: relative; } /* calendario (datetimepicker) */
.as-campo-ancho { grid-column: 1 / -1; }
.as-page .vf-field input[type=number], .as-page .vf-field input.datetimepicker { width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 14px; color: var(--vf-texto); background: #fff; }
.as-page .vf-field input[type=text] { width: 100%; }
.as-page .vf-field input[disabled] { background: var(--vf-fondo); color: var(--vf-suave); }
.as-page label.error, .as-page label.as-err { display: block; color: var(--vf-error); font-size: 12px; font-weight: 400; margin: 4px 0 0; text-transform: none; }
.as-page .vf-field.invalido input { border-color: var(--vf-error); }
.as-acciones { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.as-acciones-izq { justify-content: flex-start; }
.as-txt { font-size: 13.5px; line-height: 1.55; color: var(--vf-texto); margin: 0 0 12px; }
.as-resumen { margin-top: 14px; padding: 10px 12px; background: var(--vf-info-bg); color: #0f5468; border-radius: 6px; font-size: 13px; line-height: 1.5; }
.as-resumen:empty { display: none; }
.as-banner { margin-bottom: 14px; }
.as-ul { margin: 8px 0 0; padding-left: 18px; }
.as-ul li { margin: 2px 0; }
.as-ul-recibos { list-style: none; padding: 0; margin-top: 10px; background: rgba(255,255,255,.6); border-radius: 6px; }
.as-ul-recibos li { display: flex; gap: 12px; padding: 5px 8px; border-top: 1px solid rgba(0,0,0,.06); }
.as-ul-recibos li:first-child { border-top: 0; }
.as-ul-recibos li span:first-child { flex: 0 0 90px; }
.as-ul-recibos li span:nth-child(2) { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.as-ico-aviso { background: var(--vf-aviso-bg) !important; color: var(--vf-aviso) !important; }

/* Datos (mandato, domiciliación actual) */
.as-datos { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px 16px; }
.as-datos > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.as-datos span { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.as-datos b { font-size: 14px; color: var(--vf-texto); font-weight: 600; overflow-wrap: anywhere; }
.as-actual { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; margin-bottom: 16px; }
.as-actual-tit { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--vf-azul); font-weight: 700; margin-bottom: 8px; }

/* Resultado */
.as-fin-cab { display: flex; gap: 16px; align-items: flex-start; }
.as-fin-ico { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; flex: none; }
.as-fin-cab.ok .as-fin-ico { background: var(--vf-ok-bg); color: var(--vf-ok); }
.as-fin-cab.aviso .as-fin-ico { background: var(--vf-aviso-bg); color: var(--vf-aviso); }
.as-fin-cab.error .as-fin-ico { background: var(--vf-error-bg); color: var(--vf-error); }
.as-fin-cab.info .as-fin-ico { background: var(--vf-info-bg); color: var(--vf-info); }
.as-fin-cab h3 { margin: 4px 0 6px; font-size: 18px; font-weight: 600; color: var(--vf-azul); }
.as-fin-txt { font-size: 14px; line-height: 1.6; color: var(--vf-texto); }
.as-fin-datos { display: grid; grid-template-columns: 1fr 2fr; gap: 12px; margin-top: 14px; }
.as-fin-bloque { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; }
.as-acciones-fin { border-top: 1px solid var(--vf-borde); padding-top: 14px; margin-top: 18px; }

/* Recibos del cliente (plegable) */
.as-recibos-cli { overflow: hidden; }
.as-pliegue { width: 100%; display: flex; align-items: center; gap: 8px; background: #fff; border: 0; padding: 13px 18px; font-weight: 600; color: var(--vf-azul); font-size: 14px; text-align: left; }
.as-pliegue span { flex: 1; }
.as-pliegue .as-flecha { transition: transform .2s; color: var(--vf-suave); }
.as-pliegue[aria-expanded="true"] .as-flecha { transform: rotate(180deg); }
#panelDomiciliacionesCliente { padding: 0 18px 16px; }
#panelDomiciliacionesCliente .vf-ayuda { margin: 0 0 10px; }

@media (max-width: 991px) {
    .as-ops, .as-ops-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .as-item-est { flex-basis: 140px; }
    .as-fin-datos { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .as-ops, .as-ops-4 { grid-template-columns: 1fr; }
    .as-op { padding: 13px; }
    .as-page .vf-head-actions { flex-direction: row; flex-wrap: nowrap; align-items: stretch; width: 100%; }
    .as-page .vf-head-actions .vf-btn { margin: 0; }
    .as-page .vf-head-actions .vf-btn { flex: 1 1 0; width: auto; justify-content: center; }
    .as-cli { flex-wrap: wrap; }
    .as-cli-est { justify-content: flex-start; width: 100%; padding-left: 46px; }
    .as-buscar { flex-direction: column; }
    .as-buscar .vf-btn { width: 100%; }
    .as-item { flex-wrap: wrap; gap: 8px; position: relative; }
    .as-item-main { flex: 1 1 100%; }
    .as-item-est, .as-item-imp { flex: 1 1 auto; text-align: left; }
    .as-item-imp { order: 2; }
    .as-item-acc { flex: 1 1 100%; }
    .as-item-acc .vf-btn { width: 100%; justify-content: center; }
    .as-acciones .vf-btn { width: 100%; justify-content: center; }
    .as-page .vf-field input[type=number], .as-page .vf-field input.datetimepicker, .as-page .vf-field input[type=text] { height: 42px; font-size: 16px; }
    .as-fin-cab { flex-direction: column; gap: 8px; }
    .as-ul-recibos li { flex-wrap: wrap; gap: 2px 10px; }
    .as-ul-recibos li span:nth-child(2) { flex-basis: 100%; order: 3; }
}

/* -- F4 -- */
/* =============================================================================
   GENERAR ENLACES (envio_enlace_cliente.php) Y CALCULADORA DE FECHAS (calculo_fechas_gc.php) — 19/10/2026
   ============================================================================= */
/* --- Formulario --- */
.ee-form-panel { padding: 16px 18px; margin-bottom: 18px; border-left: 4px solid var(--vf-turquesa); }
.ee-form-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.ee-form-cab h3 { margin: 0; font-size: 18px; font-weight: 600; color: var(--vf-azul); }
.ee-form-cab h3 .fa { margin-right: 4px; }
.ee-form-cab .vf-sub { margin-top: 4px; font-size: 12.5px; }
.ee-form-cols { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
.ee-form .vf-card { margin-bottom: 12px; }
.ee-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 14px; }
.ee-sub { margin-top: 14px; }
.ee-bloque { margin-top: 16px; }
.ee-lbl { font-size: 12px; font-weight: 600; color: var(--vf-texto); margin-bottom: 7px; }
.ee-checks { display: flex; flex-wrap: wrap; gap: 12px 26px; }
.ee-page .vf-field { position: relative; }
.ee-page .vf-field input[type=number], .ee-page .vf-field input[type=email] {
    width: 100%; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 6px 10px; font-size: 13px; color: var(--vf-texto); background: #fff; box-shadow: none;
}
.ee-page .vf-field input:disabled { background: var(--vf-fondo); color: var(--vf-suave); }
.ee-page .vf-field select { width: 100%; }
.ee-page label.error { display: block; color: var(--vf-error) !important; font-size: 12px; font-weight: 500; margin: 4px 0 0; text-transform: none; }
.ee-page input.error, .ee-page select.error { border-color: var(--vf-error) !important; }
.ee-page .cu-sw input[type=checkbox] { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; margin: 0 !important; }
.ee-page .cu-sw .cu-sw-txt { line-height: 1.35; }
.ee-page .bootstrap-datetimepicker-widget { z-index: 30; }
.ee-sp-aviso { margin-top: 12px; padding: 9px 12px; background: var(--vf-info-bg); border-radius: 5px; color: #0f5468; }

/* Opciones en tarjetas (para quién / cuánto paga) */
.ee-opciones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ee-opciones-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ee-op { text-align: left; background: #fff; border: 1px solid #cfd8e3; border-radius: 6px; padding: 11px 13px 11px 40px; position: relative; cursor: pointer; color: var(--vf-texto); font: inherit; transition: border-color .12s, box-shadow .12s; }
.ee-op:hover { border-color: var(--vf-turquesa); }
.ee-op > .fa { position: absolute; left: 13px; top: 13px; font-size: 16px; color: var(--vf-suave); width: 18px; text-align: center; }
.ee-op b { display: block; font-size: 13.5px; font-weight: 600; color: var(--vf-azul); }
.ee-op span { display: block; font-size: 12px; color: var(--vf-suave); margin-top: 3px; line-height: 1.4; }
.ee-op.activo { border-color: var(--vf-turquesa); box-shadow: 0 0 0 2px rgba(27,121,155,.25); background: #f3f9fb; }
.ee-op.activo > .fa { color: var(--vf-turquesa); }
.ee-op.activo::after { content: "\f00c"; font-family: FontAwesome; position: absolute; right: 10px; top: 9px; color: var(--vf-turquesa); font-size: 13px; }
.ee-op:disabled, .ee-op.bloqueado:not(.activo) { opacity: .45; cursor: not-allowed; }
.ee-op.bloqueado.activo { cursor: default; }
.ee-plegable .vf-card-head { cursor: pointer; }

.ee-savebar { position: sticky; bottom: 0; margin-top: 4px; }
.ee-savebar .vf-btn + .vf-btn { margin-left: 8px; }

/* Vista previa: lo que verá el cliente */
.ee-previa { position: sticky; top: 12px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 8px; padding: 14px; font-size: 12.5px; }
.ee-pv-tit { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; font-weight: 600; color: var(--vf-suave); margin-bottom: 10px; }
.ee-pv-movil { background: #fff; border: 1px solid var(--vf-borde); border-radius: 14px; padding: 16px 14px; box-shadow: 0 2px 8px rgba(1,57,127,.06); }
.ee-pv-com { font-weight: 700; color: var(--vf-azul); font-size: 14px; border-bottom: 1px solid var(--vf-borde); padding-bottom: 8px; margin-bottom: 10px; }
.ee-pv-txt { color: var(--vf-suave); font-size: 12px; }
.ee-pv-concepto { font-size: 15px; font-weight: 600; color: var(--vf-texto); margin: 2px 0 6px; overflow-wrap: anywhere; }
.ee-pv-imp { font-size: 13px; color: var(--vf-texto); }
.ee-pv-imp b { color: var(--vf-azul); }
.ee-pv-fechas { color: var(--vf-suave); margin-top: 4px; }
.ee-pv-ini { margin-top: 8px; padding: 6px 8px; background: var(--vf-aviso-bg); border-radius: 5px; color: #7a4a00; }
.ee-pv-pasos { margin: 12px 0 0; padding-left: 18px; color: var(--vf-texto); }
.ee-pv-pasos li { margin-bottom: 4px; line-height: 1.4; }
.ee-pv-llega { margin-top: 12px; line-height: 1.45; }
.ee-pv-llega .fa, .ee-pv-extra .fa { color: var(--vf-turquesa); width: 16px; text-align: center; }
.ee-pv-extra { margin-top: 8px; line-height: 1.7; color: var(--vf-texto); }
.ee-pv-nota { margin-top: 10px; font-size: 11.5px; color: var(--vf-suave); border-top: 1px dashed var(--vf-borde); padding-top: 8px; }
.ee-pv-falta { color: var(--vf-aviso); font-style: italic; }

/* --- Lista --- */
.vf-list.sin-check.ee-list .vf-row { grid-template-columns: minmax(170px, 1fr) minmax(210px, 1.35fr) minmax(190px, 1.1fr) minmax(250px, 1.25fr); align-items: start; position: relative; }
.ee-contacto { font-size: 13px; color: var(--vf-texto); overflow-wrap: anywhere; }
.ee-contacto .fa { color: var(--vf-suave); width: 14px; }
.ee-quien-varios { font-weight: 600; color: var(--vf-azul); }
.ee-envios { margin-top: 2px; }
.ee-envios .vf-tag .fa { color: var(--vf-ok); }
.vf-tag.gris { background: #f2f4f7; color: #8796a8; font-weight: 500; }
.ee-concepto { font-weight: 600; color: var(--vf-azul); font-size: 13.5px; overflow-wrap: anywhere; }
.ee-imp { margin-top: 2px; }
.ee-imp b { font-variant-numeric: tabular-nums; }
.ee-tags { margin-top: 3px; }
.ee-tags .dv-pas { margin: 3px 4px 0 0; }
.ee-pasos { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: #9aa8ba; }
.ee-pasos li.hecho { color: var(--vf-ok); }
.ee-pasos li .fa { margin-right: 2px; }
.ee-paso-cod, .ee-paso-cod a { font-family: Consolas, monospace; font-size: 11px; }
.ee-expl { margin-top: 5px; }
.ee-link { display: flex; gap: 6px; }
.ee-link input { flex: 1; min-width: 0; height: 30px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 12px; color: var(--vf-texto); background: var(--vf-fondo); font-family: Consolas, monospace; }
.ee-link-grande input { height: 38px; font-size: 13px; }
.ee-acc { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ee-nosms { font-size: 11.5px; }
.ee-altas .vf-row { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) !important; }
@media (max-width: 1280px) {
    .ee-form-cols { grid-template-columns: minmax(0, 1fr) 280px; }
}
@media (max-width: 991px) {
    .ee-form-cols { grid-template-columns: 1fr; }
    .ee-previa { position: static; order: -1; }
    .ee-grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ee-opciones-3 { grid-template-columns: 1fr; }
    .vf-list.sin-check.ee-list .vf-row { grid-template-columns: 1fr 1fr; }
    .ee-list .ee-c-acc { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
    .ee-form-panel { padding: 12px; }
    .ee-form-cab { flex-direction: column; }
    .ee-opciones, .ee-grid3 { grid-template-columns: 1fr; }
    .vf-list.sin-check.ee-list .vf-row { grid-template-columns: 1fr; }
    .ee-savebar > div:last-child { display: flex; flex-direction: column-reverse; gap: 8px; }
    .ee-savebar .vf-btn + .vf-btn { margin-left: 0; }
    .ee-page .vf-field input[type=number], .ee-page .vf-field input[type=email] { height: 42px; font-size: 16px; }
}

/* --- Calculadora de fechas --- */
.cfc-form { display: grid; grid-template-columns: 200px minmax(0, 1fr) auto; gap: 14px 18px; align-items: end; }
.cfc-page .vf-field { position: relative; }
.cfc-tipo { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cfc-tipo .ee-op { padding-top: 9px; padding-bottom: 9px; }
.cfc-res { margin-top: 18px; }
.cfc-bloque { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 16px 18px 12px; margin-bottom: 14px; background: #fff; }
.cfc-bloque-tit { font-size: 13px; font-weight: 600; color: var(--vf-azul); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cfc-bloque.cfc-sec .cfc-bloque-tit { color: var(--vf-suave); }
.cfc-linea { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); position: relative; }
.cfc-linea.dos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cfc-linea::before { content: ""; position: absolute; left: 16.6%; right: 16.6%; top: 17px; height: 3px; background: linear-gradient(90deg, var(--vf-azul), var(--vf-turquesa), var(--vf-ok)); border-radius: 2px; }
.cfc-linea.dos::before { left: 25%; right: 25%; background: linear-gradient(90deg, var(--vf-turquesa), var(--vf-ok)); }
.cfc-linea li { text-align: center; position: relative; padding: 0 6px; }
.cfc-punto { width: 36px; height: 36px; border-radius: 50%; margin: 0 auto 8px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 15px; position: relative; z-index: 1; box-shadow: 0 0 0 4px #fff; }
.cfc-p1 { background: var(--vf-azul); } .cfc-p2 { background: var(--vf-turquesa); } .cfc-p3 { background: var(--vf-ok); }
.cfc-que { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.cfc-fecha { font-size: 15px; font-weight: 600; color: var(--vf-texto); margin-top: 3px; }
.cfc-fecha:first-letter { text-transform: uppercase; }
.cfc-expl { font-size: 12px; color: var(--vf-suave); margin-top: 3px; line-height: 1.4; }
.cfc-notas { font-size: 12px; color: var(--vf-suave); line-height: 1.55; margin: 6px 0 0; padding-left: 18px; }
.cfc-como { margin-top: 18px; }
.cfc-como ol { margin: 6px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--vf-texto); line-height: 1.55; }
@media (max-width: 991px) {
    .cfc-form { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .cfc-tipo { grid-template-columns: 1fr; }
    .cfc-linea, .cfc-linea.dos { grid-template-columns: 1fr; gap: 14px; }
    .cfc-linea::before, .cfc-linea.dos::before { left: 17px; right: auto; top: 18px; bottom: 18px; width: 3px; height: auto; background: linear-gradient(180deg, var(--vf-azul), var(--vf-turquesa), var(--vf-ok)); }
    .cfc-linea li { text-align: left; display: grid; grid-template-columns: 36px 1fr; gap: 0 12px; padding: 0; }
    .cfc-linea li .cfc-punto { margin: 0; grid-row: span 3; }
}
.ee-page .vf-field label.cu-sw, .ee-page label.cu-sw { display: inline-flex; font-size: 13px; font-weight: 500; margin: 0; }
.ee-page .vf-field label.cu-sw { margin-top: 10px; }
@media (max-width: 600px) { .ee-savebar { position: static !important; } }
/* 20/10/2026: «¿Cómo funciona?» de las fechas variables */
.ee-explica { margin: 8px 0 4px; border: 1px solid var(--vf-borde); border-radius: 6px; background: var(--vf-fondo); }
.ee-explica summary { cursor: pointer; padding: 8px 12px; font-size: 13px; font-weight: 600; color: var(--vf-turquesa); list-style: none; }
.ee-explica summary::-webkit-details-marker { display: none; }
.ee-explica summary .fa { margin-right: 4px; }
.ee-explica[open] summary { border-bottom: 1px solid var(--vf-borde); }
.ee-explica-body { padding: 10px 14px 4px; font-size: 13px; line-height: 1.55; color: var(--vf-texto); }
.ee-explica .ee-explica-body p, .ee-explica .ee-explica-body li { margin: 0 0 8px; font-size: 13px; line-height: 1.55; }
.ee-explica-body ol { margin: 0 0 8px; padding-left: 18px; }
.ee-explica-body li { margin-bottom: 6px; }
.ee-explica .ee-ej { display: inline-block; margin-top: 3px; color: var(--vf-suave); font-size: 12.5px; }

/* -- F5 -- */
/* =============================================================================
   RECIBOS EMITIDOS, DEVUELTOS Y CANCELACIÓN MASIVA (19/10/2026)
   recibos_comun_vf.js (RC) + domiciliaciones_emitidas_vf.js, domiciliaciones_devueltas_vf.js, cancelacion_masiva_vf.js
   ============================================================================= */
.re-page .vf-row.re-row { grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.3fr) 120px minmax(210px, 1.5fr) 170px; }
.re-page .vf-list.re-con-check .vf-row.re-row { grid-template-columns: 36px minmax(150px, 1fr) minmax(180px, 1.3fr) 120px minmax(210px, 1.5fr) 150px; }
.re-fecha { font-weight: 700; color: var(--vf-azul); font-size: 14px; font-variant-numeric: tabular-nums; }
.re-concepto { font-size: 12.5px; color: var(--vf-texto); margin-top: 2px; }
.re-cli { font-weight: 600; }
.re-cli a.dv-cli { font-weight: 600; }
.re-nota { margin-top: 5px; font-size: 12px; color: #6a5300; background: #fff8e1; border-radius: 4px; padding: 3px 7px; display: inline-block; max-width: 100%; white-space: pre-line; }
.re-nota .fa, .re-propio .fa { margin-right: 3px; }
.re-propio { margin-top: 6px; font-size: 12px; color: var(--vf-azul); background: #e6edf7; border-radius: 4px; padding: 3px 7px; display: inline-block; max-width: 100%; white-space: pre-line; }
.re-imp-error { color: var(--vf-error); }
.re-imp-gris { color: var(--vf-suave); text-decoration: line-through; text-decoration-color: rgba(107,122,140,.5); }
.re-imp-ok { color: var(--vf-ok); }
.re-pdf { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 12px; color: var(--vf-turquesa); background: none; border: 0; padding: 0; }
.re-pdf .fa { color: #D9302A; }
.re-pdf:hover { text-decoration: underline; }
.re-acc { gap: 6px; }
.re-acc .vf-btn.re-peligro { color: var(--vf-error); border-color: #f0c4be; }
.re-acc .vf-btn.re-peligro:hover { background: var(--vf-error-bg); }
.re-nopuede { font-size: 11.5px; color: var(--vf-suave); line-height: 1.35; }
.re-row.re-ca .re-concepto, .re-row.re-ca .re-cli { color: var(--vf-suave); }
.re-row .vf-msg { color: var(--vf-suave); }
.re-kpis .vf-kpi.re-k-em { border-top-color: var(--vf-info); }
.re-kpis .vf-kpi.re-k-em .vf-kpi-num { color: var(--vf-info); }
.re-kpis .vf-kpi { cursor: pointer; }
.re-busqueda-campo { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; align-items: center; }
.re-busqueda-campo .vf-search { flex: 1 1 260px; max-width: 460px; }
.re-fechas input { height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 0 8px; font-size: 13px; }
.re-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.re-tags .vf-badge { font-weight: 500; }
.re-que { margin-top: 6px; font-size: 12px; color: var(--vf-texto); background: var(--vf-fondo); border-left: 3px solid var(--vf-aviso); padding: 4px 8px; border-radius: 0 4px 4px 0; }
.re-que.ok { border-left-color: var(--vf-ok); }
.re-que.gris { border-left-color: #9aa8ba; }
.re-excluida { opacity: 1; }
.re-excluida .re-fecha, .re-excluida .re-cli, .re-excluida .re-concepto { color: var(--vf-suave); }
.re-excluida-tag { display: inline-block; margin-top: 6px; font-size: 11px; color: var(--vf-suave); border: 1px dashed #b8c3d0; border-radius: 10px; padding: 1px 8px; }
.re-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--vf-texto); cursor: pointer; margin: 0; font-weight: 400; user-select: none; }
.re-page .re-toggle input[type=checkbox] { opacity: 1 !important; float: none !important; position: static !important; width: 15px; height: 15px; margin: 0; }
/* Devueltos: periodo */
.rd-periodo { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.rd-excel-res { margin: 0 16px 10px; }
/* Cancelación masiva */
.cm-resumen { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 10px 0 4px; }
.cm-resumen > div { background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; padding: 8px 12px; }
.cm-resumen b { display: block; font-size: 18px; color: var(--vf-azul); font-variant-numeric: tabular-nums; }
.cm-resumen span { font-size: 11.5px; color: var(--vf-suave); text-transform: uppercase; letter-spacing: .3px; }
.cm-lista-res { list-style: none; margin: 10px 0 0; padding: 0; max-height: 320px; overflow: auto; border: 1px solid var(--vf-borde); border-radius: 6px; }
.cm-lista-res li { display: flex; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--vf-borde); font-size: 12.5px; align-items: flex-start; }
.cm-lista-res li:last-child { border-bottom: 0; }
.cm-lista-res li .fa { margin-top: 2px; }
.cm-lista-res li.ok .fa { color: var(--vf-ok); }
.cm-lista-res li.error .fa { color: var(--vf-error); }
.cm-lista-res li small { display: block; color: var(--vf-suave); }
.cm-selbar .vf-btn-primary.cm-peligro { background: var(--vf-error); border-color: var(--vf-error); }
.cm-selbar .vf-btn-primary.cm-peligro:hover { background: #a93226; border-color: #a93226; }
.cm-page .vf-check { outline: none; }
@media (max-width: 991px) {
    .re-page .vf-row.re-row, .re-page .vf-list.re-con-check .vf-row.re-row { grid-template-columns: 1fr 1fr; }
    .re-page .vf-row.re-row .vf-cell-estado, .re-page .vf-row.re-row .vf-cell-acciones { grid-column: 1 / -1; }
    .re-page .vf-list.re-con-check .vf-row.re-row > .vf-cell:nth-child(2) { padding-right: 34px; }
    .re-acc { position: relative; }
}
@media (max-width: 600px) {
    .re-page .vf-row.re-row, .re-page .vf-list.re-con-check .vf-row.re-row { grid-template-columns: 1fr; }
    .re-page .vf-toolbar .vf-select, .re-page .re-fechas { width: 100%; }
    .re-page .re-fechas { display: flex; gap: 6px; }
    .re-page .re-fechas.cl-oculto { display: none; }
    .re-page .re-fechas input { flex: 1; min-width: 0; }
    .re-acc .vf-btn { flex: 1 1 auto; justify-content: center; }
    .re-busqueda-campo .vf-btn { flex: 1; justify-content: center; }
}
.re-page .vf-banner .re-cerrar { background: none; border: 0; font-size: 20px; line-height: 1; color: inherit; opacity: .6; padding: 0 4px; }
.re-page .vf-banner .re-cerrar:hover { opacity: 1; }
/* 19/10/2026 (2): código del cobro y el recibo en la pasarela (RC.verPasarela / RC.accionesGC; ventanas fuera de .re-page) */
.re-cobro { display: inline-flex; align-items: center; gap: 4px; margin-top: 3px; font-family: Consolas, monospace; font-size: 11px; color: var(--vf-suave); max-width: 100%; }
.re-cobro span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.re-cobro .re-copiar { background: none; border: 0; padding: 0 3px; color: var(--vf-turquesa); font-size: 11.5px; line-height: 1; cursor: pointer; }
.re-cobro .re-copiar:hover { color: var(--vf-azul); }
.re-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; }
.re-dl dt { font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.re-dl dd { margin: 2px 0 0; font-size: 13.5px; overflow-wrap: anywhere; }
.re-pas-est { margin-bottom: 12px; }
.re-pas-est .vf-badge { font-size: 12.5px; padding: 4px 11px; white-space: normal; }
.vf-list.re-gc-list .vf-row { grid-template-columns: minmax(130px, .8fr) minmax(160px, 1.2fr) minmax(200px, 2fr); }
.fa-modal .re-que, .vf-modal .re-que { margin-top: 12px; font-size: 12.5px; color: var(--vf-texto); background: var(--vf-fondo); border-left: 3px solid #9aa8ba; padding: 6px 10px; border-radius: 0 4px 4px 0; }
.cm-aviso-tag { display: inline-block; margin-top: 6px; font-size: 11.5px; color: #7a4a00; background: var(--vf-aviso-bg); border-radius: 10px; padding: 2px 8px; }
@media (max-width: 991px) { .vf-list.re-gc-list .vf-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .re-dl { grid-template-columns: 1fr; } .vf-list.re-gc-list .vf-row { grid-template-columns: 1fr; } }
/* 19/10/2026: estado en GoCardless en cada recibo (RC.htmlEstadoGC) */
.re-gc { margin-top: 6px; font-size: 12px; color: var(--vf-suave); line-height: 1.5; }
.re-gc .fa { margin-right: 3px; }
.re-gc b { color: var(--vf-texto); font-weight: 600; }
.re-gc .re-gc-cod { font-family: Consolas, monospace; font-size: 11px; }
.re-gc .re-gc-ahora { font-size: 12px; padding: 0; margin-left: 4px; }
/* 21/10/2026: recibo devuelto: el motivo y qué hacer, en una alerta roja */
.re-alerta { display: flex; gap: 8px; align-items: flex-start; margin-top: 6px; padding: 7px 10px; background: #fdecea; border: 1px solid #f5c2bd; border-left: 3px solid #c0392b; border-radius: 4px; color: #8e1f14; font-size: 12.5px; line-height: 1.4; }
.re-alerta > .fa { color: #c0392b; margin-top: 2px; flex: none; }
.re-alerta-txt { font-weight: 500; }
.re-alerta-que { margin-top: 3px; color: #7a2a20; font-weight: 400; }

/* -- F6 -- */
/* =============================================================================
   DOMICILIACIONES (19/10/2026): Modificaciones masivas (mm-), Envío masivo de recibos (em-)
   y Domiciliaciones como cliente (rc-)
   ============================================================================= */
/* ---- Modificaciones masivas ---- */
.mm-page .mm-list .vf-row { grid-template-columns: minmax(180px, 1.25fr) minmax(190px, 1.5fr) 116px 116px 116px minmax(150px, 1fr); align-items: start; }
.mm-page .mm-dom { font-weight: 600; color: var(--vf-azul); line-height: 1.35; }
.mm-page .mm-dom .dv-cod { margin-right: 4px; }
.mm-page .mm-tag-emit { background: var(--vf-info-bg); color: var(--vf-info); }
.mm-page .mm-c-imp, .mm-page .mm-c-importe input { text-align: right; }
.mm-page .mm-campo { position: relative; }
.mm-page .mm-campo input { width: 100%; height: 32px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 13px; background: #fff; color: var(--vf-texto); font-variant-numeric: tabular-nums; }
.mm-page .mm-campo input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.mm-page .mm-campo.cambio input { background: #fff8e1; border-color: #e0b84f; }
.mm-page .mm-campo.mal input { background: var(--vf-error-bg); border-color: #e3958c; }
.mm-page .mm-campo.bloq input { background: var(--vf-fondo); color: var(--vf-suave); border-style: dashed; cursor: not-allowed; padding-left: 24px; }
.mm-page .mm-campo.bloq .fa-lock { position: absolute; left: 8px; top: 9px; font-size: 12px; color: #9aa8ba; }
.mm-page .mm-err { color: var(--vf-error); font-size: 11.5px; margin-top: 3px; line-height: 1.3; }
.mm-page .mm-antes { color: var(--vf-suave); font-size: 11px; margin-top: 3px; text-decoration: line-through; overflow-wrap: anywhere; }
.mm-page .vf-row.mm-cambiada { background: #fffdf3; }
.mm-page .vf-row.mm-ok { background: #f6fcf8; }
.mm-page .vf-row.mm-mal { box-shadow: inset 3px 0 0 var(--vf-error); }
.mm-page .mm-nada { color: var(--vf-suave); font-size: 12px; }
.mm-page .mm-leyenda { display: inline-block; padding: 0 6px; border-radius: 3px; }
.mm-page .mm-l-cambio { background: #fff8e1; border: 1px solid #e0b84f; color: #7a4a00; }
.mm-page .vf-toolbar .vf-select { min-width: 170px; }
.mm-modal .mm-rev { max-height: 55vh; overflow-y: auto; border: 1px solid var(--vf-borde); border-radius: 6px; }
.mm-modal .mm-rev-fila { padding: 10px 14px; border-bottom: 1px solid var(--vf-borde); font-size: 13px; }
.mm-modal .mm-rev-fila:last-child { border-bottom: none; }
.mm-modal .mm-rev-dom { font-weight: 600; color: var(--vf-azul); margin-bottom: 4px; }
.mm-modal .mm-rev-fila ul { margin: 0; padding-left: 18px; }
.mm-modal .mm-rev-antes { color: var(--vf-suave); text-decoration: line-through; }
.mm-modal .mm-rev-desp { color: var(--vf-ok); font-weight: 600; }
@media (max-width: 991px) {
    .mm-page .mm-list .vf-row { grid-template-columns: 1fr 1fr 1fr; }
    .mm-page .mm-c-dom, .mm-page .mm-c-renta, .mm-page .mm-c-res { grid-column: 1 / -1; }
    .mm-page .mm-c-imp { text-align: left; }
}
@media (max-width: 600px) {
    .mm-page .mm-list .vf-row { grid-template-columns: 1fr 1fr; }
    .mm-page .mm-c-importe { grid-column: 1 / -1; }
    .mm-page .mm-campo input { height: 40px; font-size: 16px; }
    .mm-page .vf-toolbar .vf-btn, .mm-page .vf-toolbar .vf-select { width: 100%; }
}

/* ---- Envío masivo de recibos ---- */
.em-page .em-list .vf-row { grid-template-columns: 34px minmax(190px, 1.3fr) minmax(180px, 1.4fr) 112px 120px minmax(170px, 1fr); align-items: start; }
.em-page .em-c-check { padding-top: 6px; }
.em-page .em-no { color: #c2ccd8; font-size: 17px; cursor: help; }
.em-page .em-dom { font-weight: 600; color: var(--vf-azul); line-height: 1.35; }
.em-page .em-dom .dv-cod { margin-right: 4px; }
.em-page .em-c-dom .vf-sub { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 4px; }
.em-page .em-c-dom .vf-tag { margin: 0; }
.em-page .em-mini { font-size: 10.5px; padding: 1px 7px; }
.em-page .em-tag-emit { background: var(--vf-info-bg); color: var(--vf-info); }
.em-page .em-c-imp, .em-page .em-c-importe input { text-align: right; }
.em-page .em-campo { position: relative; }
.em-page .em-campo input { width: 100%; height: 32px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 4px 8px; font-size: 13px; background: #fff; color: var(--vf-texto); font-variant-numeric: tabular-nums; }
.em-page .em-campo input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.em-page .em-campo input[readonly] { background: var(--vf-fondo); color: var(--vf-suave); }
.em-page .em-campo.bloq input { border-style: dashed; padding-left: 24px; cursor: not-allowed; }
.em-page .em-campo.bloq .fa-lock { position: absolute; left: 8px; top: 9px; font-size: 12px; color: #9aa8ba; }
.em-page .em-campo.mal input { background: var(--vf-error-bg); border-color: #e3958c; }
.em-page .em-err { color: var(--vf-error); font-size: 11.5px; margin-top: 3px; line-height: 1.3; }
.em-page .em-nada { color: var(--vf-suave); font-size: 12px; }
.em-page .vf-row.em-bloq .em-dom a, .em-page .vf-row.em-bloq .em-dom { color: var(--vf-suave); }
.em-page .vf-row.em-ok { background: #f6fcf8; }
.em-page .vf-row.em-mal { box-shadow: inset 3px 0 0 var(--vf-error); }
.em-page .em-bloque { background: #fff; gap: 8px 10px; }
.em-page .em-bloque-tit { font-size: 12px; font-weight: 600; color: var(--vf-azul); }
.em-page .em-bloque-campo { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--vf-suave); font-weight: 500; margin: 0; }
.em-page .em-bloque-campo input { height: 30px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 3px 8px; font-size: 13px; width: 120px; color: var(--vf-texto); }
.em-page .em-bloque-campo input#em_concepto_todas { width: 200px; }
.em-page .vf-toolbar .vf-select { min-width: 170px; }
.em-modal .em-res-cifras { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 10px; }
.em-modal .em-res-cifras > div { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 10px 12px; }
.em-modal .em-res-cifras b { display: block; font-size: 20px; color: var(--vf-azul); font-variant-numeric: tabular-nums; }
.em-modal .em-res-cifras span { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); }
.em-modal .em-res-fechas { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; margin-bottom: 6px; }
.em-modal .em-res-lista { max-height: 45vh; overflow-y: auto; border: 1px solid var(--vf-borde); border-radius: 6px; }
.em-modal .em-res-fila { display: flex; justify-content: space-between; gap: 12px; padding: 8px 12px; border-bottom: 1px solid var(--vf-borde); font-size: 13px; }
.em-modal .em-res-fila:last-child { border-bottom: none; }
.em-modal .em-res-der { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 991px) {
    .em-page .em-list .vf-row { grid-template-columns: 1fr 1fr; padding-left: 46px; }
    .em-page .em-c-check { position: absolute; left: 14px; top: 14px; }
    .em-page .em-c-dom, .em-page .em-c-renta, .em-page .em-c-est { grid-column: 1 / -1; }
    .em-page .em-c-imp { text-align: left; }
}
@media (max-width: 600px) {
    .em-page .em-campo input { height: 40px; font-size: 16px; }
    .em-page .vf-toolbar .vf-btn, .em-page .vf-toolbar .vf-select, .em-page .em-bloque-campo, .em-page .em-bloque-campo input, .em-page .em-bloque-campo input#em_concepto_todas { width: 100%; }
    .em-page .em-bloque-campo { flex-direction: column; align-items: stretch; }
    .em-modal .em-res-cifras { grid-template-columns: 1fr; }
}

/* ---- Domiciliaciones como cliente ---- */
.rc-page .rc-head { align-items: center; }
.rc-page .rc-head-txt { flex: 1; }
.rc-page .rc-logo { max-height: 64px; max-width: 160px; object-fit: contain; }
.rc-page .vf-tab.rc-vacia { opacity: .55; }
.rc-page .rc-list .vf-row { grid-template-columns: minmax(200px, 1.6fr) minmax(130px, 1fr) minmax(120px, .8fr) minmax(170px, 1.1fr) minmax(170px, 1fr); }
.rc-page .rc-rec .vf-row, .rc-page .rc-car .vf-row { grid-template-columns: 120px minmax(200px, 1.6fr) 110px minmax(190px, 1.3fr) minmax(150px, 1fr); }
.rc-page .rc-fac .vf-row { grid-template-columns: minmax(170px, 1.2fr) 120px minmax(170px, 1.2fr) minmax(170px, 1.1fr) 150px; }
.rc-page .rc-tit { font-weight: 600; color: var(--vf-azul); font-size: 13.5px; line-height: 1.35; }
.rc-page .rc-tit .dv-cod { margin-left: 4px; }
.rc-page .rc-imp { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; }
.rc-page .rc-c-imp { text-align: right; }
.rc-page .rc-fecha { font-variant-numeric: tabular-nums; font-weight: 500; }
.rc-page .rc-nada { color: var(--vf-suave); font-size: 12px; }
.rc-page .rc-prox { display: inline-flex; flex-direction: column; padding: 6px 10px; border-radius: 6px; background: var(--vf-info-bg); color: #0f5468; }
.rc-page .rc-prox b { font-size: 14px; }
.rc-page .rc-prox span { font-size: 12px; font-variant-numeric: tabular-nums; }
.rc-page .rc-linea { margin-top: 6px; }
.rc-page .rc-r { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; padding: 1px 0; font-variant-numeric: tabular-nums; }
.rc-page .rc-r.ok b { color: var(--vf-ok); }
.rc-page .rc-r.info b { color: var(--vf-info); }
.rc-page .rc-r.error b { color: var(--vf-error); }
.rc-page .rc-ver { margin-top: 6px; }
.rc-page .rc-campos { display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 12px; margin-top: 4px; color: var(--vf-texto); }
.rc-page .rc-acc { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.rc-page .rc-pdf .fa-file-pdf-o { color: #D9302A; }
.rc-page .rc-apagada .rc-tit, .rc-page .rc-apagada .rc-imp { color: var(--vf-suave); }
.rc-page .rc-filtro { margin: 10px 16px; }
@media (max-width: 991px) {
    .rc-page .rc-list .vf-row, .rc-page .rc-rec .vf-row, .rc-page .rc-car .vf-row, .rc-page .rc-fac .vf-row { grid-template-columns: 1fr 1fr; }
    .rc-page .rc-list .vf-row > .vf-cell:first-child { grid-column: 1 / -1; }
    .rc-page .rc-c-imp { text-align: left; }
    .rc-page .rc-rec .vf-row > .vf-cell:nth-child(2), .rc-page .rc-car .vf-row > .vf-cell:nth-child(2) { grid-column: 1 / -1; }
    .rc-page .rc-rec .vf-row > .vf-cell:first-child, .rc-page .rc-car .vf-row > .vf-cell:first-child { grid-column: auto; }
}
@media (max-width: 600px) {
    .rc-page .rc-logo { display: none; }
    .rc-page .rc-list .vf-row, .rc-page .rc-rec .vf-row, .rc-page .rc-car .vf-row, .rc-page .rc-fac .vf-row { grid-template-columns: 1fr; }
}

/* -- G3 -- */
/* -- movimientos_renta.php (19/10/2026, G3): recibos de una domiciliación. Prefijo mr- -- */
.mr-page .mr-cod-tit { font-size: 14px; margin-left: 6px; vertical-align: middle; }
.mr-renta { padding: 16px 18px; margin-bottom: 14px; }
.mr-renta-cab { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.mr-renta-ico { width: 40px; height: 40px; border-radius: 8px; background: var(--vf-info-bg); color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 18px; flex: none; }
.mr-renta-tit { flex: 1 1 260px; min-width: 0; }
.mr-renta-tit h3 { margin: 0 0 3px; font-size: 17px; font-weight: 600; color: var(--vf-azul); overflow-wrap: anywhere; }
.mr-renta-cli { font-size: 13px; }
.mr-renta-badges { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mr-renta-datos { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px 18px; margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--vf-borde); }
.mr-renta-datos dt { font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.mr-renta-datos dd { margin: 2px 0 0; font-size: 13.5px; color: var(--vf-texto); overflow-wrap: anywhere; }
.mr-renta-aviso { margin: 12px 0 0; }
.mr-totales { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 12px 0 0; }
.mr-totales-tit { font-size: 12px; color: var(--vf-suave); margin-right: 2px; }
.mr-tot { display: inline-flex; align-items: baseline; gap: 4px; padding: 3px 10px; border: 1px solid var(--vf-borde); border-radius: 999px; font-size: 12.5px; color: var(--vf-texto); }
.mr-tot b { font-variant-numeric: tabular-nums; }
.mr-tot span { color: var(--vf-suave); font-variant-numeric: tabular-nums; }
.mr-tot.ok b { color: var(--vf-ok, #15803d); }
.mr-tot.error b { color: var(--vf-error, #b91c1c); }
.mr-tot.info b { color: var(--vf-info, #1d4ed8); }
.mr-renta-acc { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--vf-borde); }
.mr-err { color: var(--vf-error, #b91c1c) !important; }
.mr-sol { margin-bottom: 14px; }
.mr-sol-cab { padding: 14px 18px 4px; }
.mr-sol-cab h3 { margin: 0 0 3px; font-size: 15px; font-weight: 600; color: var(--vf-azul); }
.mr-sol-cab .fa { color: var(--vf-aviso); }
.vf-list .vf-row.mr-sol-row { grid-template-columns: minmax(140px, 1fr) minmax(180px, 2fr) minmax(100px, .8fr) minmax(130px, .9fr); }
.mr-sol-cancelado .vf-cell { color: var(--vf-suave); }
.mr-recargando { opacity: .55; pointer-events: none; transition: opacity .15s; }
.mr-page .mr-trans { font-family: Consolas, monospace; font-size: 11px; }
.mr-marca { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 11.5px; font-weight: 600; padding: 2px 8px; border-radius: 10px; }
.mr-marca.ok { background: var(--vf-ok-bg); color: var(--vf-ok); }
.mr-marca.aviso { background: var(--vf-aviso-bg); color: var(--vf-aviso); }
.mr-marca.gris { background: var(--vf-gris-bg); color: var(--vf-suave); }
.mr-nopuede { font-size: 11.5px; color: var(--vf-suave); line-height: 1.35; }
.vf-btn.mr-btn-peligro { color: var(--vf-error); border-color: #f0b8b1; }
.vf-btn.mr-btn-peligro:hover { background: var(--vf-error-bg); }
.mr-check { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; padding: 10px 12px; border: 1px solid var(--vf-borde); border-radius: 6px; background: var(--vf-fondo); font-weight: 400; font-size: 13px; cursor: pointer; text-transform: none; }
.mr-check input[type=checkbox] { opacity: 1 !important; position: static !important; float: none !important; margin: 2px 0 0 !important; width: 16px; height: 16px; flex: none; accent-color: var(--vf-azul); }
.mr-check input[type=checkbox] + span { background: none !important; padding: 0 !important; }
.mr-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; }
.mr-dl dt { font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.mr-dl dd { margin: 2px 0 0; font-size: 13.5px; overflow-wrap: anywhere; }
.mr-cuentas { list-style: none; margin: 0; padding: 0; }
.mr-cuentas li { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--vf-borde); }
.mr-cuentas li:last-child { border-bottom: 0; }
.mr-cuentas .fa { color: var(--vf-turquesa, #1B799B); margin-top: 3px; }
.vf-list.mr-gc-list .vf-row { grid-template-columns: minmax(130px, .8fr) minmax(160px, 1.2fr) minmax(200px, 2fr); }
@media (max-width: 991px) {
    .vf-list .vf-row.mr-sol-row, .vf-list.mr-gc-list .vf-row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
    .mr-renta { padding: 12px; }
    .vf-list .vf-row.mr-sol-row, .vf-list.mr-gc-list .vf-row { grid-template-columns: 1fr; position: relative; }
    .mr-dl { grid-template-columns: 1fr; }
}
.mr-renta-cargando { margin: 10px 0 0; font-size: 12.5px; }
.mr-cuenta-actual { padding: 10px 12px; margin-bottom: 10px; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 6px; }
.mr-cuenta-actual .fa { color: var(--vf-turquesa); margin-right: 4px; }

/* -- G4 -- */
/* -- Cambiar la cuenta bancaria (modificar_cuenta.php, 19/10/2026) — prefijo mcu- (mc- ya es de movimientos_cuenta) -- */
.mcu-page { max-width: 1100px; }
.mcu-cliente { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--vf-borde); border-left: 3px solid var(--vf-turquesa, #1B799B); border-radius: 6px; padding: 12px 16px; margin-bottom: 16px; }
.mcu-cliente-ico { width: 38px; height: 38px; border-radius: 50%; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 16px; flex: none; }
.mcu-cliente-datos { flex: 1; min-width: 0; }
.mcu-cliente-nombre { font-size: 15px; font-weight: 600; color: var(--vf-azul); }
.mcu-cliente-nombre a.dv-cli { font-size: 15px; }
.mcu-cliente-datos .vf-sub { overflow-wrap: anywhere; }
.mcu-cliente-tags { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.mcu-cuenta-iban { font-family: Consolas, monospace; font-size: 16px; letter-spacing: .5px; color: var(--vf-texto); font-weight: 600; margin-bottom: 4px; }
.mcu-gc { margin-top: 10px; font-size: 12.5px; }
.mcu-recibos { margin-bottom: 16px; }
.mcu-recibos .vf-banner-body a { font-weight: 600; margin-left: 4px; }
.mcu-lista { list-style: none; margin: 10px 0 0; padding: 0; border-top: 1px solid rgba(0,0,0,.08); }
.mcu-lista li { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 10px; padding: 6px 0; border-bottom: 1px solid rgba(0,0,0,.06); font-size: 12.5px; align-items: center; }
.mcu-lista li b { white-space: nowrap; }
.mcu-page .vf-field input.form-control { height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; box-shadow: none; font-size: 13px; }
.mcu-page .vf-field.invalido input.form-control { border-color: var(--vf-error); }
.mcu-page .vf-err-txt { color: var(--vf-error); font-size: 12px; margin-top: 4px; display: block; font-weight: 500; }
.mcu-iban { font-family: Consolas, monospace; letter-spacing: .5px; text-transform: uppercase; }
.mcu-que { margin-top: 14px; font-size: 12.5px; color: var(--vf-suave); line-height: 1.5; }
.mcu-que .fa { color: var(--vf-turquesa, #1B799B); }
.mcu-acciones { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px; border-top: 1px solid var(--vf-borde); background: var(--vf-fondo, #f6f8fb); border-radius: 0 0 6px 6px; }
.mcu-bloqueada .vf-card-body { opacity: .6; }
.mcu-hecho { text-align: center; padding: 26px 22px; }
.mcu-hecho-ico { width: 54px; height: 54px; border-radius: 50%; background: var(--vf-ok-bg); color: var(--vf-ok); display: inline-flex; align-items: center; justify-content: center; font-size: 24px; margin-bottom: 8px; }
.mcu-hecho h3 { margin: 0 0 10px; color: var(--vf-azul); font-size: 19px; font-weight: 600; }
.mcu-hecho p { max-width: 640px; margin: 0 auto 8px; font-size: 13.5px; line-height: 1.55; }
.mcu-hecho-aviso { background: var(--vf-aviso-bg); color: #7a4a00; border-radius: 6px; padding: 8px 12px; }
.mcu-hecho-btns { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.mcu-preg { border: 1px solid var(--vf-borde); border-radius: 6px; padding: 4px 12px; background: var(--vf-fondo, #f6f8fb); }
.mcu-preg-fila { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--vf-borde); font-size: 13px; }
.mcu-preg-fila:last-child { border-bottom: 0; }
.mcu-preg-fila > span:first-child { color: var(--vf-suave); }
.mcu-preg-iban { font-family: Consolas, monospace; letter-spacing: .4px; }
.mcu-gc-cuenta { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--vf-borde); font-size: 13px; }
.mcu-gc-cuenta .fa { color: var(--vf-turquesa, #1B799B); margin-top: 3px; }
.mcu-modal-gc .modal-footer .vf-btn { min-width: 0; }
@media (max-width: 600px) {
    .mcu-cliente { flex-wrap: wrap; }
    .mcu-cliente-tags { justify-content: flex-start; width: 100%; }
    .mcu-lista li { grid-template-columns: 80px minmax(0, 1fr); }
    .mcu-lista li b { grid-column: 2; }
    .mcu-acciones .vf-btn { width: 100%; justify-content: center; }
    .mcu-page .vf-field input.form-control { height: 42px; font-size: 16px; }
    .mcu-preg-fila { flex-direction: column; gap: 2px; }
}
.mcu-iban::placeholder { text-transform: none; font-family: inherit; letter-spacing: 0; }
.mcu-misma { font-weight: 600; white-space: nowrap; }

/* -- G5 -- */
/* -- Páginas públicas de pago (stripe_pay.php, clases sp-) y firma del mandato (custom_mandate.php, clases cmd-), 19/10/2026 -- */
body.sp-body, body.cmd-body { background: #f2f5f9; font-family: Inter, "Helvetica Neue", Arial, sans-serif; color: #2c3e50; -webkit-font-smoothing: antialiased; }
body.sp-body input, body.sp-body button, body.sp-body label, body.sp-body h1, body.sp-body h4,
body.cmd-body input, body.cmd-body button, body.cmd-body label, body.cmd-body h1, body.cmd-body h4 { font-family: Inter, "Helvetica Neue", Arial, sans-serif; }

/* ---------------- Pago con tarjeta ---------------- */
.sp-wrap { max-width: 900px; margin: 0 auto; padding: 28px 16px 40px; }
.sp-logo { text-align: center; margin-bottom: 20px; }
.sp-logo img { max-height: 48px; max-width: 240px; }
.sp-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.sp-grid.sp-grid-uno { grid-template-columns: minmax(0, 520px); justify-content: center; }
.sp-grid.tab-disabled-pg { opacity: .5; }
.sp-card { background: #fff; border-radius: 12px; box-shadow: 0 6px 24px rgba(16, 40, 70, .08); padding: 22px 22px 20px; border-top: 4px solid var(--sp-color, #01397F); min-width: 0; }
.sp-resumen-cab { padding-bottom: 14px; border-bottom: 1px solid #eef1f5; margin-bottom: 12px; }
.sp-etiqueta { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: #6b7a8c; }
.sp-importe { font-size: 40px; font-weight: 700; color: var(--sp-color, #01397F); line-height: 1.15; margin-top: 4px; overflow-wrap: anywhere; }
.sp-datos { margin: 0 0 12px; }
.sp-datos > div { display: flex; gap: 12px; padding: 5px 0; font-size: 14px; }
.sp-datos dt { width: 82px; flex: none; color: #6b7a8c; font-weight: 500; }
.sp-datos dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.sp-nota { display: flex; gap: 10px; align-items: flex-start; margin-top: 10px; padding: 10px 12px; border-radius: 8px; background: var(--sp-color-suave, #e6f3f7); font-size: 13.5px; line-height: 1.5; }
.sp-nota > .fa { color: var(--sp-color, #01397F); margin-top: 3px; width: 14px; text-align: center; flex: none; }
.sp-nota-importante { background: #fff4e0; color: #6b4200; }
.sp-nota-importante > .fa { color: #b26a00; }
.sp-nota-gris { background: #f6f8fb; color: #6b7a8c; font-size: 12.5px; }
.sp-nota-gris > .fa { color: #8a99ab; }
.sp-contrato-ok { margin-top: 12px; font-size: 13.5px; color: #1e8e5a; }
.sp-enlace { color: var(--sp-color, #01397F); text-decoration: underline; cursor: pointer; font-weight: 600; }
.sp-aviso { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 16px; padding: 12px 14px; border-radius: 10px; background: #fff4e0; color: #6b4200; font-size: 14px; line-height: 1.5; border: 1px solid #f3dcb0; }
.sp-aviso > .fa { color: #b26a00; margin-top: 3px; }
.sp-aviso-ok { background: #e7f6ee; color: #1e6b45; border-color: #bfe5cf; }
.sp-aviso-ok > .fa { color: #1e8e5a; }
.sp-pago .sp-aviso { margin: 14px 0 12px; }
.sp-cliente { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; background: #f6f8fb; margin-bottom: 16px; min-width: 0; }
.sp-cliente > .fa { font-size: 26px; color: var(--sp-color, #01397F); flex: none; }
.sp-cliente b { display: block; font-size: 14px; overflow-wrap: anywhere; }
.sp-cliente span { display: block; font-size: 12.5px; color: #6b7a8c; overflow-wrap: anywhere; }
.sp-tarjeta-cab { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.sp-tarjeta-cab label { margin: 0; font-size: 15px; font-weight: 600; color: #2c3e50 !important; text-transform: none; letter-spacing: 0; }
.sp-tarjeta-cab img { height: 30px; width: auto; }
.sp-campo-tit { font-size: 12px; font-weight: 600; color: #2c3e50; margin: 8px 0 5px; }
.sp-campo-tit span { font-weight: 400; color: #8a99ab; }
.sp-body .sp-campo, .sp-body .sp-campo.StripeElement { background: #fff; border: 1px solid #cfd8e3; border-radius: 6px; box-shadow: none; height: 42px; padding: 11px 12px; width: 100%; float: none; margin: 0; }
.sp-body .sp-campo.StripeElement--focus { border-color: var(--sp-color, #1B799B); box-shadow: 0 0 0 3px var(--sp-color-medio, rgba(27,121,155,.15)); }
.sp-body .sp-campo.StripeElement--invalid { border-color: #c0392b; }
.sp-body .sp-campo-fila { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 100%; margin: 0; float: none; height: auto; border: 0; padding: 0; background: none; }
.sp-body #card-errors { color: #c0392b; font-size: 13px; margin-top: 8px; min-height: 18px; }
.sp-body .sp-boton, .sp-body .sp-boton:hover, .sp-body .sp-boton:focus, .sp-body .sp-boton:active { display: block; width: 100%; margin-top: 12px; border: none !important; border-radius: 8px; padding: 13px 16px; font-size: 16px; font-weight: 600; color: #fff !important; background: var(--sp-color, #01397F) !important; box-shadow: none; text-transform: none; letter-spacing: 0; opacity: 1; white-space: normal; }
.sp-body .sp-boton:hover { filter: brightness(1.08); }
.sp-body .sp-boton.disabled, .sp-body .sp-boton[disabled] { opacity: .6 !important; }
.sp-body .sp-boton .fa-spinner { color: #fff !important; }
.sp-boton-nota { font-size: 12.5px; color: #6b7a8c; text-align: center; margin: 8px 0 0; }
.sp-seguro { margin-top: 14px; font-size: 12.5px; color: #6b7a8c; line-height: 1.5; }
.sp-seguro .fa { color: #1e8e5a; margin-right: 4px; }
.sp-confianza { text-align: center; margin-top: 16px; padding-top: 14px; border-top: 1px solid #eef1f5; }
.sp-confianza img { width: 170px; max-width: 70%; height: auto; }
.sp-error { text-align: center; padding: 8px 0 4px; }
.sp-error > .fa { font-size: 40px; color: #c0392b; }
.sp-error h1 { font-size: 20px; font-weight: 600; margin: 10px 0 8px; color: #2c3e50; }
.sp-error p { font-size: 14px; color: #4a5a6c; }
.sp-error-motivo { margin-top: 8px; padding: 8px 10px; border-radius: 8px; background: #fdecea; color: #8a271d; font-size: 13px; }
.sp-pie { text-align: center; color: #8a99ab; font-size: 12px; margin-top: 18px; }
.sp-pie a { color: #6b7a8c; text-decoration: underline; }
.sp-modal .sp-contrato-texto { max-height: 50vh; overflow: auto; padding: 4px 2px 12px; font-size: 14px; line-height: 1.55; }
.sp-firma, .cmd-firma { margin-top: 10px; padding: 14px; border: 1px solid #e3e8ef; border-radius: 10px; background: #f6f8fb; }
.sp-firma-tit, .cmd-firma-tit { font-size: 13.5px; font-weight: 600; margin-bottom: 8px; color: #2c3e50; }
.sp-firma-cuadro, .cmd-firma-cuadro { background: #fff; border: 1.5px dashed #b8c2ce; border-radius: 8px; width: 100%; min-height: 150px; touch-action: none; -ms-touch-action: none; overflow: hidden; }
.sp-firma-cuadro canvas, .cmd-firma-cuadro canvas { touch-action: none; }
.sp-firma-botones, .cmd-firma-botones { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.sp-btn-color, .sp-btn-color:hover, .sp-btn-color:focus { background: var(--sp-color, #01397F) !important; border-color: var(--sp-color, #01397F) !important; color: #fff !important; }
@media (max-width: 767px) {
	.sp-wrap { padding: 18px 12px 30px; }
	.sp-grid { grid-template-columns: minmax(0, 1fr); }
	.sp-importe { font-size: 34px; }
	.sp-body .sp-campo, .sp-body .sp-campo.StripeElement { height: 46px; padding: 13px 12px; }
	.sp-firma-botones .vf-btn, .cmd-firma-botones .vf-btn { flex: 1 1 0; justify-content: center; min-height: 44px; font-size: 15px; }
}

/* ---------------- Firma del mandato SEPA ---------------- */
.cmd-wrap { max-width: 860px; margin: 0 auto; padding: 24px 16px 40px; }
.cmd-barra { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.cmd-logo img { max-height: 44px; max-width: 220px; }
.cmd-pasos { display: flex; gap: 6px; margin: 0 0 14px; padding: 0; list-style: none; }
.cmd-pasos li { flex: 1 1 0; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid #e3e8ef; font-size: 13px; color: #6b7a8c; line-height: 1.3; }
.cmd-pasos li .cmd-paso-corto { display: none; }
.cmd-pasos li b { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--cmd-color, #01397F); color: #fff; font-size: 12px; }
.cmd-card { background: #fff; border-radius: 12px; box-shadow: 0 6px 24px rgba(16, 40, 70, .08); padding: 18px 20px; border-top: 4px solid var(--cmd-color, #01397F); margin-bottom: 16px; min-width: 0; }
.cmd-card-tit { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 600; color: var(--cmd-color, #01397F); margin: 0 0 4px; }
.cmd-card-sub { font-size: 13px; color: #6b7a8c; margin: 0 0 12px; }
.cmd-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; background: #e6f3f7; color: #0f5468; font-size: 14px; line-height: 1.5; margin-bottom: 14px; border: 1px solid #c7e3ec; }
.cmd-aviso > .fa { margin-top: 3px; }
.cmd-aviso-error { background: #fdecea; color: #8a271d; border-color: #f5c6c0; }
/* El documento del mandato: su HTML (#contenido_interno) es el que se guarda en el PDF y NO se toca; aquí solo se le da aspecto en pantalla */
.cmd-body #div_completo_mandato { padding: 6px 4px; }
.cmd-body #contenido_interno { margin: 0 !important; font-family: Inter, "Helvetica Neue", Arial, sans-serif; overflow-wrap: anywhere; }
.cmd-body #contenido_interno td { vertical-align: top; padding-right: 10px; }
/* Documento en móvil (#contenido_html_responsive, solo para ver) */
.cmd-doc-tit { font-size: 18px; font-weight: 700; margin: 0 0 10px; line-height: 1.3; }
.cmd-doc-meta { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; font-size: 14px; margin-bottom: 14px; }
.cmd-doc-meta dt { color: #6b7a8c; font-weight: 500; }
.cmd-doc-meta dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.cmd-parte { border: 1px solid #e3e8ef; border-radius: 10px; margin-bottom: 12px; overflow: hidden; }
.cmd-parte-tit { background: var(--cmd-color, #01397F); color: #fff; font-weight: 600; font-size: 14px; padding: 7px 12px; }
.cmd-parte dl { margin: 0; padding: 8px 12px; }
.cmd-parte dt { font-size: 12px; color: var(--cmd-color, #01397F); font-weight: 600; margin-top: 6px; }
.cmd-parte dt:first-child { margin-top: 0; }
.cmd-parte dd { margin: 0; font-size: 14.5px; overflow-wrap: anywhere; }
.cmd-legal { font-size: 13.5px; line-height: 1.55; color: #2c3e50; }
.cmd-legal p { margin: 0 0 10px; }
.cmd-privacidad { font-size: 12px; color: #6b7a8c; font-style: italic; }
.cmd-privacidad a { color: #6b7a8c; text-decoration: underline; }
.cmd-contrato { display: flex; gap: 10px; align-items: flex-start; margin: 12px 0 2px; font-size: 14px; line-height: 1.45; }
.cmd-body .cmd-contrato input[type=checkbox] { opacity: 1 !important; float: none !important; position: static !important; margin: 2px 0 0 !important; width: 20px; height: 20px; flex: none; accent-color: var(--cmd-color, #01397F); cursor: pointer; }
.cmd-body .cmd-contrato input[type=checkbox] + label { background: none !important; padding: 0 !important; margin: 0; font-weight: 500; color: #2c3e50; cursor: pointer; text-transform: none; font-size: 14px; letter-spacing: 0; }
.cmd-ver-contrato { color: var(--cmd-color, #01397F); text-decoration: underline; cursor: pointer; font-weight: 600; }
.cmd-btn-color, .cmd-btn-color:hover, .cmd-btn-color:focus { background: var(--cmd-color, #01397F) !important; border-color: var(--cmd-color, #01397F) !important; color: #fff !important; }
.cmd-otp { max-width: 420px; margin: 0 auto 16px; }
.cmd-otp .vf-field input { height: 46px; font-size: 22px; letter-spacing: 8px; text-align: center; font-weight: 600; border: 1px solid #cfd8e3; border-radius: 6px; width: 100%; }
.cmd-otp-pie { font-size: 13px; color: #6b7a8c; margin-top: 10px; }
.cmd-pie { text-align: center; color: #8a99ab; font-size: 12px; margin-top: 8px; line-height: 1.7; }
.cmd-pie a { color: #6b7a8c; }
.cmd-pie .fa { margin: 0 4px 0 10px; }
/* Selector de idioma (flagStrap) */
.cmd-body #language_selector { flex: 0 0 auto; width: auto; margin-left: auto; }
.cmd-body #language_selector .btn { border: 1px solid #cfd8e3 !important; border-radius: 6px; background: #fff !important; color: #2c3e50 !important; font-size: 13px; padding: 6px 10px; box-shadow: none; }
.cmd-body #language_selector .dropdown-menu { border-radius: 8px; border: 1px solid #e3e8ef; box-shadow: 0 6px 20px rgba(16,40,70,.12); }
@media (max-width: 767px) {
	.cmd-wrap { padding: 14px 10px 30px; }
	.cmd-card { padding: 14px 14px; }
	.cmd-pasos li { justify-content: center; gap: 6px; padding: 8px 6px; font-size: 12.5px; white-space: nowrap; }
	.cmd-pasos li b { width: 20px; height: 20px; font-size: 11px; }
	.cmd-pasos li .cmd-paso-largo { display: none; }
	.cmd-pasos li .cmd-paso-corto { display: inline; }
	.cmd-otp .vf-field input { font-size: 24px; }
}

/* Mandato con «logo en mandato»: en escritorio el logo ya sale dentro de la orden (#contenido_interno); en móvil (vista responsive) sí en la barra */
@media (min-width: 481px) { .cmd-body .cmd-logo.cmd-logo-solo-movil { display: none; } }

/* -- G6 -- */
/* -- Páginas públicas del enlace de alta: ext_alta_cliente.php (clases ea-) e ext_iban_antes_mandato.php (clases ia-), 19/10/2026 -- */
body.ea-body, body.ia-body { background: #f2f5f9; font-family: Inter, "Helvetica Neue", Arial, sans-serif; color: #2c3e50; -webkit-font-smoothing: antialiased; }
body.ea-body input, body.ea-body select, body.ea-body button, body.ea-body label, body.ea-body h1, body.ea-body h2, body.ea-body h3, body.ea-body h4,
body.ia-body input, body.ia-body select, body.ia-body button, body.ia-body label, body.ia-body h1, body.ia-body h2, body.ia-body h4 { font-family: Inter, "Helvetica Neue", Arial, sans-serif; }

.ea-wrap, .ia-wrap { max-width: 820px; margin: 0 auto; padding: 24px 16px 36px; }
.ea-logo, .ia-logo { text-align: center; margin-bottom: 18px; }
.ea-logo img, .ia-logo img { max-width: 100%; max-height: 90px; width: auto; object-fit: contain; }

.ea-card, .ia-card { background: #fff; border-radius: 12px; box-shadow: 0 6px 24px rgba(16, 40, 70, .08); padding: 20px 22px; margin-bottom: 16px; min-width: 0; }
.ea-resumen { border-top: 4px solid var(--ea-color, #01397F); }
.ea-resumen-cab { text-align: center; padding-bottom: 14px; border-bottom: 1px solid #eef1f5; margin-bottom: 14px; }
.ea-comercio { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--ea-color, #01397F); overflow-wrap: anywhere; }
.ea-titulo { font-size: 20px; font-weight: 700; line-height: 1.3; margin: 6px 0 0; color: #2c3e50; overflow-wrap: anywhere; }
.ea-importe-caja { text-align: center; padding: 14px 12px; border-radius: 10px; background: var(--ea-color-suave, #eef4fb); margin-bottom: 12px; }
.ea-etiqueta { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: #6b7a8c; }
.ea-importe { font-size: 38px; font-weight: 700; line-height: 1.15; color: var(--ea-color, #01397F); margin-top: 2px; overflow-wrap: anywhere; }
.ea-importe.ea-importe-var { font-size: 24px; margin-top: 6px; }
.ea-importe-nota { font-size: 13px; color: #4a5a6c; margin-top: 2px; }
.ea-periodo { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 3px 12px; border-radius: 20px; background: #fff; color: var(--ea-color, #01397F); font-size: 13px; font-weight: 600; }
.ea-datos { margin: 0; }
.ea-datos > div { display: flex; gap: 12px; padding: 7px 0; font-size: 14.5px; border-bottom: 1px dashed #eef1f5; }
.ea-datos > div:last-child { border-bottom: none; }
.ea-datos dt { width: 170px; flex: none; color: #6b7a8c; font-weight: 500; }
.ea-datos dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; min-width: 0; }
.ea-nota { display: flex; gap: 10px; align-items: flex-start; margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: #fff4e0; color: #6b4200; font-size: 13.5px; line-height: 1.5; }
.ea-nota > .fa { color: #b26a00; margin-top: 3px; }

.ea-info, .ia-info { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 16px; padding: 14px 16px; border-radius: 12px; background: var(--ea-color-suave, #e6f3f7); border: 1px solid var(--ea-color-medio, #c7e3ec); color: #2c3e50; font-size: 14.5px; line-height: 1.55; }
.ea-info > .fa, .ia-info > .fa { color: var(--ea-color, #01397F); font-size: 18px; margin-top: 2px; flex: none; }
.ia-info { background: #e6f3f7; border-color: #c7e3ec; }
.ia-info > .fa { color: #01397F; }

.ea-sec-tit, .ia-sec-tit { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 700; margin: 0 0 4px; color: #2c3e50; }
.ea-paso { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 26px; height: 26px; border-radius: 50%; background: var(--ea-color, #01397F); color: #fff; font-size: 13px; font-weight: 700; }
.ea-sec-sub, .ia-sec-sub { font-size: 13.5px; color: #6b7a8c; margin: 0 0 14px; }
.ea-sub-tit { font-size: 14px; font-weight: 600; margin: 18px 0 10px; color: #2c3e50; }

/* Casillas como interruptores, con su explicación */
.ea-opciones { display: grid; gap: 10px; }
.ea-body label.ea-opcion { position: relative; display: flex; gap: 14px; align-items: flex-start; margin: 0; padding: 12px 14px; border: 1px solid #e3e8ef; border-radius: 10px; background: #fff; cursor: pointer; font-weight: 400; text-transform: none; letter-spacing: 0; color: #2c3e50; transition: border-color .15s, background .15s; }
.ea-body label.ea-opcion:hover { border-color: var(--ea-color-medio, #c7e3ec); }
.ea-body .ea-opcion input[type=checkbox], .ea-body .ea-check input[type=checkbox] { position: absolute; opacity: 0 !important; width: 1px; height: 1px; margin: 0; float: none; pointer-events: none; }
.ea-switch { position: relative; flex: none; width: 44px; height: 26px; border-radius: 13px; background: #cfd8e3; margin-top: 1px; transition: background .15s; }
.ea-switch:after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: left .15s; }
.ea-opcion input:checked + .ea-switch { background: var(--ea-color, #01397F); }
.ea-opcion input:checked + .ea-switch:after { left: 21px; }
.ea-opcion input:focus-visible + .ea-switch, .ea-check input:focus-visible + .ea-check-caja { box-shadow: 0 0 0 3px var(--ea-color-medio, rgba(27,121,155,.25)); }
.ea-body label.ea-opcion:has(input:checked) { border-color: var(--ea-color, #01397F); background: var(--ea-color-suave, #eef4fb); }
.ea-opcion-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ea-opcion-txt b { font-size: 14.5px; font-weight: 600; }
.ea-opcion-txt small { font-size: 12.5px; color: #6b7a8c; line-height: 1.45; }

/* Campos */
.ea-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 14px; }
.ea-grid .ea-col-2 { grid-column: span 2; }
.ea-grid .ea-col-3 { grid-column: span 3; }
.ea-grid .ea-col-todo { grid-column: 1 / -1; }
.ea-grid .ea-field:not(.ea-col-2):not(.ea-col-3):not(.ea-col-todo) { grid-column: span 1; }
.ea-field, .ia-field { margin-bottom: 14px; min-width: 0; }
.ea-body .ea-field label, .ia-body .ia-field label { display: block; font-size: 13px; font-weight: 600; color: #2c3e50; margin: 0 0 6px; text-transform: none; letter-spacing: 0; }
.ea-req { color: #c0392b; margin-left: 2px; }
.ea-body .ea-field input[type=text], .ea-body .ea-field select, .ia-body .ia-field input[type=text] { display: block; width: 100%; height: 46px; padding: 10px 12px; font-size: 16px; color: #2c3e50; background: #fff; border: 1px solid #cfd8e3; border-radius: 8px; box-shadow: none; -webkit-appearance: none; appearance: none; transition: border-color .15s, box-shadow .15s; }
.ea-body .ea-field select { padding-right: 36px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7a8c' d='M6 8 0 0h12z'/%3E%3C/svg%3E") no-repeat right 14px center; }
.ea-body .ea-field input::placeholder, .ia-body .ia-field input::placeholder { color: #a3afbd; }
.ea-body .ea-field input:focus, .ea-body .ea-field select:focus, .ia-body .ia-field input:focus { outline: none; border-color: var(--ea-color, #1B799B); box-shadow: 0 0 0 3px var(--ea-color-medio, rgba(27,121,155,.15)); }
.ia-body .ia-field input:focus { border-color: #1B799B; box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.ea-body .ea-field input.error, .ea-body .ea-field select.error, .ia-body .ia-field input.error { border-color: #c0392b; }
.ea-body .ea-field label.error, .ia-body .ia-field label.error { display: block; margin: 5px 0 0; font-size: 12.5px; font-weight: 500; color: #c0392b; text-transform: none; line-height: 1.4; }
.ea-iban, .ia-body #iban { font-family: "SFMono-Regular", Menlo, Consolas, monospace !important; letter-spacing: .5px; }
.ea-iban::placeholder, .ia-body #iban::placeholder { font-family: Inter, "Helvetica Neue", Arial, sans-serif; letter-spacing: 0; }
.ea-ayuda, .ia-ayuda { font-size: 12.5px; color: #6b7a8c; margin-top: 5px; line-height: 1.45; }
.ea-field-importe { margin-top: 14px; }
.ea-alerta { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 14px; padding: 12px 14px; border-radius: 10px; background: #fdecea; color: #8a271d; border: 1px solid #f5c6c0; font-size: 14px; line-height: 1.5; }
.ea-alerta > .fa { margin-top: 3px; }
.ea-empresa { padding: 12px 14px 0; margin: 0 0 14px; border-radius: 10px; background: #f6f8fb; }

/* Privacidad y botón */
.ea-body label.ea-check { position: relative; display: flex; gap: 12px; align-items: center; margin: 0 0 10px; padding: 10px 12px; border: 1px solid #e3e8ef; border-radius: 10px; cursor: pointer; font-size: 15px; font-weight: 500; color: #2c3e50; text-transform: none; letter-spacing: 0; }
.ea-body label.ea-check.ea-check-falta { border-color: #c0392b; background: #fdecea; }
.ea-check-caja { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; border: 2px solid #b8c2ce; border-radius: 6px; background: #fff; transition: background .15s, border-color .15s; }
.ea-check-caja .fa { font-size: 14px; color: #fff; opacity: 0; }
.ea-check input:checked + .ea-check-caja { background: var(--ea-color, #01397F); border-color: var(--ea-color, #01397F); }
.ea-check input:checked + .ea-check-caja .fa { opacity: 1; }
.ea-body .ea-check a, .ea-enlace { color: var(--ea-color, #01397F) !important; text-decoration: underline; font-weight: 600; cursor: pointer; }
.ea-rgpd { margin: 0 0 16px; font-size: 13.5px; }
.ea-body .ea-boton, .ia-body .ia-boton { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 54px; padding: 14px 18px; border: none; border-radius: 10px; background: var(--ea-color, #01397F); color: #fff; font-size: 17px; font-weight: 700; cursor: pointer; box-shadow: 0 4px 14px var(--ea-color-medio, rgba(1,57,127,.25)); transition: filter .15s; }
.ia-body .ia-boton { background: #01397F; box-shadow: 0 4px 14px rgba(1,57,127,.25); }
.ea-body .ea-boton:hover, .ia-body .ia-boton:hover { filter: brightness(1.08); }
.ea-body .ea-boton:focus-visible, .ia-body .ia-boton:focus-visible { outline: 3px solid var(--ea-color-medio, rgba(1,57,127,.3)); outline-offset: 2px; }
.ea-body .ea-boton[disabled], .ia-body .ia-boton[disabled] { opacity: .65; cursor: wait; }
.ea-boton-nota, .ia-boton-nota { text-align: center; font-size: 12.5px; color: #6b7a8c; margin: 10px 0 0; line-height: 1.45; }
.ea-boton-nota .fa, .ia-boton-nota .fa { color: #1e8e5a; margin-right: 3px; }

/* Estados (enlace no válido / falta firmar / terminado) */
.ea-estado, .ia-estado { text-align: center; padding: 28px 22px; border-top: 4px solid var(--ea-color, #01397F); }
.ia-estado { border-top-color: #01397F; }
.ea-estado-icono, .ia-estado-icono { font-size: 44px; color: var(--ea-color, #01397F); margin-bottom: 8px; }
.ea-estado-ok { color: #1e8e5a; }
.ea-estado-error, .ia-estado-icono.ia-estado-error { color: #c0392b; }
.ea-estado h1, .ia-estado h1 { font-size: 21px; font-weight: 700; margin: 6px 0 10px; color: #2c3e50; }
.ea-estado p, .ia-estado p { font-size: 15px; line-height: 1.55; color: #3d4c5c; text-align: left; margin: 0 0 16px; }
.ea-estado p a { color: var(--ea-color, #01397F); text-decoration: underline; }

.ea-pie, .ia-pie { text-align: center; color: #8a99ab; font-size: 12.5px; margin-top: 6px; line-height: 1.8; }
.ea-pie span, .ia-pie span { margin: 0 8px; white-space: nowrap; }
.ea-pie a, .ia-pie a { color: #6b7a8c; text-decoration: underline; }

/* Ventanas: Política de privacidad (PDF) e Información básica de protección de datos (include común, solo aspecto aquí) */
.ea-modal .ea-pdf embed { display: block; border: 1px solid #e3e8ef; border-radius: 8px; height: 65vh; min-height: 360px; }
.ea-pdf-alt { font-size: 13px; color: #6b7a8c; margin: 10px 0 0; }
.ea-pdf-alt a { color: var(--ea-color, #01397F); text-decoration: underline; }
.ea-body #modal_informacion_basica_rgpd .modal-content { border: none; border-radius: 12px; box-shadow: 0 12px 40px rgba(15,30,50,.25); }
.ea-body #modal_informacion_basica_rgpd .modal-header { border-bottom: none; padding-bottom: 0 !important; }
.ea-body #modal_informacion_basica_rgpd .rgpd-content { font-size: 14px; line-height: 1.55; }
.ea-body #modal_informacion_basica_rgpd .modal-footer .btn { border-radius: 8px; }

@media (max-width: 600px) {
	.ea-wrap, .ia-wrap { padding: 14px 12px 28px; }
	.ea-card, .ia-card { padding: 16px 14px; border-radius: 12px; }
	.ea-titulo { font-size: 18px; }
	.ea-importe { font-size: 34px; }
	.ea-grid { grid-template-columns: minmax(0, 1fr); }
	.ea-grid .ea-col-2, .ea-grid .ea-col-3, .ea-grid .ea-field { grid-column: 1 / -1 !important; }
	.ea-datos > div { flex-direction: column; gap: 0; padding: 6px 0; }
	.ea-datos dt { width: auto; font-size: 12.5px; }
	.ea-info, .ia-info { font-size: 14px; padding: 12px 13px; }
	.ea-body .ea-field input[type=text], .ea-body .ea-field select, .ia-body .ia-field input[type=text] { height: 50px; }
	.ea-modal .ea-pdf embed { height: 55vh; }
	.ea-pie span, .ia-pie span { display: block; margin: 0; }
}
.ea-opciones + .ea-field { margin-top: 14px; }
.ea-body #modal_informacion_basica_rgpd p, .ea-body #modal_informacion_basica_rgpd li { font-size: 14px; line-height: 1.55; }
/* Poner el IBAN antes del mandato (ia-) */
.ia-wrap { max-width: 620px; }
.ia-cab { text-align: center; border-top: 4px solid #01397F; }
.ia-etiqueta { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #1B799B; }
.ia-titulo { font-size: 20px; font-weight: 700; margin: 6px 0 4px; color: #2c3e50; overflow-wrap: anywhere; line-height: 1.3; }
.ia-cab .ia-sec-sub { margin: 0; }
.ia-sec-tit .fa { color: #01397F; }
.ia-alerta { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 14px; padding: 12px 14px; border-radius: 10px; background: #fdecea; color: #8a271d; border: 1px solid #f5c6c0; font-size: 14px; }
.ia-body .ia-boton { margin-top: 6px; }
.ia-body .ia-sec-tit { margin-bottom: 14px; }

/* =============================================================================
   MENÚ TARJETAS (21/10/2026): Posición global, Calendario, Nuevo pago recurrente, Pagos recurrentes,
   Enlaces de tarjetas (+ ext_alta_cliente_tarjeta.php), Transacciones, Informe, Modificación y Cancelación masiva.
   Prefijos: tj- (común, tarjetas_comun_vf.js), dtj-, ctj-, npr-, ptj-, etj-, eat-, trx-, itj-, pmm-, cmp-
   ============================================================================= */
/* ---- Común del menú Tarjetas (tarjetas_comun_vf.js, prefijo tj-) ---- */
.tj-pas { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; line-height: 1; padding: 3px 7px; border-radius: 10px; background: #eef1f5; color: #4a5a6c; white-space: nowrap; }
.tj-pas .fa { font-size: 10px; }
.tj-pas-st { background: #eeedfd; color: #4b45c6; }
.tj-pas-pn { background: #e6f3f7; color: #1B799B; }
.tj-pas-mo { background: #e7f6ee; color: #1e8e5a; }
.tj-pas-mx { background: #fff4e0; color: #9a5b00; }
.tj-enlace { margin-top: 8px; border: 1px solid #e3e8ef; border-radius: 6px; background: #f6f8fb; padding: 8px 10px; }
.tj-enlace-tit { font-size: 12px; font-weight: 600; color: #01397F; margin-bottom: 6px; }
.tj-enlace-fila { display: flex; gap: 6px; align-items: center; }
.tj-enlace-fila input { flex: 1; min-width: 0; height: 30px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 0 8px; font-size: 12px; color: #2c3e50; background: #fff; }
.tj-enlace-aviso { margin-top: 6px; font-size: 11.5px; color: #8a5a00; }
.tj-enlace-aviso .fa { color: #b26a00; }
@media (max-width: 600px) { .tj-enlace-fila { flex-wrap: wrap; } .tj-enlace-fila .vf-btn { width: 100%; } }

/* ---- Tarjetas: Posición global (dashboard_tarjetas.php, prefijo dtj-) y Calendario (calendar_tarjetas.php, prefijo ctj-) (21/10/2026) ---- */
/* Usan además las clases de la Posición global y el Calendario de domiciliaciones (pg-, pgd-, cal-, crm-ficha) */
.dtj-kpis { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.dtj-reparto:empty { display: none; }
.dtj-reparto { margin: -4px 0 16px; }
.dtj-barra { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: #eef1f5; }
.dtj-seg { display: block; height: 100%; }
.dtj-seg-cob { background: #1e8e5a; } .dtj-seg-pen { background: #e0a800; } .dtj-seg-dev { background: #c0392b; }
.dtj-barra-ley { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 6px; font-size: 12.5px; color: var(--vf-texto); }
.dtj-barra-ley b { font-variant-numeric: tabular-nums; }
.dtj-pto { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: 0; }
.dtj-accesos { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.dtj-page a.vf-kpi .vf-kpi-label { white-space: normal; }
@media (max-width: 600px) { .dtj-accesos .vf-btn { flex: 1 1 calc(50% - 8px); justify-content: center; } }

/* Calendario de tarjetas */
.ctj-page { --cal-pen: #b26a00; --cal-tdev: #9c27b0; }
.cal-punto.ctj-c-pen { background: var(--cal-pen); } .cal-punto.ctj-c-dev { background: var(--cal-tdev); }
.cal-chip.ctj-c-pen { border-color: var(--cal-pen); background: #fff4e0; }
.cal-chip.ctj-c-dev { border-color: var(--cal-tdev); background: #f6e8f8; }
.vf-kpi.ctj-k-dev { border-top-color: #9c27b0; } .vf-kpi.ctj-k-dev .vf-kpi-num { color: #8a1f9c; }
.ctj-page .cal-kpis .vf-kpi.k-aviso .vf-kpi-num { color: var(--vf-aviso); }
.ctj-item-acc { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; font-size: 12px; }
.ctj-item-acc a { color: var(--vf-turquesa); }
.ctj-dia .cal-item-der { flex-direction: column; align-items: flex-end; gap: 3px; }

/* =============================================================================
   NUEVO PAGO RECURRENTE (21/10/2026) — nuevo_cargo_tarjeta.php + nuevo_cargo_tarjeta_vf.js (prefijo npr-)
   Usa también las clases de Nueva domiciliación (nr-: pasos, resumen al lado, opciones, resultado).
   ============================================================================= */
/* Pasos: los que no se ven se apartan sin display:none (jquery.validate sigue comprobando todo el formulario al crear) */
.npr-panes { position: relative; }
.npr-pane:not(.activo) { position: absolute; left: 0; right: 0; top: 0; height: 0; overflow: hidden; visibility: hidden; pointer-events: none; }
.npr-page ul.nr-pasos > li > a { cursor: default; }
.npr-page ul.nr-pasos > li.npr-ir > a { cursor: pointer; }
.npr-page ul.nr-pasos > li.npr-ir > a:hover { color: var(--vf-azul); }
.npr-page .nr-barra .npr-sig, .npr-page .nr-barra #btn_guardar { margin-left: auto; }
.npr-page .nr-barra .npr-ant.disabled { opacity: .45; pointer-events: none; }
.npr-forzar-zona { justify-content: flex-end; }
.npr-forzar-zona .cl-switch { margin-top: 2px; }
.npr-plazo-grid { margin-top: 12px; }
.npr-page #div_es_indefinida_check.d-none + .npr-plazo-grid { margin-top: 0; }
.npr-page .div-advertencia-caducidad { margin: 8px 0 0; }
.npr-page .div-advertencia-caducidad.d-inline-block { display: flex !important; }
.npr-pas-nom { margin-left: 6px; font-weight: 600; color: var(--vf-texto); }
.npr-cli-tj { display: inline-block; margin-top: 4px; }
.npr-cli-tj.error { color: #8a271d; }
.npr-aviso-com { color: #b26a00 !important; }
.npr-cambios { margin-top: 8px; }
.npr-hecho-aviso { background: var(--vf-aviso-bg) !important; color: var(--vf-aviso) !important; }
.npr-hecho-enlace { text-align: left; }
.npr-hecho-enlace > p { font-size: 12.5px; color: var(--vf-suave); margin: 0 0 4px; }
.npr-page #npr_tarjeta_aviso .vf-banner, .npr-page #div_tiene_tarjeta .vf-banner { margin-bottom: 12px; }
@media (max-width: 600px) {
    .npr-forzar-zona > label:first-child { display: none; }
}
.npr-page .moneda-seleccionada { box-shadow: none !important; background: transparent !important; border: none !important; padding: 0 !important; font-size: 14px !important; height: 38px; display: flex; align-items: center; font-weight: 600; color: var(--vf-azul); }

/* ---- Pagos recurrentes y Tarjetas caducadas (pagos_recurrentes.php + pagos_recurrentes_vf.js, prefijo ptj-) (21/10/2026) ---- */
.ptj-page .ptj-especial { padding: 0; margin-bottom: 16px; }
.ptj-page .ptj-especial-in { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 16px; }
.ptj-page .ptj-especial-in .vf-search { flex: 1 1 320px; }
.ptj-page .ptj-especial-txt { border-bottom: 0; border-top: 1px solid var(--vf-borde); }
.ptj-page .ptj-especial-txt .fa { color: var(--vf-turquesa); margin-right: 4px; }
.ptj-page #div_resultados { align-items: center; }
.ptj-page #div_resultados .vf-banner-body a { font-weight: 600; text-decoration: underline; }
.ptj-page #div_resultados .crm-cerrar { margin-left: auto; }
.ptj-page .ptj-kpis .vf-kpi { cursor: pointer; }
.ptj-page a.vf-tab { display: inline-block; text-decoration: none; }
.ptj-page .vf-tab .fa { margin-right: 3px; }
.ptj-page #ptj_btn_filtros.activo { border-color: var(--vf-azul); color: var(--vf-azul); }
.ptj-page .ptj-nfiltros { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 9px; background: var(--vf-azul); color: #fff; font-size: 10.5px; }
.ptj-page #ptj_pasarela { height: 34px; }
.ptj-solo { margin-bottom: 4px; color: var(--vf-texto); }
.ptj-solo .fa { color: var(--vf-turquesa); margin-right: 3px; }
.ptj-solo a { font-weight: 600; text-decoration: underline; }
.ptj-filtros { padding: 14px 16px 12px; border-bottom: 1px solid var(--vf-borde); background: #fbfcfe; }
.ptj-filtros-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px 14px; }
.ptj-filtros .vf-field label { display: block; font-size: 11.5px; font-weight: 600; color: var(--vf-suave); margin-bottom: 4px; text-transform: uppercase; letter-spacing: .3px; }
.ptj-filtros .vf-field select { width: 100%; height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 4px 8px; font-size: 13px; background: #fff; color: var(--vf-texto); }
.ptj-filtros-pie { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
#ptj_lista.ptj-recargando { opacity: .55; pointer-events: none; }

/* Lista */
.ptj-list .vf-row { grid-template-columns: minmax(210px, 1.5fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(140px, .9fr) minmax(190px, 1.3fr) 140px; align-items: start; cursor: pointer; }
.ptj-list .vf-row.vf-row-head { cursor: default; }
.ptj-list .ptj-row { border-left: 3px solid transparent; }
.ptj-list .ptj-row.ptj-n-error { border-left-color: var(--vf-error); }
.ptj-list .ptj-row.ptj-n-aviso { border-left-color: #e0a800; }
.ptj-list .ptj-row.ptj-baja .ptj-concepto, .ptj-list .ptj-row.ptj-baja .ptj-imp { color: var(--vf-suave); }
.ptj-concepto { font-weight: 600; color: var(--vf-azul); font-size: 14px; line-height: 1.3; overflow-wrap: anywhere; }
.ptj-cli { margin-top: 3px; font-size: 13px; }
.ptj-cli a.dv-cli { font-weight: 500; }
.ptj-contacto span { overflow-wrap: anywhere; }
.ptj-contacto .fa { color: var(--vf-turquesa); }
.ptj-pie { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ptj-nota-ico { font-size: 11px; color: #8a5300; background: #fff4d6; border-radius: 10px; padding: 1px 7px; }
.ptj-imp { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; }
.ptj-imp .ptj-per { font-weight: 500; font-size: 12px; color: var(--vf-suave); }
.ptj-imp-sp { font-weight: 600; font-size: 13px; color: var(--vf-texto); }
.ptj-imp-sp .fa, .ptj-inicial .fa { color: var(--vf-turquesa); }
.ptj-ok { color: var(--vf-ok); }
.ptj-pend { color: #8a5300; font-weight: 600; }
.ptj-mal { color: var(--vf-error); font-weight: 600; }
.ptj-c-tar .vf-badge { white-space: normal; }
.ptj-cobros { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.ptj-r { font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ptj-r .fa { width: 13px; text-align: center; }
.ptj-r.ok { color: var(--vf-ok); } .ptj-r.error { color: var(--vf-error); } .ptj-r.info { color: var(--vf-info); } .ptj-r.aviso { color: var(--vf-aviso); }
.ptj-badges { display: flex; flex-wrap: wrap; gap: 4px; }
.ptj-que { margin-top: 6px; }
.ptj-c-acc { text-align: right; }
.ptj-c-acc .ptj-alta { display: block; margin-bottom: 6px; }
.ptj-btns { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; align-items: center; }
.ptj-btns .vf-btn-primary { white-space: nowrap; }
.ptj-list .cl-mas .vf-menu { min-width: 290px; text-align: left; max-height: 70vh; overflow-y: auto; }
.vf-btn.ptj-btn-peligro-borde { color: var(--vf-error); border-color: #f0b8b1; }
.vf-btn.ptj-btn-peligro-borde:hover { background: var(--vf-error-bg); }
@media (max-width: 991px) {
    .ptj-list .vf-row { grid-template-columns: 1fr 1fr; }
    .ptj-list .ptj-c-pago, .ptj-list .ptj-c-sit { grid-column: 1 / -1; }
    .ptj-list .ptj-c-acc { grid-column: 1 / -1; text-align: left; position: relative; }
    .ptj-list .ptj-c-acc .ptj-alta { display: none; }
    .ptj-btns { justify-content: flex-start; }
}
@media (max-width: 600px) {
    .ptj-list .vf-row { grid-template-columns: 1fr; }
    .ptj-r { white-space: normal; }
}

/* Ficha lateral */
.ptj-ficha .crm-ficha-tit h3 { font-size: 17px; overflow-wrap: anywhere; }
.ptj-f-avatar { background: var(--vf-ok); }
.ptj-f-avatar.ptj-av-aviso { background: #e0a800; } .ptj-f-avatar.ptj-av-error { background: var(--vf-error); } .ptj-f-avatar.ptj-av-gris { background: #9aa8ba; }
.ptj-f-badges { margin-bottom: 12px; }
.ptj-f-que ul { margin: 4px 0 0; padding-left: 18px; }
.ptj-f-que .fa-lightbulb-o { font-size: 20px; }
.ptj-f-txt { margin: 8px 0; font-size: 13px; }
.ptj-f-tarjeta { margin-bottom: 8px; }
.ptj-f-enl { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 4px; }
.ptj-f-cad { margin-top: 8px; }
.ptj-f-nota { background: #fffaf0; border: 1px solid #f3e2bd; border-radius: 8px; padding: 8px 10px; font-size: 13px; white-space: normal; }
.ptj-ficha .crm-datos { grid-template-columns: 110px minmax(0, 1fr); }
.ptj-tabla-cob { width: 100%; font-size: 13px; border-collapse: collapse; }
.ptj-tabla-cob td { padding: 5px 4px; border-bottom: 1px solid #eef1f5; }
.ptj-tabla-cob td.ptj-n { text-align: center; width: 50px; color: var(--vf-suave); }
.ptj-tabla-cob tr.ok td:first-child { color: var(--vf-ok); } .ptj-tabla-cob tr.error td:first-child { color: var(--vf-error); }
.ptj-tabla-cob tr.info td:first-child { color: var(--vf-info); } .ptj-tabla-cob tr.aviso td:first-child { color: var(--vf-aviso); } .ptj-tabla-cob tr.gris td { color: var(--vf-suave); }
.ptj-tabla-cob tr.ptj-total td { font-weight: 700; border-top: 2px solid var(--vf-borde); }
.ptj-f-grupo { margin-bottom: 10px; }
.ptj-f-grupo-tit { font-size: 11px; color: var(--vf-suave); font-weight: 600; margin-bottom: 4px; }
.ptj-f-acciones { display: flex; flex-wrap: wrap; gap: 6px; }
.ptj-f-acc { border: 1px solid var(--vf-borde); background: #fff; border-radius: 16px; padding: 4px 11px; font-size: 12.5px; color: var(--vf-texto); cursor: pointer; text-align: left; }
.ptj-f-acc:hover { border-color: var(--vf-turquesa); color: var(--vf-azul); background: #f5fafc; }
.ptj-f-acc .fa { color: var(--vf-turquesa); margin-right: 3px; }
.ptj-f-acc.peligro, .ptj-f-acc.peligro .fa { color: var(--vf-error); }
.ptj-f-pie { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 600px) { .ptj-ficha .crm-datos { grid-template-columns: 1fr; } .ptj-ficha .crm-datos dt { margin-top: 4px; } }

/* Ventanas propias: «Modificar» (usa las clases rn-modal-mod de Domiciliaciones) y «Generar cobro» */
.ptj-modal-cargo .ptj-cargo-pas { margin-top: 8px; font-size: 12.5px; color: var(--vf-suave); }
.ptj-modal-cargo .form-control, .ptj-modal-mod .form-control { border: 1px solid #cfd8e3; border-radius: 4px; box-shadow: none; height: 38px; }
.ptj-modal-cargo .modal-footer, .ptj-modal-mod .modal-footer { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; align-items: center; }
.ptj-modal-cargo .modal-footer .vf-btn, .ptj-modal-mod .modal-footer .vf-btn { margin: 0; }
.ptj-modal-mod .modal-header .modal-title, .ptj-modal-cargo .modal-header .modal-title { text-transform: none; text-align: left; }
.ptj-body #modal_notas .note-editor { border: 1px solid #cfd8e3; border-radius: 6px; }
@media (max-width: 600px) {
    .ptj-modal-cargo .form-control, .ptj-modal-mod .form-control { height: 42px; font-size: 16px; }
    .ptj-modal-cargo .modal-footer .vf-btn, .ptj-modal-mod .modal-footer .vf-btn { flex: 1 1 100%; }
}
@media (max-width: 600px) { .ptj-page .vf-tabs { overflow-x: auto; white-space: nowrap; flex-wrap: nowrap; } .ptj-page .vf-tabs .vf-tab { flex: 0 0 auto; } }
/* Pagos modificados en esta sesión (PT_MOD, como en Domiciliaciones) */
.ptj-list .ptj-row.ptj-modificado { box-shadow: inset 4px 0 0 #2f6fd6; background: #f3f8ff; }
.ptj-mod-marca { display: inline-block; font-size: 11.5px; font-weight: 600; color: #1d4f9c; background: #e3eefc; border-radius: 10px; padding: 1px 8px; margin-bottom: 3px; }
.ptj-ficha .ptj-mod-marca { margin-bottom: 8px; }

/* ---- Tarjetas: Enlaces tarjetas (envio_enlace_pago_recurrente.php, prefijo etj-; usa también las clases ee- de Generar enlaces) ---- */
.etj-moneda { display: flex; align-items: center; min-height: 38px; padding: 0 12px; border: 1px solid var(--vf-borde); border-radius: 4px; background: var(--vf-fondo); font-weight: 600; color: var(--vf-texto); }
.etj-grid4 { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 12px; align-items: end; }
.etj-grid4 .vf-btn { width: 100%; justify-content: center; }
.etj-rangos { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.etj-rango { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 7px 10px; border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; font-size: 13px; color: var(--vf-texto); }
.etj-rango > .fa { color: var(--vf-turquesa); }
.etj-rango .vf-btn-link { margin-left: auto; }
.etj-page .vf-banner { margin-top: 10px; }
.etj-page #div_row_tiempo_total.etj-bloq .cu-sw { opacity: .55; cursor: not-allowed; }
.etj-page #row_div_pedir_datos_minimos .vf-card-body { padding-top: 4px; }
.vf-list.sin-check.etj-altas .vf-row { grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr) minmax(0, 1.4fr) !important; align-items: start; }
.etj-altas .tj-enlace { margin-top: 6px; }
@media (max-width: 991px) { .etj-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .etj-grid4 { grid-template-columns: 1fr; } }
/* ---- Tarjetas: página pública del enlace de tarjeta (ext_alta_cliente_tarjeta.php, prefijo eat-; usa las clases ea- de ext_alta_cliente.php) ---- */
.eat-body #contenido_interno { font-size: 14px; line-height: 1.55; color: #2c3e50; max-height: 65vh; overflow-y: auto; }
.eat-body .ea-periodo .fa-credit-card { margin-left: 2px; }
.etj-aviso-solo { margin-top: 6px; }

/* ---- Cobros con tarjeta y Transacciones pendientes (21/10/2026): transacciones_tarjetas_vf.js, prefijo trx- ---- */
.trx-page .vf-row.trx-row { grid-template-columns: minmax(190px, 1.25fr) minmax(170px, 1.2fr) 130px minmax(200px, 1.4fr) 200px; cursor: pointer; }
.trx-page .vf-row.trx-row.vf-row-head { cursor: default; }
.trx-page .vf-row.trx-row:focus { outline: 2px solid rgba(27,121,155,.35); outline-offset: -2px; }
.trx-fecha { font-weight: 700; color: var(--vf-azul); font-size: 13.5px; font-variant-numeric: tabular-nums; }
.trx-concepto { font-size: 12.5px; color: var(--vf-texto); margin-top: 2px; overflow-wrap: anywhere; }
.trx-origen { font-size: 12px; color: var(--vf-texto); margin-top: 3px; }
.trx-origen .fa { color: var(--vf-suave); width: 13px; }
.trx-ids { margin-top: 4px; display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.trx-cli { font-weight: 600; }
.trx-contacto { overflow-wrap: anywhere; }
.trx-contacto .fa { width: 12px; }
.trx-nota { display: block; }
.trx-imp-error { color: var(--vf-error); }
.trx-imp-gris { color: var(--vf-suave); text-decoration: line-through; text-decoration-color: rgba(107,122,140,.5); }
.trx-imp-ok { color: var(--vf-ok); }
.trx-imp-aviso { color: var(--vf-texto); }
.trx-dev { color: var(--vf-error); font-weight: 600; }
.trx-tarjeta { margin-top: 6px; }
.trx-tarjeta .vf-badge { font-weight: 500; white-space: normal; text-align: left; }
.trx-intentos { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; padding: 0; font-size: 12px; color: var(--vf-error); background: none; border: 0; }
.trx-intentos:hover { text-decoration: underline; }
.trx-noreint { color: #8a5300; }
.trx-row .vf-msg { color: var(--vf-suave); }
.trx-row.trx-ca .trx-cli, .trx-row.trx-ca .trx-concepto { color: var(--vf-suave); }
.trx-acc { gap: 6px; flex-wrap: wrap; }
.trx-kpis .vf-kpi { cursor: pointer; }
.trx-kpis .vf-kpi.trx-k-de { border-top-color: #8e44ad; }
.trx-kpis .vf-kpi.trx-k-de .vf-kpi-num { color: #8e44ad; }
.trx-busqueda-campo { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; align-items: center; }
.trx-busqueda-campo .vf-search { flex: 1 1 260px; max-width: 460px; }
.trx-fechas input { height: 34px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 0 8px; font-size: 13px; }
/* Ficha lateral */
.trx-f-avatar { background: var(--vf-turquesa); }
.trx-av-ok { background: var(--vf-ok); }
.trx-av-aviso { background: var(--vf-aviso); }
.trx-av-error { background: var(--vf-error); }
.trx-av-gris { background: #8a97a8; }
.trx-av-info { background: var(--vf-turquesa); }
.trx-f-estado { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.trx-f-estado .vf-sub { flex: 1 1 200px; }
.trx-f-que { margin-bottom: 12px; }
.trx-f-que ul { margin: 4px 0 0; padding-left: 18px; }
.trx-f-enlace { margin-bottom: 4px; }
.trx-f-links { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; font-size: 12.5px; }
.trx-codpas { font-family: Consolas, monospace; font-size: 12px; overflow-wrap: anywhere; }
.trx-f-nota { white-space: normal; }
.trx-f-acciones { display: flex; flex-direction: column; gap: 2px; }
.trx-ficha .rn-f-acc, .trx-ficha .trx-f-acc { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: 0; background: none; padding: 7px 8px; border-radius: 6px; font-size: 13px; color: var(--vf-texto); cursor: pointer; }
.trx-ficha .trx-f-acc:hover { background: var(--vf-fondo); color: var(--vf-azul); }
.trx-ficha .trx-f-acc .fa { width: 16px; text-align: center; color: var(--vf-turquesa); }
.trx-ficha .trx-f-acc.peligro, .trx-ficha .trx-f-acc.peligro .fa { color: var(--vf-error); }
.trx-ficha .vf-btn.trx-peligro, .trx-page .vf-btn.re-peligro { color: var(--vf-error); border-color: #f0c4be; }
.trx-ficha .vf-btn.trx-peligro:hover, .trx-page .vf-btn.re-peligro:hover { background: var(--vf-error-bg); }
/* Ventanas */
.trx-modal .trx-imp { display: flex; align-items: center; gap: 6px; }
.trx-modal .trx-imp input { flex: 1; height: 38px; border: 1px solid #cfd8e3; border-radius: 4px; padding: 0 10px; font-size: 15px; text-align: right; }
.trx-modal .trx-imp span { font-weight: 600; color: var(--vf-suave); }
.trx-modal textarea { width: 100%; border: 1px solid #cfd8e3; border-radius: 4px; padding: 8px 10px; font-size: 13.5px; font-family: inherit; resize: vertical; }
.trx-chk { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 4px; font-size: 13px; font-weight: 400; color: var(--vf-texto); cursor: pointer; }
.trx-modal input[type=checkbox] { opacity: 1 !important; float: none !important; position: static !important; width: 15px; height: 15px; margin: 2px 0 0; flex: none; }
.trx-retro-parcial { margin: 2px 0 6px 23px; }
.trx-aviso { margin-top: 12px; }
.trx-linea { margin: 0; }
@media (max-width: 991px) {
    .trx-page .vf-row.trx-row { grid-template-columns: 1fr 1fr; }
    .trx-page .vf-row.trx-row .vf-cell-estado, .trx-page .vf-row.trx-row .vf-cell-acciones { grid-column: 1 / -1; }
    .trx-acc { position: relative; }
}
@media (max-width: 600px) {
    .trx-page .vf-row.trx-row { grid-template-columns: 1fr; }
    .trx-page .vf-toolbar .vf-select, .trx-page .trx-fechas { width: 100%; }
    .trx-page .trx-fechas { display: flex; gap: 6px; }
    .trx-page .trx-fechas.cl-oculto { display: none; }
    .trx-page .trx-fechas input { flex: 1; min-width: 0; }
    .trx-acc .vf-btn { flex: 1 1 auto; justify-content: center; }
    .trx-busqueda-campo .vf-btn { flex: 1; justify-content: center; }
}

/* ---- Tarjetas: informe de tarjetas (informes_excel_tarjetas.php, prefijo itj-) ---- */
.itj-lista { list-style: none; margin: 0; padding: 0; }
.itj-lista li { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--vf-borde); font-size: 13px; line-height: 1.45; color: var(--vf-texto); }
.itj-lista li:last-child { border-bottom: 0; }
.itj-lista li > .fa { color: var(--vf-turquesa); margin-top: 3px; width: 16px; text-align: center; flex: none; }
.itj-otro { margin: 12px 0 0; font-size: 12.5px; }
.itj-otro .fa { color: #b26a00; }
.itj-que .vf-card-body { padding: 10px 18px 16px; }

/* ---- Tarjetas: modificaciones masivas de pagos recurrentes (pagos_mod_masiva.php, prefijo pmm-; usa el CSS .mm-page de rentas_mod_masiva) ---- */
.pmm-page .pmm-tags { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 4px; }
.pmm-page .pmm-tags .vf-tag { margin: 0; }
.pmm-page .pmm-tag-cad { background: var(--vf-error-bg); color: var(--vf-error); }
.pmm-page .pmm-tag-fuera { background: var(--vf-aviso-bg); color: #7a4a00; }
.pmm-body .mm-modal .pmm-resumen { margin: 0 0 12px; }
.pmm-body .mm-modal .vf-banner { margin-bottom: 12px; }

/* ---- Tarjetas: cancelación masiva de pagos recurrentes (cancelacion_masiva_pagos_recurrentes.php, prefijo cmp-; usa .re-page / .cm-page) ---- */
.cmp-page .cmp-tags { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.cmp-page .cmp-tags .vf-badge { margin: 0; }
.cmp-page .vf-msg { margin-top: 5px; font-size: 12px; }
.cmp-page .vf-msg.cmp-pend { color: #8a5a00; }
.cmp-page .vf-selbar .vf-btn[disabled], .cmp-modal .vf-btn[disabled] { opacity: .6; cursor: wait; }
.cmp-modal .vf-btn-primary.cmp-peligro { background: var(--vf-error); border-color: var(--vf-error); }
.cmp-modal .vf-btn-primary.cmp-peligro:hover { background: #a93226; border-color: #a93226; }
.cmp-modal .vf-banner { margin: 12px 0 0; }
.cmp-modal .cm-lista-res { margin-top: 12px; }
@media (max-width: 600px) { .cmp-page .vf-selbar .vf-sel-actions { flex-direction: column; width: 100%; } .cmp-page .vf-selbar .vf-sel-actions .vf-btn { width: 100%; } }


/* ---- Menú Tarjetas (21/10/2026, 2): colores por grupo en los menús «Más» y «Qué puedes hacer» (como Domiciliaciones) ---- */
/* ---- Menú Tarjetas: grupos de acciones con color (21/10/2026, como Domiciliaciones) ----
   Los títulos usan .rn-g-tit[data-g] y las opciones con data-dv las reglas [data-dv][data-g] de Domiciliaciones.
   Aquí solo lo que no lleva data-dv (enlaces <a> de los menús y del panel del día, acciones de la ficha de
   Transacciones con data-tr): clase .tj-gc. Grupos: cobros (verde), mandato = tarjeta (ámbar), dom = pago/cargo (azul), ver (morado). */
.tj-gc[data-g="cobros"]  > .fa { color: #1e8a52; }
.tj-gc[data-g="mandato"] > .fa { color: #c27c0e; }
.tj-gc[data-g="dom"]     > .fa { color: #2563c9; }
.tj-gc[data-g="ver"]     > .fa { color: #6b46c1; }
.tj-gc.peligro > .fa { color: #c0392b; }
.tj-gc[data-g="cobros"]:hover  { background: #eaf7f0; }
.tj-gc[data-g="mandato"]:hover { background: #fdf4e6; }
.tj-gc[data-g="dom"]:hover     { background: #edf3fd; }
.tj-gc[data-g="ver"]:hover     { background: #f3effc; }
.tj-gc.peligro:hover { background: #fdeeee; }
/* Ficha de Transacciones: un bloque por grupo */
.trx-ficha .trx-f-grupo { margin-bottom: 8px; }
.trx-ficha .trx-f-grupo:last-child { margin-bottom: 0; }
.trx-ficha .trx-f-grupo .rn-f-grupo-tit { margin: 0 0 2px 8px; }
/* Ficha de Pagos recurrentes: títulos de grupo con su color (la clase ptj-f-grupo-tit ponía gris) */
.ptj-f-grupo-tit.rn-g-tit[data-g] { font-weight: 600; }
.ptj-f-grupo-tit.rn-g-tit[data-g="cobros"]  { color: #1e8a52; }
.ptj-f-grupo-tit.rn-g-tit[data-g="mandato"] { color: #b56a00; }
.ptj-f-grupo-tit.rn-g-tit[data-g="dom"]     { color: #2563c9; }
.ptj-f-grupo-tit.rn-g-tit[data-g="ver"]     { color: #6b46c1; }
.trx-ficha .rn-f-grupo-tit.rn-g-tit[data-g="cobros"]  { color: #1e8a52; }
.trx-ficha .rn-f-grupo-tit.rn-g-tit[data-g="mandato"] { color: #b56a00; }
.trx-ficha .rn-f-grupo-tit.rn-g-tit[data-g="dom"]     { color: #2563c9; }
.trx-ficha .rn-f-grupo-tit.rn-g-tit[data-g="ver"]     { color: #6b46c1; }


/* ---- Menú Tarjetas (21/10/2026, 3): tarjeta en el panel del día del calendario y enlaces pendientes en Pagos recurrentes ---- */
/* ---- Calendario de tarjetas, panel del día: tarjeta y pasarela de cada fila (21/10/2026, 2) ---- */
.ctj-item-tarj { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 5px; }
.ctj-item-tarj .vf-badge { font-size: 11px; }
.ctj-tarj-aviso { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600; line-height: 1.3; }
.ctj-tarj-aviso.error { color: #c0392b; }
.ctj-tarj-aviso.aviso { color: #b26a00; }

/* ---- Pagos recurrentes: enlaces pendientes (21/10/2026 (2)) ---- */
.ptj-enl-pend { width: auto; min-width: 0; max-width: 100%; height: auto; line-height: 1.3; justify-content: flex-start; text-align: left; box-shadow: none; display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; border: 1px solid #f3dcb0; background: var(--vf-aviso-bg, #fff4e0); color: #8a5300; border-radius: 12px; padding: 2px 9px; font-size: 11.5px; font-weight: 600; cursor: pointer; white-space: nowrap; text-transform: none; letter-spacing: 0; }
.ptj-enl-pend .fa { width: auto !important; margin: 0 !important; font-size: 11px; }
.ptj-enl-pend:hover { border-color: #e0a800; background: #ffecc7; }
.ptj-f-enlaces { transition: background-color .4s, box-shadow .4s; border-radius: 8px; }
.ptj-f-enlaces.ptj-resalta { background: #fff8e8; box-shadow: 0 0 0 3px #f3dcb0; }
.ptj-f-enlaces .crm-bloque-tit .vf-btn-link { float: right; text-transform: none; letter-spacing: 0; }
.ptj-enl-item { border: 1px solid var(--vf-borde); border-radius: 8px; padding: 8px 10px; margin-top: 8px; background: #fff; }
.ptj-enl-cab { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; font-size: 13px; }
.ptj-enl-cab b { overflow-wrap: anywhere; }
.ptj-enl-imp { margin-left: auto; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ptj-f-sin-enl { margin: 4px 0; }
@media (max-width: 600px) { .ptj-enl-imp { margin-left: 0; } .ptj-enl-pend { white-space: normal; } }

/* =============================================================================
   FACTURAS: VENTANA DE COBROS / PAGOS 21/10/2026 (modales_facturas/fm_modal_cobros.php + fm_cobros_vf.js)
   Todo limitado a .fmc-modal
   ============================================================================= */
.fmc-modal .fm-resumen { margin-bottom: 12px; }
.fmc-modal #fmc_estado:empty { display: none; }
.fmc-modal #fmc_estado { margin: 0 0 18px; }
.fmc-modal .fmc-barra-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 13.5px; color: var(--vf-texto); margin-bottom: 6px; }
.fmc-modal .fmc-falta { color: #b26a00; font-weight: 600; }
.fmc-modal .fmc-demas { color: var(--vf-error); font-weight: 600; }
.fmc-modal .fmc-ok { color: var(--vf-ok); font-weight: 600; }
.fmc-modal .fmc-barra { height: 8px; border-radius: 4px; background: #eef1f5; overflow: hidden; }
.fmc-modal .fmc-barra span { display: block; height: 100%; border-radius: 4px; background: var(--vf-turquesa); transition: width .3s; }
.fmc-modal .fmc-barra span.ok { background: var(--vf-ok); }
.fmc-modal .fmc-barra span.error { background: var(--vf-error); }
.fmc-modal .fmc-barra span.gris { background: #cfd8e3; }
.fmc-modal .fmc-banner { margin: 12px 0 0; }
.fmc-modal .fmc-banner a, .fmc-modal .fmc-ayuda a { color: var(--vf-turquesa); font-weight: 600; white-space: nowrap; }
/* Formulario: si la factura ya está cobrada, se pliega */
.fmc-modal #fmc_seccion_alta.fmc-plegada { display: none; }
.fmc-modal .fmc-importe { position: relative; }
.fmc-modal .fmc-importe input { padding-right: 28px; -moz-appearance: textfield; }
.fmc-modal .fmc-importe input::-webkit-outer-spin-button, .fmc-modal .fmc-importe input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.fmc-modal .fmc-eur { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: var(--vf-suave); pointer-events: none; }
.fmc-modal .fmc-ayuda { min-height: 18px; font-size: 12.5px; line-height: 1.4; margin-top: 4px; }
.fmc-modal .fmc-ayuda:empty { min-height: 0; margin: 0; }
.fmc-modal .fmc-av { color: #b26a00; }
.fmc-modal .fmc-bien { color: var(--vf-ok); }
.fmc-modal .fmc-mal { color: var(--vf-error); }
/* Lista propia (las tablas antiguas quedan ocultas debajo) */
.fmc-modal .fmc-antigua.fmc-oculta { display: none !important; }
.fmc-modal .fmc-hecho { margin: 0 0 10px; }
.fmc-modal .fmc-vacio { padding: 18px; text-align: center; color: var(--vf-suave); border: 1px dashed var(--vf-borde); border-radius: 6px; }
.fmc-modal .fmc-vacio .fa { margin-right: 6px; }
.fmc-modal .fmc-lista { border: 1px solid var(--vf-borde); border-radius: 6px; overflow: hidden; }
.fmc-modal .fmc-fila { display: grid; grid-template-columns: 110px 120px minmax(0, 1fr) 150px; gap: 12px; align-items: center; padding: 10px 14px; border-top: 1px solid var(--vf-borde); font-size: 13.5px; }
.fmc-modal .fmc-fila:first-child { border-top: 0; }
.fmc-modal .fmc-fila .vf-label { display: none; }
.fmc-modal .fmc-i { text-align: right; font-weight: 600; white-space: nowrap; }
.fmc-modal .fmc-mp { overflow-wrap: anywhere; }
.fmc-modal .fmc-mp .vf-sub { font-size: 12px; }
.fmc-modal .fmc-acc { text-align: right; }
.fmc-modal .fmc-borrar { color: var(--vf-error) !important; }
.fmc-modal .fmc-total { background: var(--vf-fondo); font-weight: 700; }
@media (max-width: 600px) {
    .fmc-modal .fmc-fila { grid-template-columns: 1fr auto; gap: 4px 10px; }
    .fmc-modal .fmc-fila .fmc-f { grid-column: 1; }
    .fmc-modal .fmc-fila .fmc-i { grid-column: 2; grid-row: 1; }
    .fmc-modal .fmc-fila .fmc-mp { grid-column: 1 / -1; }
    .fmc-modal .fmc-fila .fmc-acc { grid-column: 1 / -1; text-align: left; }
    .fmc-modal .fmc-total .fmc-mp, .fmc-modal .fmc-total .fmc-acc { display: none; }
}

/* ---- Menú Tarjetas (21/10/2026, 4): Pagos recurrentes (versiones, enlaces pendientes, descripción interna), Modif. masivas (no periódicos), páginas de pago de las pasarelas (ptp-) ---- */
/* ---- Pagos recurrentes: «Últimos cambios del pago recurrente» como lista de versiones (21/10/2026 (3)); clases vm- de Domiciliaciones ---- */
.ptj-vm-mod .div-tabla-modal-mod-pagos, .ptj-vm-mod .div-tabla-responsive-modal-mod-pagos { display: none !important; }
.ptj-vm-mod .ptj-vm-intro { margin: 0 0 4px; }
.ptj-vm-mod .modal-body { max-height: 70vh; overflow-y: auto; }
@media (max-width: 600px) { .ptj-vm-mod .vm-ver-dato { white-space: normal; overflow-wrap: anywhere; } }
/* ---- Pagos recurrentes: eliminar un enlace pendiente (papelera) y aviso de enlaces antiguos (21/10/2026 (3)) ---- */
.vf-btn.ptj-enl-borrar { color: var(--vf-error); border-color: #f0b8b1; padding-left: 9px; padding-right: 9px; flex: 0 0 auto; }
.vf-btn.ptj-enl-borrar:hover { background: var(--vf-error-bg); border-color: var(--vf-error); }
.vf-btn.ptj-enl-borrar[disabled] { opacity: .6; cursor: default; }
.ptj-enl-cab .ptj-enl-borrar { margin-left: 4px; }
.ptj-enl-item.ptj-enl-viejo { border-color: #f3dcb0; }
.ptj-enl-viejos { margin: 4px 0 8px; }
@media (max-width: 600px) {
    .ptj-enl-item .tj-enlace-fila { flex-wrap: wrap; }
    .ptj-enl-item .tj-enlace-fila input { flex: 1 1 100%; }
    .ptj-enl-item .tj-enlace-fila .vf-btn { width: auto; flex: 1 1 auto; }
    .ptj-enl-item .tj-enlace-fila .vf-btn.ptj-enl-borrar { flex: 0 0 44px; }
}
/* ---- Pagos recurrentes: descripción interna (solo la ve el comercio) (21/10/2026 (3)) ---- */
.ptj-desc { margin-top: 3px; font-size: 12px; color: #5d6b7c; font-style: italic; overflow-wrap: anywhere; }
.ptj-desc .fa { color: #9aa8ba; font-style: normal; margin-right: 2px; }
.ptj-desc.ptj-desc-ficha { margin: -4px 0 12px; font-size: 13px; background: #f4f6f9; border: 1px dashed #cfd8e3; border-radius: 8px; padding: 6px 10px; }
.ptj-desc-solo { font-style: normal; font-size: 11px; font-weight: 600; color: var(--vf-suave); background: #e9edf2; border-radius: 10px; padding: 1px 7px; margin-left: 4px; white-space: nowrap; }
.ptj-modal-mod .ptj-mod-desc { margin-top: 12px; }
.ptj-modal-mod .ptj-mod-desc label .fa { color: #9aa8ba; }
.ptj-modal-mod .ptj-mod-desc-aviso { margin-top: 10px; color: #8a5300; } .ptj-modal-mod .ptj-mod-desc-aviso .fa { color: #b26a00; }

/* Añadir al final de la sección «Tarjetas: modificaciones masivas de pagos recurrentes (prefijo pmm-)» de tadosi-ui.css (22/10/2026) */
.pmm-page .pmm-fijo { display: block; color: var(--vf-suave); font-size: 12.5px; line-height: 32px; padding: 0 2px; white-space: nowrap; cursor: help; }
.pmm-page .mm-c-importe .pmm-fijo { text-align: right; }
@media (max-width: 600px) { .pmm-page .pmm-fijo { line-height: 1.4; } .pmm-page .mm-c-importe .pmm-fijo { text-align: left; } }


/* =============================================================================
   PÁGINAS PÚBLICAS DE PAGO CON TARJETA (21/10/2026) — prefijo ptp-
   stripe/stripe_pay.php, paynopain/paynopain_pay_1.php + paynopain_pay.php,
   monei/monei_pay_1.php + monei_pay.php, multisafepay/multisafepay_pay1.php.
   Reutilizan las clases sp- de Clientes/stripe_pay.php (G5); aquí solo lo propio.
   ============================================================================= */
.ptp-body .sp-wrap.ptp-wrap { max-width: 560px; }
.ptp-res { text-align: center; padding: 28px 24px 22px; }
.ptp-ico { width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 12px; display: flex; align-items: center; justify-content: center; font-size: 30px; }
.ptp-ico-ok { background: #e6f6ec; color: #1e8a4c; }
.ptp-ico-error { background: #fdecea; color: #c0392b; }
.ptp-tit { font-size: 21px; font-weight: 600; margin: 0 0 8px; color: #2c3e50; }
.ptp-txt { font-size: 14px; color: #4a5a6c; margin: 0 0 14px; line-height: 1.5; }
.ptp-res .sp-error-motivo { margin: 0 0 16px; text-align: left; }
.ptp-res .ptp-datos { text-align: left; margin: 4px 0 18px; }
.ptp-id { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; word-break: break-all; }
.ptp-res .sp-boton { margin-top: 4px; }
.ptp-pie-txt { font-size: 12.5px; color: #8a99ab; margin: 12px 0 0; }
.ptp-body .sp-form { margin: 0; }
.ptp-body .sp-aviso-contrato { margin-bottom: 14px; }
.ptp-aviso-verif { margin-bottom: 14px; }
.ptp-ms-txt { font-size: 13.5px; color: #4a5a6c; margin: 4px 0 12px; }
.ptp-ms-form .text-center + .text-center { margin-top: 10px; }
@media (max-width: 767px) {
	.ptp-res { padding: 22px 16px 18px; }
	.ptp-tit { font-size: 19px; }
}

/* ---- Facturas (21/10/2026): colores por grupo en los menús de acciones (fg-gi) ---- */
/* ---- Menús de Facturas (emitidas, light/proformas, recibidas): grupos de acciones con color (21/10/2026, como Domiciliaciones y Tarjetas) ----
   Títulos: .rn-g-tit[data-g] (ya definido). Opciones: clase .fg-gi + data-g. Grupos: cobros = Cobrar/Pago (verde),
   dom = Factura y documentos (azul), mandato = Estado del cobro/pago (ámbar), ver = otra pestaña (morado); peligro sigue en rojo. */
.vf-menu > .fg-gi[data-g="cobros"]  > .fa { color: #1e8a52; }
.vf-menu > .fg-gi[data-g="mandato"] > .fa { color: #c27c0e; }
.vf-menu > .fg-gi[data-g="dom"]     > .fa { color: #2563c9; }
.vf-menu > .fg-gi[data-g="ver"]     > .fa { color: #6b46c1; }
.vf-menu > .fg-gi[data-g="cobros"]:hover  { background: #eaf7f0; }
.vf-menu > .fg-gi[data-g="mandato"]:hover { background: #fdf4e6; }
.vf-menu > .fg-gi[data-g="dom"]:hover     { background: #edf3fd; }
.vf-menu > .fg-gi[data-g="ver"]:hover     { background: #f3effc; }
.vf-menu > .peligro:hover { background: #fdeeee; }
.vf-menu > .rn-g-tit[data-g] { padding-top: 6px; }


/* ---- Menú Tarjetas (21/10/2026, 5): Pagos recurrentes, comprobación de «Modificar» ---- */
/* ---- Pagos recurrentes, «Modificar»: campo con error al guardar y enlace a la periodicidad (22/10/2026) ---- */
.ptj-modal-mod .ptj-campo-mal { border-color: var(--vf-error) !important; box-shadow: 0 0 0 3px rgba(192,57,43,.15) !important; }
.ptj-modal-mod .ptj-ir-per { font-weight: 600; text-decoration: underline; color: var(--vf-azul); }


/* ---- 21/10/2026 (6): botón «Modificar» siempre visible en Domiciliaciones y Pagos recurrentes (vfe-) ---- */
/* ---- Domiciliaciones y Pagos recurrentes: «Modificar» siempre a la vista junto a «···» (22/10/2026) ----
   Botón vf-btn vf-btn-sm con data-dv="modificar" data-g="dom" (icono azul del grupo, reglas [data-dv][data-g] de Domiciliaciones).
   .vfe-sec: el par [✎ Modificar] [···] va en su propia línea, debajo del botón principal. */
.rn-btns .vfe-sec, .ptj-btns .vfe-sec { flex: 1 0 100%; display: flex; gap: 6px; justify-content: flex-end; align-items: center; }
.vf-btn.vfe-mod { white-space: nowrap; }
.vf-btn.vfe-mod:hover { border-color: #2563c9; color: #2563c9; }
@media (max-width: 991px) {
    .rn-btns .vfe-sec, .ptj-btns .vfe-sec { flex: 0 1 auto; justify-content: flex-start; }
}


/* CRM riesgo 21/10/2026: email del cliente en la lista (crm_riesgo_vf.js) */
.rg-email { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }


/* =============================================================================
   FICHEROS XML Y FICHEROS DE TARJETAS (22/10/2026)
   importar_sepa_xml.php (sxi-), ficheros_sepa_env.php (sxe-), ficheros_sepa_dev.php (sxd-),
   movimientos_ficheros_sepa.php (sxm-), importar_excel_tarjetas.php (ixt-) y comunes (fx-)
   ============================================================================= */
/* ---- Comunes (FX, ficheros_comun_vf.js): vista previa de lo que se va a subir ---- */
.fx-previa { border: 1px solid var(--vf-borde); border-radius: 6px; background: #fff; }
.fx-previa-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding: 14px 16px 10px; border-bottom: 1px solid var(--vf-borde); flex-wrap: wrap; }
.fx-previa-cab h3 { margin: 2px 0 0; font-size: 16px; font-weight: 600; color: var(--vf-azul); overflow-wrap: anywhere; }
.fx-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-turquesa); font-weight: 600; }
.fx-previa > .vf-banner { margin: 12px 16px 0; }
.fx-resumen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 2fr); gap: 10px; padding: 12px 16px 0; }
.fx-dato { background: var(--vf-fondo); border-radius: 6px; padding: 9px 12px; border-top: 3px solid var(--vf-borde); min-width: 0; }
.fx-dato span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); }
.fx-dato b { display: block; font-size: 18px; color: var(--vf-azul); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fx-dato small { display: block; font-size: 11.5px; color: var(--vf-suave); overflow-wrap: anywhere; }
.fx-dato.bien { border-top-color: var(--vf-ok); } .fx-dato.bien b { color: var(--vf-ok); }
.fx-dato.mal { border-top-color: var(--vf-error); } .fx-dato.mal b { color: var(--vf-error); }
.fx-dato.ojo { border-top-color: #e0a800; } .fx-dato.ojo b { color: var(--vf-aviso); }
.fx-dato-ancho b { font-size: 14px; }
.fx-filtros { padding: 12px 16px 8px; }
.fx-tabla { border-top: 1px solid var(--vf-borde); }
.fx-fila { display: grid; grid-template-columns: 54px minmax(150px, 1.2fr) 100px 110px minmax(150px, 1.2fr) minmax(200px, 1.6fr); gap: 10px; padding: 9px 16px; border-bottom: 1px solid var(--vf-borde); font-size: 12.5px; align-items: start; }
.fx-fila > div { min-width: 0; overflow-wrap: anywhere; }
.fx-fila .vf-label { display: none; }
.fx-fila-cab { background: var(--vf-fondo); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; }
.fx-fila.fx-con-error { background: #fffafa; box-shadow: inset 3px 0 0 var(--vf-error); }
.fx-fila.fx-con-aviso { box-shadow: inset 3px 0 0 #e0a800; }
.fx-num { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.fx-mono { font-family: Consolas, "Courier New", monospace; font-size: 12px; letter-spacing: .2px; }
.fx-msg { line-height: 1.4; margin-bottom: 3px; }
.fx-msg .fa { margin-right: 3px; }
.fx-msg-err { color: #8a271d; } .fx-msg-err .fa { color: var(--vf-error); }
.fx-msg-av { color: #6d4300; } .fx-msg-av .fa { color: #e0a800; }
.fx-ok { color: var(--vf-ok); font-weight: 600; }
.fx-mal { color: var(--vf-error); font-weight: 600; }
.fx-vacio { padding: 26px 16px; }
.fx-previa-pie { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--vf-borde); flex-wrap: wrap; background: var(--vf-fondo); border-radius: 0 0 6px 6px; }
.fx-pie-der { display: flex; gap: 8px; flex-wrap: wrap; }
.fx-cab { margin: 6px 0 8px; padding-left: 18px; }
.fx-err-serv { margin: 6px 0 0; padding-left: 18px; max-height: 260px; overflow-y: auto; }
.fx-err-servidor { margin: 0 0 12px; }
.vf-btn.fx-bajando { opacity: .6; }
@media (max-width: 991px) {
    .fx-resumen { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fx-dato-ancho { grid-column: 1 / -1; }
    .fx-fila { grid-template-columns: 1fr 1fr; gap: 6px 12px; padding: 12px 16px; }
    .fx-fila-cab { display: none; }
    .fx-fila .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; color: var(--vf-suave); letter-spacing: .4px; margin-bottom: 1px; }
    .fx-fila .fx-rev { grid-column: 1 / -1; }
    .fx-num { text-align: left; }
}
@media (max-width: 600px) {
    .fx-previa-cab, .fx-filtros, .fx-previa-pie { padding-left: 12px; padding-right: 12px; }
    .fx-resumen { padding: 10px 12px 0; gap: 8px; }
    .fx-previa > .vf-banner { margin: 10px 12px 0; }
    .fx-fila { padding: 10px 12px; }
    .fx-previa-pie, .fx-pie-der { flex-direction: column; align-items: stretch; }
    .fx-previa-pie .vf-btn { justify-content: center; }
}

/* Alertas de cada fila y cifras del cliente (22/10/2026) */
.fx-alerta { display: flex; gap: 9px; align-items: flex-start; border: 1px solid; border-radius: 6px; padding: 9px 11px; font-size: 12.5px; line-height: 1.45; }
.fx-alerta + .fx-alerta, .vf-hint + .fx-alerta, .vf-badge + .fx-alerta, .vf-msg + .fx-alerta { margin-top: 6px; }
.fx-alerta > .fa { font-size: 16px; margin-top: 1px; flex: none; }
.fx-alerta-txt { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.fx-alerta-tit { font-weight: 700; margin-bottom: 2px; }
.fx-alerta-msg + .fx-alerta-msg, .fx-alerta-q + .fx-alerta-msg { margin-top: 6px; padding-top: 6px; border-top: 1px dashed currentColor; }
.fx-alerta-q { margin-top: 3px; font-size: 12px; opacity: .85; }
.fx-alerta.error { background: var(--vf-error-bg); border-color: #f5c6c0; color: #8a271d; }
.fx-alerta.error > .fa { color: var(--vf-error); }
.fx-alerta.aviso { background: var(--vf-aviso-bg); border-color: #f3dcb0; color: #7a4a00; }
.fx-alerta.aviso > .fa { color: var(--vf-aviso); }
.sxi-cli-stats, .ixt-cli-stats { margin-top: 5px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: 11.5px; line-height: 1.3; }
.fx-st-lab { color: var(--vf-suave); margin-right: 1px; }
.fx-st { display: inline-flex; align-items: center; gap: 3px; padding: 1px 7px; border-radius: 10px; border: 1px solid; font-weight: 600; white-space: nowrap; }
.fx-st .fa { font-size: 10px; }
.fx-st.tot { background: #eef3fa; border-color: #d6e4f3; color: var(--vf-azul); }
.fx-st.ok { background: var(--vf-ok-bg); border-color: #c5e8d5; color: #145c3b; }
.fx-st.mal { background: var(--vf-error-bg); border-color: #f5c6c0; color: #8a271d; }
.fx-st.pend { background: var(--vf-aviso-bg); border-color: #f3dcb0; color: #7a4a00; }
.fx-st-ult { color: var(--vf-suave); }

/* Pestañas con el color de su tarjeta (22/10/2026) */
.vf-tab.fx-tab-sel .vf-count { background: var(--vf-ok-bg); color: #145c3b; }
.vf-tab.fx-tab-pdte .vf-count { background: #e6edf7; color: var(--vf-azul); }
.vf-tab.fx-tab-elegir .vf-count { background: var(--vf-aviso-bg); color: #7a4a00; }
.vf-tab.fx-tab-err .vf-count { background: var(--vf-error-bg); color: #8a271d; }
.vf-tab.fx-tab-env .vf-count { background: #eef1f5; color: #44546a; }
.vf-tab.fx-tab-sel.activo { color: var(--vf-ok); border-bottom-color: var(--vf-ok); }
.vf-tab.fx-tab-elegir.activo { color: var(--vf-aviso); border-bottom-color: var(--vf-aviso); }
.vf-tab.fx-tab-err.activo { color: var(--vf-error); border-bottom-color: var(--vf-error); }
.vf-tab.fx-tab-env.activo { color: #44546a; border-bottom-color: #8795a8; }
.vf-tab.fx-tab-sel.activo .vf-count { background: var(--vf-ok); color: #fff; }
.vf-tab.fx-tab-pdte.activo .vf-count { background: var(--vf-azul); color: #fff; }
.vf-tab.fx-tab-elegir.activo .vf-count { background: var(--vf-aviso); color: #fff; }
.vf-tab.fx-tab-err.activo .vf-count { background: var(--vf-error); color: #fff; }
.vf-tab.fx-tab-env.activo .vf-count { background: #8795a8; color: #fff; }
/* Cabeceras ordenables */
.fx-th2 { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.fx-sin-orden { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 11px; text-transform: none; letter-spacing: 0; font-weight: 600; }
@media (max-width: 991px) {
    /* En móvil la cabecera queda como una barra de «Ordenar por» */
    .sxi-page .vf-row.sxi-row.vf-row-head, .ixt-page .vf-row.ixt-row.vf-row-head { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; padding: 8px 12px; position: static; }
    .sxi-row.vf-row-head > div:first-child, .ixt-row.vf-row-head > div:first-child { display: none; }
    .sxi-row.vf-row-head::before, .ixt-row.vf-row-head::before { content: "Ordenar por:"; font-weight: 600; }
    .sxi-row.vf-row-head .fx-th2, .ixt-row.vf-row-head .fx-th2 { flex-direction: row; gap: 14px; }
    .sxi-row.vf-row-head .fx-sin-orden, .ixt-row.vf-row-head .fx-sin-orden { position: static; transform: none; }
}

.sxi-fecha { line-height: 1.35; margin-top: 2px; }
.sxi-fecha b { color: var(--vf-texto); font-weight: 600; white-space: nowrap; }
.sxi-cli-env { font-size: 12.5px; color: var(--vf-suave); }
.sxi-cli-env .fa { color: #9aa8ba; margin-right: 2px; }
/* Enviados: en la cola / procesados (22/10/2026) */
.vf-tab.fx-tab-cola .vf-count { background: var(--vf-info-bg); color: #0f5468; }
.vf-tab.fx-tab-proc .vf-count { background: var(--vf-ok-bg); color: #145c3b; }
.vf-tab.fx-tab-cola.activo { color: var(--vf-info); border-bottom-color: var(--vf-info); }
.vf-tab.fx-tab-proc.activo { color: var(--vf-ok); border-bottom-color: var(--vf-ok); }
.vf-tab.fx-tab-cola.activo .vf-count { background: var(--vf-info); color: #fff; }
.vf-tab.fx-tab-proc.activo .vf-count { background: var(--vf-ok); color: #fff; }
.sxi-page .vf-row.sxi-row.sxi-env.fx-cola, .ixt-page .vf-row.ixt-row.ixt-env.fx-cola { box-shadow: inset 4px 0 0 var(--vf-info); }
.sxi-chk-env.fx-cola-ico, .ixt-chk-env.fx-cola-ico { color: var(--vf-info); }
.fx-kpi-cola { color: var(--vf-info); font-weight: 600; }

/* ---- Importar SEPA XML (importar_sepa_xml.php, prefijo sxi-) ---- */
.sxi-page .vf-card-body { padding: 16px 18px; }
.sxi-zona { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr); gap: 16px; align-items: stretch; }
.sxi-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px 16px; min-height: 150px; }
.sxi-drop b { color: var(--vf-azul); }
.sxi-tipos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sxi-tipo { display: flex; gap: 12px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; min-width: 0; }
.sxi-tipo b { color: var(--vf-texto); font-size: 13.5px; }
.sxi-tipo p { margin: 4px 0 8px; font-size: 12.5px; color: var(--vf-suave); line-height: 1.45; }
.sxi-tipo-ico { flex: none; width: 34px; height: 34px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 16px; }
.sxi-tipo-ico.x { background: #e7f6ee; color: var(--vf-ok); }
.sxi-tipo-acc { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.sxi-tipo-acc .vf-btn-link { font-size: 12.5px; }
.sxi-panel { margin-bottom: 16px; }
.sxi-fich { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--vf-borde); }
.sxi-fich-sel { flex: 1 1 360px; min-width: 0; }
.sxi-fich-sel label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 5px; color: var(--vf-texto); text-transform: none; }
.sxi-fich-sel .vf-select { width: 100%; max-width: 640px; height: 38px; }
.sxi-fich-acc { display: flex; flex-wrap: wrap; gap: 6px; }
.sxi-page .vf-btn.sxi-peligro { color: var(--vf-error); }
.sxi-page .vf-btn.sxi-peligro:hover { border-color: var(--vf-error); color: var(--vf-error); background: var(--vf-error-bg); }
.sxi-info { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 20px; padding: 12px 16px; border-bottom: 1px solid var(--vf-borde); background: var(--vf-fondo); }
.sxi-info-nom { display: flex; gap: 10px; align-items: flex-start; min-width: 0; }
.sxi-info-nom > .fa { font-size: 22px; color: var(--vf-azul); margin-top: 2px; }
.sxi-info-nom > .fa.x { color: var(--vf-ok); }
.sxi-info-nom b { overflow-wrap: anywhere; }
.sxi-info-datos { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; }
.sxi-info-datos span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); }
.sxi-info-datos b { font-variant-numeric: tabular-nums; }
#sx_banners .vf-banner, .sxi-res .vf-banner { margin: 12px 16px 0; }
.sxi-res { padding-bottom: 4px; }
.sxi-res.inf-resultado { margin: 12px 16px 0; }
.sxi-kpis { padding: 14px 16px 0; margin-bottom: 4px; }
.sxi-page .vf-kpi { padding: 10px 12px; }
.sxi-page .vf-kpi .vf-kpi-num { font-size: 22px; }
.sxi-sel-acc { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.sxi-ultimos { display: inline-flex; gap: 4px; align-items: center; }
.sxi-ultimos input { width: 74px; height: 28px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 3px 6px; font-size: 12px; }
.sxi-page .vf-row.sxi-row { grid-template-columns: 40px minmax(180px, 1.15fr) 120px minmax(220px, 1.4fr) minmax(230px, 1.35fr); box-shadow: inset 4px 0 0 transparent; }
.sxi-page .vf-row.sxi-row.vf-row-head { box-shadow: none; }
.sxi-page .vf-row.sxi-row.sxi-marc { box-shadow: inset 4px 0 0 var(--vf-azul); }
.sxi-page .vf-row.sxi-row.sxi-env { box-shadow: inset 4px 0 0 var(--vf-ok); }
.sxi-page .vf-row.sxi-row.sxi-err { box-shadow: inset 4px 0 0 var(--vf-error); }
.sxi-page .vf-row.sxi-row.sxi-libre { box-shadow: inset 4px 0 0 #c2ccd8; }
.sxi-row.sxi-env { background: #fbfcfd; }
.sxi-row.sxi-err .sxi-deudor { color: var(--vf-suave); }
.sxi-chk { border: 0; background: none; padding: 0; font-size: 21px; line-height: 1; color: var(--vf-turquesa); cursor: pointer; }
.sxi-chk .fa-check-square { color: var(--vf-azul); }
.sxi-chk-env { color: var(--vf-ok); cursor: default; }
.sxi-chk-no { color: #c2ccd8; cursor: not-allowed; font-size: 18px; }
.sxi-deudor { font-weight: 600; color: var(--vf-texto); }
.sxi-iban { margin-top: 2px; color: var(--vf-texto); }
.sxi-concepto { margin-top: 3px; font-size: 12.5px; }
.sxi-cod { font-family: Consolas, monospace; font-size: 11px; }
.sxi-varios { font-size: 12px; font-weight: 600; color: var(--vf-aviso); margin-bottom: 4px; }
.sxi-cli { display: flex; gap: 8px; align-items: flex-start; padding: 6px 8px; border-radius: 6px; border: 1px solid transparent; }
.sxi-cli + .sxi-cli { margin-top: 4px; }
.sxi-cli.activo { background: #f2f7fc; border-color: #d6e4f3; }
.sxi-cli.otro .sxi-cli-txt { opacity: .7; }
.sxi-cli-txt { min-width: 0; flex: 1; }
.sxi-cli-nom { font-weight: 600; overflow-wrap: anywhere; }
.sxi-cli-cod { font-weight: 400; font-size: 11.5px; color: var(--vf-suave); }
.sxi-cli-est { margin-top: 3px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.sxi-radio { border: 0; background: none; padding: 0; font-size: 17px; line-height: 1; color: var(--vf-turquesa); cursor: pointer; margin-top: 1px; }
.sxi-radio .fa-dot-circle-o { color: var(--vf-azul); }
.sxi-radio-no { color: #c2ccd8; cursor: default; }
.sxi-sincli { color: var(--vf-error); font-weight: 600; font-size: 12.5px; }
.sxi-que { margin-top: 4px; }
.sxi-selbar .vf-sel-info { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.sxi-sel-pas { font-size: 12px; color: var(--vf-suave); }
.sxi-bloq { pointer-events: none; opacity: .6; }
.sxi-conf-num { font-size: 15px; margin-bottom: 6px; }
.sxi-conf-l { padding-left: 18px; margin: 0 0 10px; }
.sxi-conf .vf-banner { margin: 8px 0; }
.sxi-dev .vf-card-body > div + div { margin-top: 10px; }
.sxi-dev-gen { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; background: var(--vf-error-bg); border: 1px solid #f5c6c0; border-radius: 6px; padding: 12px 14px; }
.sxi-dev-gen > div { flex: 1 1 320px; }
.sxi-dev-tit { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--vf-suave); font-weight: 600; margin: 4px 0 6px; }
.sxi-dev-f { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--vf-borde); border-radius: 6px; margin-bottom: 6px; }
.sxi-dev-f > .fa { color: var(--vf-azul); font-size: 18px; }
.sxi-dev-f > div { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sxi-dev-mas { margin: 10px 0 0; }
@media (max-width: 1199px) {
    .sxi-zona { grid-template-columns: 1fr; }
}
@media (max-width: 991px) {
    .sxi-tipos { grid-template-columns: 1fr; }
    .sxi-page .vf-row.sxi-row { grid-template-columns: 1fr 1fr; }
    .sxi-row .sxi-cell-cli { grid-column: 1 / -1; }
    .sxi-row .vf-cell-check { position: absolute; top: 12px; right: 12px; }
    .sxi-row.vf-row-head { display: none; }
}
@media (max-width: 600px) {
    .sxi-page .vf-card-body { padding: 12px; }
    .sxi-fich { padding: 12px; }
    .sxi-fich-acc { width: 100%; }
    .sxi-fich-acc .vf-btn { flex: 1 1 auto; justify-content: center; }
    .sxi-page .vf-row.sxi-row { grid-template-columns: 1fr; }
    .sxi-kpis { padding: 12px 12px 0; }
    .sxi-page .vf-kpi .vf-kpi-num { font-size: 19px; }
    .sxi-sel-acc { width: 100%; }
    #sx_banners .vf-banner, .sxi-res .vf-banner { margin: 10px 12px 0; }
    .sxi-tipo { padding: 10px 12px; }
    .sxi-dev-gen .vf-btn { width: 100%; justify-content: center; }
}

/* ---- Ficheros enviados (ficheros_sepa_env.php, prefijo sxe-) ---- */
.sxe-page .vf-kpi.sxe-kpi { cursor: default; }
.sxe-page .vf-kpi.sxe-kpi:hover { transform: none; box-shadow: none; }
.sxe-page .vf-kpi .vf-kpi-num { font-size: 22px; }
.sxe-nom { display: flex; gap: 9px; align-items: flex-start; }
.sxe-nom > .fa { font-size: 18px; color: var(--vf-azul); margin-top: 2px; }
.sxe-nom b { color: var(--vf-texto); }
.sxe-imp { font-weight: 700; color: var(--vf-azul); }
.sxe-barra { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: var(--vf-gris-bg); }
.sxe-barra span { display: block; height: 100%; }
.sxe-b-em { background: #5b8fd6; } .sxe-b-co { background: #2fae74; } .sxe-b-de { background: #e05a4b; } .sxe-b-ca { background: #b9c3cf; } .sxe-b-sd { background: #e9c46a; }
.sxe-ley { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 5px; font-size: 11.5px; color: var(--vf-suave); }
.sxe-l { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.sxe-l b { color: var(--vf-texto); }
.sxe-l i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; }
.sxe-acc { display: flex; flex-direction: column; gap: 5px; align-items: flex-end; }
.sxe-acc .vf-btn-link { font-size: 12.5px; }
@media (max-width: 1100px) {
    .sxe-page .inf-fila:not(.inf-cab):not(.inf-pie) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 6px 12px; }
    .sxe-page .inf-fila.inf-cab { display: none; }
    .sxe-page .inf-fila > div:first-child, .sxe-page .inf-fila > div:nth-child(4), .sxe-page .inf-fila > div:nth-child(5) { grid-column: 1 / -1; }
    .sxe-page .inf-fila .vf-label { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); font-weight: 600; }
    .sxe-page .inf-fila > div:first-child > .vf-label, .sxe-page .inf-fila > div:nth-child(5) > .vf-label { display: none; }
    .sxe-page .inf-fila .inf-num { text-align: left; }
    .sxe-page .inf-fila.inf-pie { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
    .sxe-page .inf-fila.inf-pie > div:empty { display: none; }
    .sxe-acc { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
}

/* ---- Ficheros de devoluciones (ficheros_sepa_dev.php, prefijo sxd-) ---- */
.sxd-page .vf-kpi.sxd-kpi { cursor: default; }
.sxd-page .vf-kpi.sxd-kpi:hover { transform: none; box-shadow: none; }
.sxd-page .vf-kpi .vf-kpi-num { font-size: 22px; }
.sxd-gen { align-items: center; flex-wrap: wrap; }
.sxd-gen .vf-btn { flex: none; }
.sxd-lista { padding: 4px 0; }
.sxd-zip { border-bottom: 1px solid var(--vf-borde); padding: 12px 16px; }
.sxd-zip-cab { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.sxd-zip-ico { width: 34px; height: 34px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 16px; flex: none; }
.sxd-zip-txt { flex: 1 1 260px; min-width: 0; overflow-wrap: anywhere; }
.sxd-zip-txt b { color: var(--vf-texto); }
.sxd-xmls { margin: 10px 0 0 46px; border: 1px solid var(--vf-borde); border-radius: 6px; }
.sxd-sin { padding: 10px 12px; font-size: 12.5px; color: var(--vf-suave); }
.sxd-xml { display: grid; grid-template-columns: minmax(200px, 1.3fr) 170px minmax(220px, 1.5fr) 80px; gap: 12px; padding: 10px 12px; font-size: 12.5px; align-items: stretch; }
.sxd-xml + .sxd-xml { border-top: 1px solid var(--vf-borde); }
.sxd-xml > div { min-width: 0; overflow-wrap: anywhere; }
.sxd-xml .vf-label { display: none; }
.sxd-xml-a { display: flex; gap: 8px; align-items: flex-start; }
.sxd-xml-a > .fa { color: var(--vf-turquesa); font-size: 15px; margin-top: 2px; }
.sxd-xml-a, .sxd-xml-d { align-self: center; }
.sxd-xml-d { text-align: right; }
.sxd-rojo { color: var(--vf-error); font-weight: 600; white-space: nowrap; }
.sxd-lab { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; font-weight: 700; margin-bottom: 3px; }
.sxd-dev { height: 100%; background: var(--vf-error-bg); border: 1px solid #f5c6c0; border-radius: 6px; padding: 6px 10px; color: #8a271d; }
.sxd-dev .sxd-lab { color: var(--vf-error); }
.sxd-dev-num b { font-size: 14px; }
.sxd-dev-imp { font-size: 14px; font-weight: 700; color: var(--vf-error); }
.sxd-ori { height: 100%; background: #f2f7fc; border: 1px solid #d6e4f3; border-radius: 6px; padding: 6px 10px; }
.sxd-ori .sxd-lab { color: var(--vf-azul); }
.sxd-ori .vf-sub { color: #44546a; }
.sxd-origen { text-align: left; font-size: 12.5px; white-space: normal; overflow-wrap: anywhere; }
.sxd-vacio p { max-width: 560px; margin: 8px auto 14px; line-height: 1.5; }
@media (max-width: 1100px) {
    .sxd-xmls { margin-left: 0; }
    .sxd-xml { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
    .sxd-xml-a { grid-column: 1 / -1; }
    .sxd-xml-b { grid-column: 1 / -1; }
    .sxd-xml-c { grid-column: 1 / -1; }
    .sxd-xml-d { grid-column: 1 / -1; text-align: left; }
}
@media (max-width: 600px) {
    .sxd-zip { padding: 12px; }
    .sxd-zip-acc { width: 100%; }
    .sxd-zip-acc .vf-btn { width: 100%; justify-content: center; }
    .sxd-gen .vf-btn { width: 100%; justify-content: center; }
}

/* ---- Movimientos por fichero (movimientos_ficheros_sepa.php, prefijo sxm-) ---- */
.sxm-filtro { margin-bottom: 16px; }
.sxm-filtro .vf-toolbar { border-bottom: 0; border-radius: 6px; }
.sxm-fechas label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 400; font-size: 12.5px; color: var(--vf-suave); text-transform: none; }
.sxm-res.inf-resultado { margin: 0 16px 12px; }
.sxm-page .vf-kpi.sxm-kpi { cursor: default; }
.sxm-page .vf-kpi.sxm-kpi:hover { transform: none; box-shadow: none; }
.sxm-page .vf-kpi .vf-kpi-num { font-size: 21px; }
.sxm-tipo { font-weight: 600; color: var(--vf-texto); }
.sxm-num { font-weight: 400; font-size: 11.5px; color: var(--vf-suave); background: var(--vf-gris-bg); border-radius: 10px; padding: 1px 7px; margin-left: 4px; white-space: nowrap; }
.sxm-fich .fa { color: var(--vf-turquesa); }
.sxm-imp, .sxm-saldo { font-weight: 700; }
.sxm-pos { color: var(--vf-ok); }
.sxm-neg { color: var(--vf-error); }
.sxm-saldo.sxm-pos { color: var(--vf-azul); }
@media (max-width: 600px) {
    .sxm-fechas { width: 100%; }
    .sxm-fechas label { flex: 1 1 45%; }
    .sxm-fechas label input { flex: 1; min-width: 0; }
    .sxm-fechas .vf-btn { width: 100%; justify-content: center; }
    .sxm-res.inf-resultado { margin: 0 12px 12px; }
}
@media (max-width: 760px) {
    .sxm-page .inf-fila:not(.inf-cab):not(.inf-pie) > div:nth-child(2) { grid-column: 1 / -1; }
    .sxm-page .inf-fila.inf-pie > div:empty { display: none; }
}

/* ---- Importar SEPA XML (importar_sepa_xml.php, prefijo ixt-) ---- */
.ixt-page .vf-card-body { padding: 16px 18px; }
.ixt-zona { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr); gap: 16px; align-items: stretch; }
.ixt-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px 16px; min-height: 150px; }
.ixt-drop b { color: var(--vf-azul); }
.ixt-tipo { display: flex; gap: 12px; border: 1px solid var(--vf-borde); border-radius: 6px; padding: 12px 14px; min-width: 0; }
.ixt-tipo b { color: var(--vf-texto); font-size: 13.5px; }
.ixt-tipo p { margin: 4px 0 8px; font-size: 12.5px; color: var(--vf-suave); line-height: 1.45; }
.ixt-tipo-ico { flex: none; width: 34px; height: 34px; border-radius: 8px; background: #e6edf7; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 16px; }
.ixt-tipo-ico.x { background: #e7f6ee; color: var(--vf-ok); }
.ixt-tipo-acc { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.ixt-tipo-acc .vf-btn-link { font-size: 12.5px; }
.ixt-panel { margin-bottom: 16px; }
.ixt-fich { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--vf-borde); }
.ixt-fich-sel { flex: 1 1 360px; min-width: 0; }
.ixt-fich-sel label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 5px; color: var(--vf-texto); text-transform: none; }
.ixt-fich-sel .vf-select { width: 100%; max-width: 640px; height: 38px; }
.ixt-fich-acc { display: flex; flex-wrap: wrap; gap: 6px; }
.ixt-page .vf-btn.ixt-peligro { color: var(--vf-error); }
.ixt-page .vf-btn.ixt-peligro:hover { border-color: var(--vf-error); color: var(--vf-error); background: var(--vf-error-bg); }
.ixt-info { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 20px; padding: 12px 16px; border-bottom: 1px solid var(--vf-borde); background: var(--vf-fondo); }
.ixt-info-nom { display: flex; gap: 10px; align-items: flex-start; min-width: 0; }
.ixt-info-nom > .fa { font-size: 22px; color: var(--vf-azul); margin-top: 2px; }
.ixt-info-nom > .fa.x { color: var(--vf-ok); }
.ixt-info-nom b { overflow-wrap: anywhere; }
.ixt-info-datos { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; }
.ixt-info-datos span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: var(--vf-suave); }
.ixt-info-datos b { font-variant-numeric: tabular-nums; }
#sx_banners .vf-banner, .ixt-res .vf-banner { margin: 12px 16px 0; }
.ixt-res { padding-bottom: 4px; }
.ixt-res.inf-resultado { margin: 12px 16px 0; }
.ixt-kpis { padding: 14px 16px 0; margin-bottom: 4px; }
.ixt-page .vf-kpi { padding: 10px 12px; }
.ixt-page .vf-kpi .vf-kpi-num { font-size: 22px; }
.ixt-sel-acc { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ixt-ultimos { display: inline-flex; gap: 4px; align-items: center; }
.ixt-ultimos input { width: 74px; height: 28px; border: 1px solid var(--vf-borde); border-radius: 4px; padding: 3px 6px; font-size: 12px; }
.ixt-page .vf-row.ixt-row { grid-template-columns: 40px minmax(180px, 1.15fr) 120px minmax(220px, 1.4fr) minmax(230px, 1.35fr); box-shadow: inset 4px 0 0 transparent; }
.ixt-page .vf-row.ixt-row.vf-row-head { box-shadow: none; }
.ixt-page .vf-row.ixt-row.fx-marc { box-shadow: inset 4px 0 0 var(--vf-azul); }
.ixt-page .vf-row.ixt-row.ixt-env { box-shadow: inset 4px 0 0 var(--vf-ok); }
.ixt-page .vf-row.ixt-row.ixt-err { box-shadow: inset 4px 0 0 var(--vf-error); }
.ixt-page .vf-row.ixt-row.fx-libre { box-shadow: inset 4px 0 0 #c2ccd8; }
.ixt-row.ixt-env { background: #fbfcfd; }
.ixt-row.ixt-err .ixt-deudor { color: var(--vf-suave); }
.ixt-chk { border: 0; background: none; padding: 0; font-size: 21px; line-height: 1; color: var(--vf-turquesa); cursor: pointer; }
.ixt-chk .fa-check-square { color: var(--vf-azul); }
.ixt-chk-env { color: var(--vf-ok); cursor: default; }
.ixt-chk-no { color: #c2ccd8; cursor: not-allowed; font-size: 18px; }
.ixt-deudor { font-weight: 600; color: var(--vf-texto); }
.ixt-concepto { margin-top: 3px; font-size: 12.5px; }
.ixt-varios { font-size: 12px; font-weight: 600; color: var(--vf-aviso); margin-bottom: 4px; }
.ixt-cli { display: flex; gap: 8px; align-items: flex-start; padding: 6px 8px; border-radius: 6px; border: 1px solid transparent; }
.ixt-cli + .ixt-cli { margin-top: 4px; }
.ixt-cli.activo { background: #f2f7fc; border-color: #d6e4f3; }
.ixt-cli.otro .ixt-cli-txt { opacity: .7; }
.ixt-cli-txt { min-width: 0; flex: 1; }
.ixt-cli-nom { font-weight: 600; overflow-wrap: anywhere; }
.ixt-cli-cod { font-weight: 400; font-size: 11.5px; color: var(--vf-suave); }
.ixt-cli-est { margin-top: 3px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.ixt-radio { border: 0; background: none; padding: 0; font-size: 17px; line-height: 1; color: var(--vf-turquesa); cursor: pointer; margin-top: 1px; }
.ixt-radio .fa-dot-circle-o { color: var(--vf-azul); }
.ixt-radio-no { color: #c2ccd8; cursor: default; }
.ixt-sincli { color: var(--vf-error); font-weight: 600; font-size: 12.5px; }
.ixt-que { margin-top: 4px; }
.ixt-selbar .vf-sel-info { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.ixt-sel-pas { font-size: 12px; color: var(--vf-suave); }
.ixt-bloq { pointer-events: none; opacity: .6; }
.ixt-conf-num { font-size: 15px; margin-bottom: 6px; }
.ixt-conf-l { padding-left: 18px; margin: 0 0 10px; }
.ixt-conf .vf-banner { margin: 8px 0; }
@media (max-width: 1199px) {
    .ixt-zona { grid-template-columns: 1fr; }
}
@media (max-width: 991px) {
    .ixt-page .vf-row.ixt-row { grid-template-columns: 1fr 1fr; }
    .ixt-row .ixt-cell-cli { grid-column: 1 / -1; }
    .ixt-row .vf-cell-check { position: absolute; top: 12px; right: 12px; }
    .ixt-row.vf-row-head { display: none; }
}
@media (max-width: 600px) {
    .ixt-page .vf-card-body { padding: 12px; }
    .ixt-fich { padding: 12px; }
    .ixt-fich-acc { width: 100%; }
    .ixt-fich-acc .vf-btn { flex: 1 1 auto; justify-content: center; }
    .ixt-page .vf-row.ixt-row { grid-template-columns: 1fr; }
    .ixt-kpis { padding: 12px 12px 0; }
    .ixt-page .vf-kpi .vf-kpi-num { font-size: 19px; }
    .ixt-sel-acc { width: 100%; }
    #sx_banners .vf-banner, .ixt-res .vf-banner { margin: 10px 12px 0; }
    .ixt-tipo { padding: 10px 12px; }
}
.ixt-zona { grid-template-columns: minmax(220px, 1fr) minmax(0, 1.4fr); }
.ixt-tipo-ico { background: #e7f6ee; color: var(--vf-ok); }
.ixt-nif { font-weight: 600; color: var(--vf-texto); }
.ixt-concepto { margin-top: 3px; font-size: 12.5px; }
.ixt-row.ixt-err .ixt-nif { color: var(--vf-suave); }
@media (max-width: 1199px) { .ixt-zona { grid-template-columns: 1fr; } }


/* =============================================================================
   PANTALLAS DE ACCESO (22/10/2026)
   login.php, register.php, forgot.php, correo_activacion.php y validate_pin.php (prefijo acc-)
   ============================================================================= */
/* ---- Base: página pública sin el panel (prefijo acc-) ---- */
body.acc-body { margin: 0; background: #f2f5f9; font-family: Inter, "Helvetica Neue", Arial, sans-serif; color: var(--vf-texto); -webkit-font-smoothing: antialiased; }
body.acc-body *, body.acc-body *:before, body.acc-body *:after { box-sizing: border-box; }
body.acc-body a { color: var(--vf-turquesa); }
body.acc-body a:hover { color: var(--vf-azul); }
.acc-wrap { min-height: calc(100vh - 50px); display: grid; grid-template-columns: minmax(340px, 42%) minmax(0, 1fr); }

/* ---- Panel de la marca ---- */
.acc-marca { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; padding: 40px 48px 28px; color: #fff;
    background: radial-gradient(circle at 15% 0%, rgba(27,121,155,.55) 0, rgba(27,121,155,0) 45%), linear-gradient(160deg, #0b4a96 0%, #01397F 45%, #08244d 100%); }
.acc-marca:after { content: ""; position: absolute; right: -120px; bottom: -120px; width: 380px; height: 380px; border-radius: 50%; border: 60px solid rgba(255,255,255,.05); pointer-events: none; }
.acc-marca-logo img { height: 40px; width: auto; filter: brightness(0) invert(1); }
.acc-marca-txt { max-width: 460px; position: relative; z-index: 1; }
.acc-marca h1 { margin: 0 0 14px; font-size: 38px; line-height: 1.12; font-weight: 700; letter-spacing: -.5px; color: #fff; }
.acc-marca h1 span { color: #8fd3ea; }
.acc-marca p { margin: 0; font-size: 16px; line-height: 1.55; color: rgba(255,255,255,.82); }
.acc-puntos { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.acc-puntos li { display: flex; gap: 14px; align-items: flex-start; }
.acc-puntos li b { display: block; font-size: 15px; font-weight: 600; color: #fff; }
.acc-puntos li span:not(.acc-punto-ico) { display: block; font-size: 13.5px; color: rgba(255,255,255,.72); margin-top: 2px; line-height: 1.45; }
.acc-punto-ico { flex: none; width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); display: flex; align-items: center; justify-content: center; font-size: 16px; color: #fff; }
.acc-marca-pie { font-size: 12px; color: rgba(255,255,255,.55); position: relative; z-index: 1; }
.acc-caras { display: flex; margin-top: 28px; }
.acc-caras img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; border: 3px solid #0b3f82; margin-left: -10px; background: #fff; }
.acc-caras img:first-child { margin-left: 0; }
.acc-caras + p.acc-caras-txt { margin-top: 10px; font-size: 13.5px; }

/* ---- Columna del formulario ---- */
.acc-main { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 24px; }
.acc-logo-movil { display: none; margin-bottom: 18px; }
.acc-card { width: 100%; max-width: 430px; background: #fff; border-radius: 14px; border: 1px solid #e6ebf2; box-shadow: 0 10px 30px rgba(16, 40, 70, .08); padding: 30px 30px 24px; }
.acc-card.acc-ancha { max-width: 600px; }
.acc-card-cab { margin-bottom: 18px; }
.acc-card-cab h2 { margin: 0 0 4px; font-size: 24px; font-weight: 700; color: var(--vf-azul); letter-spacing: -.3px; }
.acc-card-cab p { margin: 0; font-size: 14px; color: var(--vf-suave); line-height: 1.5; }
.acc-card-ico { width: 46px; height: 46px; border-radius: 12px; background: #e9f1fb; color: var(--vf-azul); display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 14px; }

/* ---- Formulario ---- */
.acc-form .vf-field { margin-bottom: 14px; }
.acc-form .vf-field label { font-size: 13px; margin-bottom: 6px; }
.acc-form .vf-field input[type=text], .acc-form .vf-field input[type=email], .acc-form .vf-field input[type=password] { width: 100%; height: 44px; padding: 10px 12px; border: 1px solid #cfd8e3; border-radius: 8px; font-size: 15px; color: var(--vf-texto); background: #fff; box-shadow: none; transition: border-color .15s, box-shadow .15s; }
.acc-form .vf-field input::placeholder { color: #9aa8ba; }
.acc-form .vf-field input:focus { outline: none; border-color: var(--vf-turquesa); box-shadow: 0 0 0 3px rgba(27,121,155,.15); }
.acc-form .vf-field.invalido input { border-color: var(--vf-error); }
.acc-form .vf-field.invalido input:focus { box-shadow: 0 0 0 3px rgba(192,57,43,.14); }
.acc-form .vf-pass .vf-ojo { right: 6px; font-size: 16px; padding: 6px 8px; border-radius: 6px; }
.acc-form .vf-pass .vf-ojo:hover, .acc-form .vf-pass .vf-ojo:focus-visible { color: var(--vf-azul); background: var(--vf-fondo); outline: none; }
.acc-label-fila { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.acc-label-fila label { margin-bottom: 6px; }
.acc-link-peq { font-size: 12.5px; font-weight: 500; text-decoration: none; }
.acc-mayus { margin-top: 6px; font-size: 12px; color: var(--vf-aviso); font-weight: 500; }
.acc-btn { width: 100%; height: 46px; justify-content: center; font-size: 15px; border-radius: 8px; margin-top: 4px; }
.acc-btn .fa { margin-right: 2px; }
.acc-btn-sec { width: 100%; justify-content: center; height: 42px; border-radius: 8px; }
.acc-fila-btns { display: flex; gap: 10px; margin-top: 6px; }
.acc-fila-btns .vf-btn { flex: 1 1 0; height: 46px; justify-content: center; border-radius: 8px; font-size: 15px; }
.acc-fila-btns .vf-btn.acc-volver { flex: 0 0 auto; padding-left: 16px; padding-right: 16px; }
.acc-aviso { margin: 0 0 14px; text-align: left; }
.acc-aviso .vf-banner-body > div { margin-top: 2px; line-height: 1.45; }
.acc-aviso a { font-weight: 600; text-decoration: underline; color: inherit !important; }
.acc-aviso-acc { margin-top: 6px; }
.acc-activacion { margin-top: 12px; }
.acc-help { font-size: 12.5px; color: var(--vf-suave); margin-top: 6px; line-height: 1.45; }
.acc-medidor-txt { font-size: 11.5px; color: var(--vf-suave); margin-top: 4px; min-height: 14px; }

/* Comercio / autorizado */
.acc-tipo { display: grid; grid-template-columns: 1fr 1fr; background: var(--vf-fondo); border: 1px solid var(--vf-borde); border-radius: 10px; padding: 4px; gap: 4px; }
.acc-tipo input { position: absolute; opacity: 0; pointer-events: none; }
.acc-tipo label { margin: 0; display: flex; align-items: center; justify-content: center; gap: 7px; height: 38px; border-radius: 7px; font-size: 13.5px; font-weight: 600; color: var(--vf-suave); cursor: pointer; text-transform: none; letter-spacing: 0; transition: background .15s, color .15s; }
.acc-tipo label:hover { color: var(--vf-azul); }
.acc-tipo input:checked + label { background: #fff; color: var(--vf-azul); box-shadow: 0 1px 3px rgba(16,40,70,.14); }
.acc-tipo input:focus-visible + label { outline: 2px solid var(--vf-turquesa); outline-offset: 1px; }
.acc-tipo-ayuda { margin: 7px 0 14px; font-size: 12.5px; color: var(--vf-suave); }

/* Enlaces de debajo y sellos */
.acc-otros { margin-top: 20px; padding-top: 16px; border-top: 1px solid #edf1f6; display: flex; flex-direction: column; gap: 8px; align-items: center; font-size: 13.5px; color: var(--vf-suave); text-align: center; }
.acc-otros a { text-decoration: none; font-weight: 500; }
.acc-otros a:hover { text-decoration: underline; }
.acc-otros .fa { margin-right: 4px; }
.acc-sellos { margin-top: 22px; text-align: center; opacity: .9; }
.acc-sellos img { max-width: 170px; height: auto; }

/* Registro: planes */
.acc-pasos { display: flex; gap: 8px; margin-bottom: 18px; }
.acc-paso { flex: 1; display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: #9aa8ba; }
.acc-paso b { width: 24px; height: 24px; border-radius: 50%; background: var(--vf-gris-bg); color: var(--vf-suave); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; flex: none; }
.acc-paso:after { content: ""; flex: 1; height: 2px; background: var(--vf-gris-bg); border-radius: 1px; }
.acc-paso:last-child:after { display: none; }
.acc-paso.activo { color: var(--vf-azul); }
.acc-paso.activo b { background: var(--vf-azul); color: #fff; }
.acc-paso.hecho { color: var(--vf-ok); }
.acc-paso.hecho b { background: var(--vf-ok); color: #fff; }
.acc-planes { display: flex; flex-direction: column; gap: 10px; }
.acc-plan { position: relative; display: block; margin: 0; padding: 16px 16px 16px 50px; border: 1.5px solid #dbe3ed; border-radius: 12px; cursor: pointer; font-weight: 400; text-transform: none; letter-spacing: 0; transition: border-color .15s, background .15s, box-shadow .15s; }
.acc-plan:hover { border-color: #b9c8da; }
.acc-plan input { position: absolute; opacity: 0; pointer-events: none; }
.acc-plan-radio { position: absolute; left: 16px; top: 17px; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #b9c6d6; background: #fff; }
.acc-plan.activo { border-color: var(--vf-azul); background: #f5f9fe; box-shadow: 0 0 0 3px rgba(1,57,127,.08); }
.acc-plan.activo .acc-plan-radio { border-color: var(--vf-azul); box-shadow: inset 0 0 0 4px #fff; background: var(--vf-azul); }
.acc-plan input:focus-visible ~ .acc-plan-radio { outline: 2px solid var(--vf-turquesa); outline-offset: 2px; }
.acc-plan-tit { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 15.5px; font-weight: 700; color: var(--vf-azul); }
.acc-plan-txt { display: block; margin-top: 6px; font-size: 13.5px; line-height: 1.5; color: #44546a; }
.acc-plan-nota { margin-top: 12px; font-size: 12.5px; color: var(--vf-aviso); }
.acc-check { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 10px; font-size: 13.5px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--vf-texto); cursor: pointer; line-height: 1.45; }
.acc-check input { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--vf-azul); cursor: pointer; }
.acc-check a { font-weight: 600; }
.acc-check.invalido { color: var(--vf-error); }
.acc-legal { font-size: 11.5px; color: var(--vf-suave); line-height: 1.5; margin: 4px 0 14px; padding: 10px 12px; background: var(--vf-fondo); border-radius: 8px; }
.acc-tranquilo { display: flex; gap: 8px; align-items: center; font-size: 13px; color: #145c3b; background: var(--vf-ok-bg); border-radius: 8px; padding: 9px 12px; margin-bottom: 14px; }

/* Código (PIN / dos pasos) */
.acc-codigo input[type=text] { text-align: center; font-size: 24px !important; letter-spacing: 10px; font-weight: 600; height: 56px !important; font-family: Consolas, "SFMono-Regular", Menlo, monospace; }

/* ---- Pie (footer.php) en estas pantallas ---- */
body.acc-body footer.footer.ft-vf { margin: 0; }

/* ---- Pantallas medianas y móvil ---- */
@media (max-width: 1100px) {
    .acc-marca { padding: 32px 32px 24px; }
    .acc-marca h1 { font-size: 30px; }
}
@media (max-width: 900px) {
    .acc-wrap { grid-template-columns: 1fr; min-height: 0; }
    .acc-marca { display: none; }
    .acc-logo-movil { display: block; }
    .acc-main { justify-content: flex-start; padding: 28px 16px 24px; min-height: calc(100vh - 90px); }
}
@media (max-width: 480px) {
    .acc-card { padding: 22px 18px 18px; border-radius: 12px; }
    .acc-card-cab h2 { font-size: 21px; }
    .acc-tipo label { font-size: 12.5px; }
    .acc-paso span { display: none; }
    .acc-fila-btns { flex-direction: column-reverse; }
    .acc-fila-btns .vf-btn.acc-volver { flex: 1 1 auto; }
}
.acc-marca-pie a { color: rgba(255,255,255,.65) !important; text-decoration: none; } .acc-marca-pie a:hover { color: #fff !important; text-decoration: underline; }
.acc-card-ico.acc-ico-ok { background: var(--vf-ok-bg); color: var(--vf-ok); }
/* La capa «cargando» de fn_propias (sus estilos están en custom.css, que aquí no se carga): los botones ya enseñan su spinner */
.acc-body .loader { display: none !important; }
.acc-solo-movil { display: none; }
@media (max-width: 900px) { .acc-card-cab p.acc-solo-movil { display: block; margin-top: 6px; font-size: 13px; } }


/* Usuarios autorizados: el código de comercio y «Copiar» juntos y a la misma altura (22/10/2026) */
.au-page .au-acceso .au-cod-caja { display: inline-flex; align-items: center; gap: 6px; vertical-align: middle; margin: 0 2px; white-space: nowrap; }
.au-page .au-acceso .au-cod-caja .au-codigo { height: 28px; line-height: 26px; padding: 0 9px; }
.au-page .au-acceso .au-cod-caja .vf-btn { height: 28px; margin: 0; vertical-align: middle; display: inline-flex; align-items: center; gap: 5px; padding-top: 0; padding-bottom: 0; }


/* =============================================================================
   SECCIONES MÁS VISIBLES (22/10/2026, opción C elegida por Carlos)
   En todas las pantallas del formato nuevo (las que tienen .vf-page dentro del panel):
   - fondo gris azulado muy claro detrás y las tarjetas (.vf-card) blancas con sombra suave;
   - la sección en la que se está escribiendo se resalta (:focus-within);
   - en los resúmenes de arriba (.vf-check-item con data-seccion) se marca la parte en la que se escribe
     (clase vf-activo, la pone verifactu_comun.js).
   Las páginas públicas (.ext-apl, .acc-body) y las pantallas antiguas no cambian.
   ============================================================================= */
/* El gris va solo en .content: lo que queda debajo del pie en las pantallas cortas sigue blanco, como el pie */
.main-panel:has(> .content .vf-page) > .content { background: #eef2f7; }
.vf-page .vf-card { border: 1px solid #dbe2ec; border-radius: 10px; box-shadow: 0 1px 2px rgba(16,40,70,.05), 0 2px 8px rgba(16,40,70,.05); margin-bottom: 18px; transition: border-color .15s, box-shadow .15s; }
.vf-page .vf-card > .vf-card-head { border-bottom-color: #e8edf3; border-radius: 10px 10px 0 0; }
.vf-page .vf-head { box-shadow: 0 1px 2px rgba(16,40,70,.06), 0 2px 8px rgba(16,40,70,.04); border-radius: 8px; }
.vf-page .vf-kpi, .vf-page .vf-check-item { box-shadow: 0 1px 2px rgba(16,40,70,.05); }
.vf-page .vf-check-item { border-radius: 10px; transition: border-color .15s, box-shadow .15s, background .15s; }

/* Sección en la que se está escribiendo: solo con el foco en un campo y no en las tarjetas con listas o pestañas */
.vf-page .vf-card:not(:has(.vf-list, .vf-tabs, .vf-card :is(input, select, textarea):focus)):has(input:focus, select:focus, textarea:focus) { border-color: #8fbcd6; box-shadow: 0 0 0 3px rgba(27,121,155,.13), 0 4px 14px rgba(16,40,70,.08); }
.vf-page .vf-card:not(:has(.vf-list, .vf-tabs, .vf-card :is(input, select, textarea):focus)):has(input:focus, select:focus, textarea:focus) > .vf-card-head .vf-card-icon { background: var(--vf-azul); color: #fff; transition: background .15s, color .15s; }
/* (si hay una tarjeta dentro de otra, solo se resalta la de dentro) */

/* Resumen de arriba: la parte en la que se escribe */
.vf-check-item.vf-activo { border-color: #8fbcd6; background: #f2f8fc; box-shadow: 0 0 0 3px rgba(27,121,155,.13); }
.vf-check-item.vf-activo .vf-ci-title:after { content: " · editando"; font-weight: 500; color: var(--vf-turquesa); font-size: 12px; }