/* SCRUM-2410 (ajustes) — Traslado de Cajas
 *
 * Vista `Accounting/CashBox/transfer` (view/Accounting/CashBox/ViewTransfer.php). Reglas tomadas
 * del modal que reemplaza (ModalsGeneral::modalTrasladoCaja), que a su vez replicaba el Paso 2
 * "Traslado de efectivo" del paso a paso de Cerrar Caja.
 *
 * TODO va acotado a #vistaTrasladoCajas a propósito: el wizard de cierre
 * (view/Sales/Reports/ViewReports.php) trae su propia copia de las reglas cc-* y esta hoja se
 * carga en todas las pantallas desde view/partials/head.php. Unificar ambas copias queda fuera
 * del alcance de este ticket.
 */

#vistaTrasladoCajas {
    --cc-brand: #1a3a5c;
    --cc-brand-soft: #E6F1FB;
    --cc-green: #2E7D32;
    --cc-green-deep: #1B5E20;
    --cc-green-soft: #EAF3DE;
    --cc-green-tint: #F1F8E9;
    --cc-green-line: #A5D6A7;
    --cc-red: #A32D2D;
    --cc-red-soft: #FCEBEB;
    --cc-red-line: #FFCDD2;
    --cc-line: #dde3ea;
    --cc-ink: #16202b;
    --cc-ink2: #5a6675;
    --cc-ink3: #8a95a3;
    color: var(--cc-ink);
}

#vistaTrasladoCajas * { box-sizing: border-box; }
#vistaTrasladoCajas .cc-tnum { font-variant-numeric: tabular-nums; }

/* Cabecera de la vista (reemplaza al .modal-header verde del modal) */
#vistaTrasladoCajas .cc-head {
    background: var(--cc-green);
    border-radius: 11px 11px 0 0;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#vistaTrasladoCajas .cc-head h5 {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 8px;
}
#vistaTrasladoCajas .cc-body {
    padding: 16px;
    background: #fff;
    border: 1px solid var(--cc-line);
    border-top: none;
    border-radius: 0 0 11px 11px;
}

/* Banner de efectivo disponible */
#vistaTrasladoCajas .cc-ebanner {
    border: 1px solid var(--cc-green-line);
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
}
#vistaTrasladoCajas .cc-ebanner .h {
    background: var(--cc-green);
    color: #fff;
    padding: 9px 14px;
    font-size: 12px;
    font-weight: 600;
}
#vistaTrasladoCajas .cc-ebanner .body { display: grid; grid-template-columns: 1fr 1fr; }
#vistaTrasladoCajas .cc-eb { padding: 14px 16px; border-right: 1px solid var(--cc-green-line); }
#vistaTrasladoCajas .cc-eb:last-child { border-right: none; background: var(--cc-green-tint); }
#vistaTrasladoCajas .cc-eb .k { font-size: 11px; color: var(--cc-ink2); margin-bottom: 4px; }
#vistaTrasladoCajas .cc-eb .v { font-size: 20px; font-weight: 750; color: var(--cc-green-deep); }
#vistaTrasladoCajas .cc-eb .s { font-size: 10px; color: var(--cc-green); margin-top: 3px; }
#vistaTrasladoCajas .cc-eb .cc-round { margin-top: 8px; }

/* Formulario */
#vistaTrasladoCajas .cc-formbox {
    background: #f5f7fa;
    border: 1px solid var(--cc-line);
    border-radius: 8px;
    padding: 16px;
}
#vistaTrasladoCajas .cc-formbox .ttl { font-size: 12.5px; font-weight: 700; margin-bottom: 14px; }
#vistaTrasladoCajas .cc-fgrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
#vistaTrasladoCajas .cc-field label {
    font-size: 11px;
    color: var(--cc-ink2);
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
}
#vistaTrasladoCajas .cc-field select,
#vistaTrasladoCajas .cc-field input {
    width: 100%;
    height: 38px;
    font-size: 13px;
    border: 1px solid var(--cc-line);
    border-radius: 8px;
    padding: 0 11px;
    background: #fff;
    color: var(--cc-ink);
}
#vistaTrasladoCajas .cc-field .hint { font-size: 10px; color: var(--cc-ink3); margin-top: 4px; }
#vistaTrasladoCajas .cc-field input.emph { border-color: var(--cc-brand); font-weight: 700; }
#vistaTrasladoCajas .cc-infobox {
    background: var(--cc-brand-soft);
    border-left: 3px solid var(--cc-brand);
    border-radius: 0 7px 7px 0;
    padding: 10px 13px;
    font-size: 12px;
    color: #0C447C;
}

/* Acciones */
#vistaTrasladoCajas .cc-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 13px 0 0;
    margin-top: 16px;
    border-top: 1px solid var(--cc-line);
    gap: 10px;
    flex-wrap: wrap;
}
#vistaTrasladoCajas .cc-actions .grp { display: flex; gap: 9px; flex-wrap: wrap; }
#vistaTrasladoCajas .cc-btn {
    border: none;
    padding: 9px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: inherit;
}
#vistaTrasladoCajas .cc-btn-secondary { background: #fff; color: var(--cc-ink); border: 1px solid var(--cc-line); }
#vistaTrasladoCajas .cc-btn-success { background: var(--cc-green); color: #fff; }
#vistaTrasladoCajas .cc-btn:disabled { opacity: .55; cursor: not-allowed; }
#vistaTrasladoCajas .cc-btn-round {
    background: #fff;
    color: var(--cc-green-deep);
    border: 1px solid var(--cc-green-line);
    padding: 5px 14px;
    font-size: 11px;
    border-radius: 20px;
}

#vistaTrasladoCajas #alertDiferencia {
    background: var(--cc-red-soft);
    border: 1px solid var(--cc-red-line);
    border-left: 4px solid var(--cc-red);
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 13px;
    color: var(--cc-red);
    margin-bottom: 16px;
}

/* Los selects conservan select2 (el JS depende de él): se alinean con .cc-field input. */
#vistaTrasladoCajas .cc-field .select2-container { width: 100% !important; max-width: 100%; }
#vistaTrasladoCajas .cc-field .select2-container--default .select2-selection--single {
    height: 38px;
    border: 1px solid var(--cc-line);
    border-radius: 8px;
    background: #fff;
}
#vistaTrasladoCajas .cc-field .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px;
    padding-left: 11px;
    padding-right: 24px;
    font-size: 13px;
    color: var(--cc-ink);
}
#vistaTrasladoCajas .cc-field .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; }

@media (max-width: 768px) {
    #vistaTrasladoCajas .cc-fgrid,
    #vistaTrasladoCajas .cc-ebanner .body { grid-template-columns: 1fr; }
    #vistaTrasladoCajas .cc-eb { border-right: none; border-bottom: 1px solid var(--cc-green-line); }
    #vistaTrasladoCajas .cc-actions { flex-direction: column; align-items: stretch; }
    #vistaTrasladoCajas .cc-actions .grp { justify-content: flex-end; }
}