/* =====================================================
   GESTIONA PYME — TEMA CORPORATIVO SOBRIO
   Base grafito y azul petróleo, con acento dorado LT.
===================================================== */

:root {
    --gp-navy-950: #101820;
    --gp-navy-900: #17232d;
    --gp-navy-800: #22313d;
    --gp-slate-700: #40515f;
    --gp-slate-500: #687985;
    --gp-slate-300: #cbd4da;
    --gp-slate-200: #dfe5e9;
    --gp-slate-100: #edf1f3;
    --gp-slate-50: #f5f7f8;
    --gp-white: #ffffff;
    --gp-accent: #d3a72f;
    --gp-accent-dark: #ad8420;
    --gp-success: #287a5a;
    --gp-danger: #b64141;
    --gp-info: #246b87;
    --gp-text: #1b2730;
    --gp-muted: #657580;
    --gp-border: #dce3e7;
    --gp-shadow-sm: 0 2px 8px rgba(16, 24, 32, .07);
    --gp-shadow: 0 10px 28px rgba(16, 24, 32, .10);
    --gp-radius: 14px;
    --gp-radius-sm: 9px;
}

html,
body {
    min-height: 100%;
    background: var(--gp-slate-50) !important;
    color: var(--gp-text) !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif !important;
}

body {
    background-image: linear-gradient(180deg, #f7f9fa 0, #f2f5f6 100%) !important;
}

a { text-decoration: none !important; }

/* Barra superior */
.navbar,
.navbar-slt {
    min-height: 64px;
    background: var(--gp-navy-950) !important;
    border-bottom: 3px solid var(--gp-accent) !important;
    box-shadow: 0 5px 18px rgba(16, 24, 32, .18) !important;
}

.navbar-brand {
    color: var(--gp-white) !important;
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    letter-spacing: .055em;
}

.navbar-brand::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-left: 8px;
    border-radius: 50%;
    background: var(--gp-accent);
    vertical-align: 2px;
}

