/* ============================================================
   Temas personalizados - System POS Nicaragua
   Define las clases Tailwind dinamicas (tw-from-{tema}-800, etc.)
   que la interfaz genera segun el color elegido en
   Configuracion > Sistema > Color del tema.
   Temas: navy, teal, carbon
   ============================================================ */

/* ---------- NAVY ---------- */
.tw-bg-navy-400 { background-color: #3d6a9e !important; }
.tw-text-navy-400 { color: #3d6a9e !important; }
.tw-border-navy-400 { border-color: #3d6a9e !important; }
.tw-from-navy-400 { --tw-gradient-from: #3d6a9e; --tw-gradient-to: rgba(61,106,158,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-navy-400 { --tw-gradient-to: #3d6a9e; }
.tw-bg-navy-500 { background-color: #2c4f7c !important; }
.tw-text-navy-500 { color: #2c4f7c !important; }
.tw-border-navy-500 { border-color: #2c4f7c !important; }
.tw-from-navy-500 { --tw-gradient-from: #2c4f7c; --tw-gradient-to: rgba(44,79,124,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-navy-500 { --tw-gradient-to: #2c4f7c; }
.tw-bg-navy-600 { background-color: #24446c !important; }
.tw-text-navy-600 { color: #24446c !important; }
.tw-border-navy-600 { border-color: #24446c !important; }
.tw-from-navy-600 { --tw-gradient-from: #24446c; --tw-gradient-to: rgba(36,68,108,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-navy-600 { --tw-gradient-to: #24446c; }
.tw-bg-navy-700 { background-color: #1e3a5f !important; }
.tw-text-navy-700 { color: #1e3a5f !important; }
.tw-border-navy-700 { border-color: #1e3a5f !important; }
.tw-from-navy-700 { --tw-gradient-from: #1e3a5f; --tw-gradient-to: rgba(30,58,95,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-navy-700 { --tw-gradient-to: #1e3a5f; }
.tw-bg-navy-800 { background-color: #18304f !important; }
.tw-text-navy-800 { color: #18304f !important; }
.tw-border-navy-800 { border-color: #18304f !important; }
.tw-from-navy-800 { --tw-gradient-from: #18304f; --tw-gradient-to: rgba(24,48,79,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-navy-800 { --tw-gradient-to: #18304f; }
.tw-bg-navy-900 { background-color: #12253d !important; }
.tw-text-navy-900 { color: #12253d !important; }
.tw-border-navy-900 { border-color: #12253d !important; }
.tw-from-navy-900 { --tw-gradient-from: #12253d; --tw-gradient-to: rgba(18,37,61,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-navy-900 { --tw-gradient-to: #12253d; }
.hover\:tw-bg-navy-600:hover { background-color: #24446c !important; }
.hover\:tw-from-navy-600:hover { --tw-gradient-from: #24446c; --tw-gradient-to: rgba(36,68,108,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:tw-to-navy-600:hover { --tw-gradient-to: #24446c; }
.hover\:tw-bg-navy-700:hover { background-color: #1e3a5f !important; }
.hover\:tw-from-navy-700:hover { --tw-gradient-from: #1e3a5f; --tw-gradient-to: rgba(30,58,95,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:tw-to-navy-700:hover { --tw-gradient-to: #1e3a5f; }

/* ---------- TEAL ---------- */
.tw-bg-teal-400 { background-color: #26a69a !important; }
.tw-text-teal-400 { color: #26a69a !important; }
.tw-border-teal-400 { border-color: #26a69a !important; }
.tw-from-teal-400 { --tw-gradient-from: #26a69a; --tw-gradient-to: rgba(38,166,154,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-teal-400 { --tw-gradient-to: #26a69a; }
.tw-bg-teal-500 { background-color: #009688 !important; }
.tw-text-teal-500 { color: #009688 !important; }
.tw-border-teal-500 { border-color: #009688 !important; }
.tw-from-teal-500 { --tw-gradient-from: #009688; --tw-gradient-to: rgba(0,150,136,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-teal-500 { --tw-gradient-to: #009688; }
.tw-bg-teal-600 { background-color: #00897b !important; }
.tw-text-teal-600 { color: #00897b !important; }
.tw-border-teal-600 { border-color: #00897b !important; }
.tw-from-teal-600 { --tw-gradient-from: #00897b; --tw-gradient-to: rgba(0,137,123,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-teal-600 { --tw-gradient-to: #00897b; }
.tw-bg-teal-700 { background-color: #00796b !important; }
.tw-text-teal-700 { color: #00796b !important; }
.tw-border-teal-700 { border-color: #00796b !important; }
.tw-from-teal-700 { --tw-gradient-from: #00796b; --tw-gradient-to: rgba(0,121,107,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-teal-700 { --tw-gradient-to: #00796b; }
.tw-bg-teal-800 { background-color: #00695c !important; }
.tw-text-teal-800 { color: #00695c !important; }
.tw-border-teal-800 { border-color: #00695c !important; }
.tw-from-teal-800 { --tw-gradient-from: #00695c; --tw-gradient-to: rgba(0,105,92,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-teal-800 { --tw-gradient-to: #00695c; }
.tw-bg-teal-900 { background-color: #004d40 !important; }
.tw-text-teal-900 { color: #004d40 !important; }
.tw-border-teal-900 { border-color: #004d40 !important; }
.tw-from-teal-900 { --tw-gradient-from: #004d40; --tw-gradient-to: rgba(0,77,64,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-teal-900 { --tw-gradient-to: #004d40; }
.hover\:tw-bg-teal-600:hover { background-color: #00897b !important; }
.hover\:tw-from-teal-600:hover { --tw-gradient-from: #00897b; --tw-gradient-to: rgba(0,137,123,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:tw-to-teal-600:hover { --tw-gradient-to: #00897b; }
.hover\:tw-bg-teal-700:hover { background-color: #00796b !important; }
.hover\:tw-from-teal-700:hover { --tw-gradient-from: #00796b; --tw-gradient-to: rgba(0,121,107,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:tw-to-teal-700:hover { --tw-gradient-to: #00796b; }

/* ---------- CARBON ---------- */
.tw-bg-carbon-400 { background-color: #64748b !important; }
.tw-text-carbon-400 { color: #64748b !important; }
.tw-border-carbon-400 { border-color: #64748b !important; }
.tw-from-carbon-400 { --tw-gradient-from: #64748b; --tw-gradient-to: rgba(100,116,139,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-carbon-400 { --tw-gradient-to: #64748b; }
.tw-bg-carbon-500 { background-color: #475569 !important; }
.tw-text-carbon-500 { color: #475569 !important; }
.tw-border-carbon-500 { border-color: #475569 !important; }
.tw-from-carbon-500 { --tw-gradient-from: #475569; --tw-gradient-to: rgba(71,85,105,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-carbon-500 { --tw-gradient-to: #475569; }
.tw-bg-carbon-600 { background-color: #3f4a5c !important; }
.tw-text-carbon-600 { color: #3f4a5c !important; }
.tw-border-carbon-600 { border-color: #3f4a5c !important; }
.tw-from-carbon-600 { --tw-gradient-from: #3f4a5c; --tw-gradient-to: rgba(63,74,92,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-carbon-600 { --tw-gradient-to: #3f4a5c; }
.tw-bg-carbon-700 { background-color: #334155 !important; }
.tw-text-carbon-700 { color: #334155 !important; }
.tw-border-carbon-700 { border-color: #334155 !important; }
.tw-from-carbon-700 { --tw-gradient-from: #334155; --tw-gradient-to: rgba(51,65,85,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-carbon-700 { --tw-gradient-to: #334155; }
.tw-bg-carbon-800 { background-color: #1e293b !important; }
.tw-text-carbon-800 { color: #1e293b !important; }
.tw-border-carbon-800 { border-color: #1e293b !important; }
.tw-from-carbon-800 { --tw-gradient-from: #1e293b; --tw-gradient-to: rgba(30,41,59,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-carbon-800 { --tw-gradient-to: #1e293b; }
.tw-bg-carbon-900 { background-color: #0f172a !important; }
.tw-text-carbon-900 { color: #0f172a !important; }
.tw-border-carbon-900 { border-color: #0f172a !important; }
.tw-from-carbon-900 { --tw-gradient-from: #0f172a; --tw-gradient-to: rgba(15,23,42,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.tw-to-carbon-900 { --tw-gradient-to: #0f172a; }
.hover\:tw-bg-carbon-600:hover { background-color: #3f4a5c !important; }
.hover\:tw-from-carbon-600:hover { --tw-gradient-from: #3f4a5c; --tw-gradient-to: rgba(63,74,92,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:tw-to-carbon-600:hover { --tw-gradient-to: #3f4a5c; }
.hover\:tw-bg-carbon-700:hover { background-color: #334155 !important; }
.hover\:tw-from-carbon-700:hover { --tw-gradient-from: #334155; --tw-gradient-to: rgba(51,65,85,0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:tw-to-carbon-700:hover { --tw-gradient-to: #334155; }

/* ============================================================
   Hoja de balance: apilar columnas en movil
   (solo aplica a pantallas angostas; en PC no cambia nada)
   ============================================================ */
@media (max-width: 767px) {
    table.table-border-center > thead > tr > th {
        display: none;
    }
    table.table-border-center > tbody > tr,
    table.table-border-center > tfoot > tr,
    table.table-border-center > tbody > tr > td,
    table.table-border-center > tfoot > tr > td {
        display: block;
        width: 100%;
    }
    table.table-border-center > tbody > tr > td:first-child::before {
        content: "Responsabilidad";
        display: block;
        font-weight: 700;
        background: #d2d6de;
        padding: 8px 12px;
    }
    table.table-border-center > tbody > tr > td:last-child::before {
        content: "Bienes";
        display: block;
        font-weight: 700;
        background: #d2d6de;
        padding: 8px 12px;
        margin-top: 10px;
    }
}

/* ---------- COLOR PREDETERMINADO DEL SISTEMA (#00438a) ----------
   Sobrescribe el azul/indigo de Tailwind que viene por defecto en
   botones y acentos de toda la aplicacion (estado normal, hover,
   active y focus), en cualquier tamano de pantalla. No requiere
   elegir un tema en Configuracion > Sistema: aplica siempre, salvo
   que el negocio tenga elegido otro tema (navy/teal/carbon/custom). */
.tw-from-indigo-500 { --tw-gradient-from: #2e659f !important; --tw-gradient-to: rgba(46,101,159,0) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.tw-from-indigo-600 { --tw-gradient-from: #00438a !important; --tw-gradient-to: rgba(0,67,138,0) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.tw-from-indigo-700 { --tw-gradient-from: #003975 !important; --tw-gradient-to: rgba(0,57,117,0) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.tw-to-blue-500 { --tw-gradient-to: #527faf !important; }
.tw-to-blue-600 { --tw-gradient-to: #1f5a98 !important; }
.tw-to-blue-700 { --tw-gradient-to: #003e7f !important; }
.tw-bg-blue-600 { background-color: #1f5a98 !important; }
.tw-bg-blue-700 { background-color: #003e7f !important; }
.tw-ring-blue-500 { --tw-ring-color: #527faf !important; }
.hover\:tw-from-indigo-600:hover { --tw-gradient-from: #00438a !important; --tw-gradient-to: rgba(0,67,138,0) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.hover\:tw-to-blue-600:hover { --tw-gradient-to: #1f5a98 !important; }
.active\:tw-from-indigo-700:active { --tw-gradient-from: #003975 !important; --tw-gradient-to: rgba(0,57,117,0) !important; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important; }
.active\:tw-to-blue-700:active { --tw-gradient-to: #003e7f !important; }
.focus\:tw-ring-blue-500:focus { --tw-ring-color: #527faf !important; }

/* ---------- Menu lateral y barra superior (skin clasico AdminLTE) ----------
   El body usa la clase "skin-blue-light" por defecto (ver layouts/app.blade.php).
   Estas reglas viven en vendor.css con colores fijos; las sobrescribimos aqui
   porque este archivo se carga despues y con !important. */
.skin-blue-light .main-header .logo,
.skin-blue-light .main-header .logo:hover,
.skin-blue-light .main-sidebar .logo,
.skin-blue-light .main-sidebar .logo:hover { background: #00438a !important; }
.skin-blue-light .main-header .navbar,
.skin-blue-light .content-wrapper .content-header-custom { background-color: #00438a !important; background-image: linear-gradient(to right, #00438a, #001429) !important; }
.skin-blue-light .main-header li.user-header { background-color: #00438a !important; }
.skin-blue-light .main-header .navbar .sidebar-toggle:hover { background-color: #003975 !important; }
.skin-blue-light .main-header .navbar .dropdown-menu li a:hover { background: #003975 !important; }
.skin-blue-light .sidebar-menu > li.active { border-left-color: #00438a !important; }