.usuario-navbar,
.navbar .text-white { color: #dfe6ea !important; }

/* Títulos */
h1, h2, h3, h4, h5, h6,
.titulo,
.titulo-dashboard {
    color: var(--gp-navy-950) !important;
    font-weight: 750 !important;
}

.titulo-dashboard {
    font-size: clamp(2rem, 4vw, 2.65rem) !important;
    letter-spacing: -.035em;
}

.subtitulo-dashboard,
.texto-secundario,
.text-muted,
.card-text,
small { color: var(--gp-muted) !important; }

/* Botones */
.btn,
button,
a.btn {
    border-radius: var(--gp-radius-sm) !important;
    font-weight: 650 !important;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease !important;
}

.btn:hover { transform: translateY(-1px); }

.btn-slt,
.btn-primary,
.btn-success,
.btn-warning {
    background: var(--gp-navy-900) !important;
    border-color: var(--gp-navy-900) !important;
    color: var(--gp-white) !important;
}

.btn-slt:hover,
.btn-primary:hover,
.btn-success:hover,
.btn-warning:hover {
    background: var(--gp-navy-800) !important;
    border-color: var(--gp-navy-800) !important;
    color: var(--gp-white) !important;
}

.btn-outline-slt,
.navbar .btn-outline-slt {
    background: transparent !important;
    border-color: #73828d !important;
    color: #f4f7f8 !important;
}

.btn-outline-slt:hover,
.navbar .btn-outline-slt:hover {
    background: var(--gp-white) !important;
    border-color: var(--gp-white) !important;
    color: var(--gp-navy-950) !important;
}

.btn-secondary {
    background: #e9eef1 !important;
    border-color: #d6dfe4 !important;
    color: var(--gp-navy-900) !important;
}

.btn-danger,
.btn-outline-danger {
    background: transparent !important;
    border-color: #d6a1a1 !important;
    color: var(--gp-danger) !important;
}

.btn-danger:hover,
.btn-outline-danger:hover {
    background: var(--gp-danger) !important;
    border-color: var(--gp-danger) !important;
    color: var(--gp-white) !important;
}

/* Tarjetas */
.card,
.card-slt,
.card-modulo,
.card-resumen,
.panel,
.box {
    background: var(--gp-white) !important;
    border: 1px solid var(--gp-border) !important;
    border-radius: var(--gp-radius) !important;
    box-shadow: var(--gp-shadow-sm) !important;
    color: var(--gp-text) !important;
}

.card-body { padding: 1.4rem !important; }

.card-modulo {
    min-height: 166px !important;
    position: relative;
    overflow: hidden;
    border-left: 4px solid var(--gp-accent) !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.card-modulo::after {
    content: "→";
    position: absolute;
    right: 20px;
    bottom: 17px;
    color: var(--gp-slate-500);
    font-size: 1.2rem;
    transition: transform .18s ease, color .18s ease;
}

.card-modulo:hover {
    transform: translateY(-3px) !important;
    border-color: #c9d3d9 !important;
    border-left-color: var(--gp-accent) !important;
    box-shadow: var(--gp-shadow) !important;
}

.card-modulo:hover::after {
    color: var(--gp-accent-dark);
    transform: translateX(3px);
}

.module-mark {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    margin-bottom: 15px;
    border-radius: 10px;
    background: var(--gp-slate-100);
    color: var(--gp-navy-800);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .07em;
}

.card-title {
    margin-bottom: .45rem !important;
    color: var(--gp-navy-950) !important;
    font-weight: 750 !important;
}

.card-resumen { box-shadow: var(--gp-shadow-sm) !important; }

.etiqueta-resumen,
.badge-slt {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 7px !important;
    background: var(--gp-slate-100) !important;
    color: var(--gp-slate-700) !important;
    font-size: .77rem !important;
    font-weight: 750 !important;
    letter-spacing: .03em;
}

.monto-principal,
.resumen-total,
.pill-superior .valor,
.numero-estado {
    color: var(--gp-navy-950) !important;
    font-weight: 800 !important;
}

.pill-superior {
    background: var(--gp-white) !important;
    border: 1px solid var(--gp-border) !important;
    border-left: 4px solid var(--gp-accent) !important;
    border-radius: 12px !important;
    box-shadow: var(--gp-shadow-sm) !important;
}

.mini-lista { border-top-color: var(--gp-border) !important; }
.mini-item { border-bottom-color: #edf1f3 !important; }
.resumen-trabajos .bloque-estado { background: var(--gp-slate-50) !important; }

/* Formularios */
.form-label {
    color: var(--gp-slate-700) !important;
    font-size: .89rem;
    font-weight: 700 !important;
}

.form-control,
.form-select,
textarea.form-control {
    min-height: 42px;
    background: var(--gp-white) !important;
    border: 1px solid #cbd5db !important;
    border-radius: var(--gp-radius-sm) !important;
    color: var(--gp-text) !important;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus {
    border-color: #668091 !important;
    box-shadow: 0 0 0 .2rem rgba(64, 91, 109, .13) !important;
}

.form-control::placeholder { color: #96a2aa !important; }

/* Tablas */
.table-responsive {
    border: 1px solid var(--gp-border);
    border-radius: 11px;
}

.table { margin-bottom: 0 !important; color: var(--gp-text) !important; }

.table thead th,
thead th {
    background: var(--gp-navy-900) !important;
    color: var(--gp-white) !important;
    border-color: var(--gp-navy-800) !important;
    font-size: .78rem;
    font-weight: 750 !important;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.table tbody td {
    background: var(--gp-white) !important;
    border-color: #e7ecef !important;
    color: var(--gp-text) !important;
    vertical-align: middle;
}

.table-hover tbody tr:hover td { background: #f6f8f9 !important; }

/* Alertas */
.alert {
    border-radius: 10px !important;
    border-width: 1px !important;
    box-shadow: none !important;
}

.alert-info { background: #edf5f8 !important; border-color: #c8dde6 !important; color: #24556a !important; }
.alert-success { background: #edf7f2 !important; border-color: #c7e3d6 !important; color: #28654e !important; }
.alert-danger { background: #fbefef !important; border-color: #eccaca !important; color: #8f3535 !important; }
.alert-warning { background: #fbf6e8 !important; border-color: #e9dab0 !important; color: #765d1e !important; }

/* Flujo de cotización */
.wizard-steps {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px !important;
    margin-bottom: 22px !important;
}

.wizard-step {
    position: relative;
    padding: 12px 14px 12px 17px !important;
    background: var(--gp-white) !important;
    border: 1px solid var(--gp-border) !important;
    border-radius: 10px !important;
    color: var(--gp-muted) !important;
    font-size: .89rem;
    font-weight: 700 !important;
    box-shadow: var(--gp-shadow-sm);
}

.wizard-step::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 3px;
    background: #d5dde2;
}

.wizard-step.done { color: var(--gp-slate-700) !important; }
.wizard-step.done::before { background: var(--gp-success); }

.wizard-step.active {
    background: var(--gp-navy-900) !important;
    border-color: var(--gp-navy-900) !important;
    color: var(--gp-white) !important;
}

.wizard-step.active::before { background: var(--gp-accent); }

.cliente-resultados,
.articulo-resultados {
    border-color: var(--gp-border) !important;
    border-radius: 10px !important;
    box-shadow: inset 0 1px 2px rgba(16, 24, 32, .03);
}

.cliente-item,
.articulo-item { border-bottom-color: #edf1f3 !important; }

.cliente-item:hover,
.articulo-item:hover { background: #f2f6f7 !important; }

.cliente-seleccionado,
.articulo-seleccionado,
.resumen-box {
    background: var(--gp-slate-50) !important;
    border: 1px solid var(--gp-border) !important;
    border-radius: 11px !important;
}

.campo-label { color: var(--gp-muted) !important; }
.campo-valor { color: var(--gp-text) !important; }

/* Acceso */
.card-login {
    background: var(--gp-white) !important;
    border: 1px solid var(--gp-border) !important;
    border-top: 4px solid var(--gp-accent) !important;
    box-shadow: var(--gp-shadow) !important;
}

.card-login .titulo-sistema { color: var(--gp-navy-950) !important; }
.card-login .subtitulo-sistema { color: var(--gp-muted) !important; }
.card-login .form-label { color: var(--gp-slate-700) !important; }

/* Pie */
footer {
    background: transparent !important;
    color: var(--gp-muted) !important;
    border-top: 1px solid var(--gp-border) !important;
}

@media (max-width: 991.98px) {
    .navbar .container-fluid { gap: 10px; }
    .navbar .d-flex { flex-wrap: wrap; justify-content: flex-end; }
    .wizard-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .container-fluid.py-4.px-4 {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .navbar-brand { font-size: .95rem !important; }
    .navbar .text-white,
    .usuario-navbar { display: none !important; }
    .navbar .btn { padding: .35rem .55rem !important; font-size: .75rem !important; }
    .wizard-steps { grid-template-columns: 1fr; }
    .wizard-step { padding: 10px 12px 10px 16px !important; }
    .card-body { padding: 1rem !important; }
    .card-modulo { min-height: 145px !important; }
}

@media print {
    .navbar, footer, .no-print { display: none !important; }
    body { background: #fff !important; }
    .card { box-shadow: none !important; }
}

/* === ESTILO FONDO MODULOS V9 - INICIO === */

html,
body {
    min-height: 100%;
}

body {
    background:
        linear-gradient(
            rgba(235, 241, 245, 0.74),
            rgba(220, 229, 235, 0.68)
        ),
        url("../img/fondo.jpg") center center / cover fixed no-repeat !important;

    color: #25313b !important;
}

body::before {
    content: none !important;
}

/* BARRA SUPERIOR */

.navbar,
.navbar-slt {
    min-height: 68px !important;
    background:
        linear-gradient(
            135deg,
            rgba(31, 44, 55, 0.97),
            rgba(94, 112, 126, 0.94)
        ) !important;

    border-bottom: 1px solid rgba(255, 255, 255, 0.35) !important;
    box-shadow: 0 5px 18px rgba(20, 31, 40, 0.28) !important;
}

.navbar-brand {
    color: #ffffff !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
}

.navbar-brand::after {
    background: #ffffff !important;
}

.navbar .text-white,
.navbar .usuario-navbar {
    color: #ffffff !important;
}

.navbar .btn-outline-slt {
    background: rgba(255, 255, 255, 0.92) !important;
    color: #263640 !important;
    border: 1px solid rgba(255, 255, 255, 0.95) !important;
}

.navbar .btn-outline-slt:hover {
    background: #ffffff !important;
    color: #1677d2 !important;
}

/* ENCABEZADO DEL PANEL */

.titulo-dashboard {
    color: #20303c !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
}

.subtitulo-dashboard {
    color: #44545f !important;
    font-weight: 600 !important;
}

/* TARJETAS DE LOS MÓDULOS */

.card-modulo {
    min-height: 132px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.78) !important;
    border-left: none !important;
    border-radius: 7px !important;
    box-shadow: 0 8px 22px rgba(18, 30, 39, 0.22) !important;
    color: #ffffff !important;
    position: relative !important;
}

.card-modulo .card-body {
    position: relative;
    z-index: 2;
    padding: 42px 22px 20px !important;
}

.card-modulo .card-body::before {
    content: "Módulo";
    position: absolute;
    top: 13px;
    left: 22px;
    font-size: 0.73rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.87);
}

.card-modulo .card-title {
    color: #ffffff !important;
    font-size: 1.08rem !important;
    font-weight: 750 !important;
    margin-bottom: 7px !important;
}

.card-modulo .card-text {
    color: rgba(255, 255, 255, 0.86) !important;
    font-size: 0.9rem;
    padding-right: 42px;
}

.card-modulo::after {
    content: "›" !important;
    position: absolute !important;
    right: 19px !important;
    bottom: 14px !important;
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 1.8rem !important;
    font-weight: 300;
}

.card-modulo:hover {
    transform: translateY(-4px) !important;
    border-color: #ffffff !important;
    box-shadow: 0 13px 30px rgba(18, 30, 39, 0.30) !important;
    filter: brightness(1.06);
}

/* COLORES POR MÓDULO */

.col-xl-7 > .row > .col-md-6:nth-child(1) .card-modulo {
    background: linear-gradient(135deg, #1576d4, #0c5cb6) !important;
}

.col-xl-7 > .row > .col-md-6:nth-child(2) .card-modulo {
    background: linear-gradient(135deg, #2585df, #1367bd) !important;
}

.col-xl-7 > .row > .col-md-6:nth-child(3) .card-modulo {
    background: linear-gradient(135deg, #24a957, #168641) !important;
}

.col-xl-7 > .row > .col-md-6:nth-child(4) .card-modulo {
    background: linear-gradient(135deg, #df3e4e, #bd2838) !important;
}

.col-xl-7 > .row > .col-md-6:nth-child(5) .card-modulo {
    background: linear-gradient(135deg, #374550, #27343e) !important;
}

.col-xl-7 > .row > .col-md-6:nth-child(6) .card-modulo {
    background: linear-gradient(135deg, #138d7a, #087363) !important;
}

/* OCULTAR LAS SIGLAS CL, AR, CT, ETC. */

.module-mark {
    position: absolute !important;
    right: 20px !important;
    top: 18px !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.25) !important;
    font-size: 2.3rem !important;
    font-weight: 900 !important;
}

/* RESÚMENES */

.card-resumen,
.pill-superior {
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(9px);
    box-shadow: 0 8px 24px rgba(20, 31, 40, 0.20) !important;
}

.pill-superior {
    border-left: 5px solid #1677d2 !important;
}

.etiqueta-resumen,
.badge-slt {
    background: #e9f2fa !important;
    color: #135b91 !important;
}

.monto-principal,
.pill-superior .valor {
    color: #20303c !important;
}

/* MÓDULOS INTERNOS */

.card:not(.card-modulo):not(.card-resumen),
.card-slt,
.panel,
.box {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(8px);
}

.wizard-step {
    background: rgba(255, 255, 255, 0.94) !important;
}

.wizard-step.active {
    background: #176fba !important;
    border-color: #176fba !important;
    color: #ffffff !important;
}

.wizard-step.active::before {
    background: #ffffff !important;
}

.btn-slt,
.btn-primary,
.btn-success,
.btn-warning {
    background: #176fba !important;
    border-color: #176fba !important;
    color: #ffffff !important;
}

.btn-slt:hover,
.btn-primary:hover,
.btn-success:hover,
.btn-warning:hover {
    background: #105b9a !important;
    border-color: #105b9a !important;
}

/* RESPONSIVE */

@media (max-width: 768px) {
    body {
        background-attachment: scroll !important;
    }

    .card-modulo {
        min-height: 122px !important;
    }

    .card-modulo .card-body {
        padding: 39px 17px 17px !important;
    }

    .card-modulo .card-body::before {
        left: 17px;
    }
}

/* === ESTILO FONDO MODULOS V9 - FIN === */

/* === CORRECCION TARJETAS Y TILDES V10 === */

.card-modulo .card-body::before {
    content: none !important;
    display: none !important;
}

.card-modulo .card-body {
    padding: 25px 22px 20px !important;
}

.card-modulo .card-title {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    .card-modulo .card-body {
        padding: 22px 17px 17px !important;
    }
}

/* === FIN CORRECCION V10 === */

/* === FONDO VISIBLE V11 === */

body {
    background-image: url("../img/fondo.jpg") !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

body::before,
body::after {
    content: none !important;
    display: none !important;
}

.titulo-dashboard,
.subtitulo-dashboard {
    text-shadow:
        0 1px 2px rgba(255, 255, 255, 0.95),
        0 0 8px rgba(255, 255, 255, 0.75) !important;
}

/* === FIN FONDO VISIBLE V11 === */
/* AJUSTE TARJETA BASE DE DATOS */
.card-modulo.card-base-datos {
    background: linear-gradient(135deg, #243746 0%, #176b78 100%) !important;
    border: 1px solid rgba(255, 255, 255, .42) !important;
    border-left: 4px solid #8fc7d0 !important;
    box-shadow: 0 8px 22px rgba(16, 35, 45, .22) !important;
}

.card-modulo.card-base-datos .card-title,
.card-modulo.card-base-datos .card-text,
.card-modulo.card-base-datos::after {
    color: #ffffff !important;
}

.card-modulo.card-base-datos .module-mark {
    background: rgba(255, 255, 255, .18) !important;
    color: #ffffff !important;
}

.card-modulo.card-base-datos:hover {
    background: linear-gradient(135deg, #1d303e 0%, #125e69 100%) !important;
    border-color: rgba(255, 255, 255, .62) !important;
}