/* ======================================================
   SERVICIOS LT - TEMA CORPORATIVO SOBRIO
   Capa final de estilos. Mantiene intacta la lógica PHP.
====================================================== */

:root {
    --slt-bg: #eef1f4;
    --slt-surface: #ffffff;
    --slt-surface-soft: #f7f8fa;
    --slt-navy: #172433;
    --slt-navy-2: #223449;
    --slt-text: #1d2835;
    --slt-muted: #667382;
    --slt-border: #dbe1e7;
    --slt-accent: #c99b16;
    --slt-accent-dark: #a77c07;
    --slt-danger: #b23a3a;
    --slt-radius: 12px;
    --slt-shadow: 0 8px 24px rgba(18, 34, 51, .08);
}

html,
body {
    background: var(--slt-bg) !important;
    color: var(--slt-text) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
}

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

.navbar,
.navbar-slt,
.topbar,
header {
    background: var(--slt-navy) !important;
    border-bottom: 3px solid var(--slt-accent) !important;
    box-shadow: 0 4px 14px rgba(14, 28, 42, .16) !important;
}

.navbar-brand,
.logo,
header h1,
header .titulo {
    color: #ffffff !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.titulo,
.titulo-dashboard,
.card-title {
    color: var(--slt-navy) !important;
}

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

.card,
.card-modulo,
.card-resumen,
.card-slt,
.dashboard-card,
.panel,
.box {
    background: var(--slt-surface) !important;
    color: var(--slt-text) !important;
    border: 1px solid var(--slt-border) !important;
    border-top: 1px solid var(--slt-border) !important;
    border-radius: var(--slt-radius) !important;
    box-shadow: var(--slt-shadow) !important;
}

.card:hover,
.card-modulo:hover,
.card-resumen:hover,
.card-slt:hover,
.dashboard-card:hover,
.panel:hover,
.box:hover {
    transform: translateY(-2px) !important;
    border-color: #bac5cf !important;
    box-shadow: 0 12px 28px rgba(18, 34, 51, .12) !important;
}

.card-modulo {
    min-height: 138px !important;
    overflow: hidden !important;
}

.modulo-card-body {
    display: grid !important;
    grid-template-columns: 52px 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 22px !important;
}

.modulo-icono {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--slt-navy) !important;
    color: #ffffff !important;
    border-bottom: 3px solid var(--slt-accent);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.modulo-contenido { min-width: 0; }
.modulo-contenido .card-title { margin-bottom: 6px !important; }
.modulo-contenido .card-text { margin-bottom: 0 !important; line-height: 1.45; }
.modulo-flecha {
    color: var(--slt-accent-dark) !important;
    font-size: 1.45rem;
    transition: transform .18s ease;
}
.card-modulo:hover .modulo-flecha { transform: translateX(4px); }
.card-modulo:hover .card-title { color: var(--slt-navy) !important; }

.pill-superior {
    background: var(--slt-surface) !important;
    border: 1px solid var(--slt-border) !important;
    border-left: 4px solid var(--slt-accent) !important;
    border-radius: 10px !important;
    box-shadow: var(--slt-shadow) !important;
}

.pill-superior .label,
.pill-superior .meta { color: var(--slt-muted) !important; }
.pill-superior .valor,
.monto-principal,
.mini-item strong { color: var(--slt-navy) !important; }

.etiqueta-resumen,
.badge-slt {
    background: #edf0f3 !important;
    color: var(--slt-navy) !important;
    border: 1px solid #d5dce3 !important;
}

.btn,
button,
a.btn {
    border-radius: 8px !important;
    font-weight: 650 !important;
}

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

.btn-slt:hover,
.btn-warning:hover,
.btn-primary:hover,
.btn-success:hover {
    background: var(--slt-navy-2) !important;
    border-color: var(--slt-navy-2) !important;
    color: #ffffff !important;
}

.btn-outline-slt,
.btn-outline-warning {
    background: transparent !important;
    border: 1px solid rgba(255,255,255,.55) !important;
    color: #ffffff !important;
}

.btn-outline-slt:hover,
.btn-outline-warning:hover {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: var(--slt-navy) !important;
}

.btn-secondary {
    background: #6c7783 !important;
    border-color: #6c7783 !important;
    color: #ffffff !important;
}

.btn-danger,
.btn-outline-danger {
    background: transparent !important;
    border: 1px solid var(--slt-danger) !important;
    color: var(--slt-danger) !important;
}

.btn-danger:hover,
.btn-outline-danger:hover {
    background: var(--slt-danger) !important;
    color: #ffffff !important;
}

input,
select,
textarea,
.form-control,
.form-select {
    background: #ffffff !important;
    color: var(--slt-text) !important;
    border: 1px solid #cfd7df !important;
    border-radius: 8px !important;
}

input::placeholder,
textarea::placeholder { color: #8b96a1 !important; }

.form-control:focus,
.form-select:focus,
textarea:focus {
    border-color: #788da2 !important;
    box-shadow: 0 0 0 .2rem rgba(49, 92, 125, .14) !important;
}

.table,
table { color: var(--slt-text) !important; }
.table thead th,
table thead th {
    background: var(--slt-navy) !important;
    color: #ffffff !important;
    border-color: var(--slt-navy-2) !important;
}
.table tbody td,
table tbody td {
    background: #ffffff !important;
    color: var(--slt-text) !important;
    border-color: #e3e7eb !important;
}

.wizard-steps {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px !important;
    margin-bottom: 20px !important;
}

.wizard-step {
    position: relative;
    background: #ffffff !important;
    color: var(--slt-muted) !important;
    border: 1px solid var(--slt-border) !important;
    border-radius: 8px !important;
    padding: 12px 14px !important;
    text-align: center;
    font-weight: 650 !important;
}

.wizard-step.active {
    background: var(--slt-navy) !important;
    color: #ffffff !important;
    border-color: var(--slt-navy) !important;
    box-shadow: 0 6px 16px rgba(23, 36, 51, .16) !important;
}

.wizard-step.done {
    color: var(--slt-navy) !important;
    border-color: #aab6c2 !important;
}
.wizard-step.done::after {
    content: "✓";
    color: var(--slt-accent-dark) !important;
    margin-left: 7px;
}

.cliente-resultados,
.articulo-resultados {
    background: #ffffff !important;
    border: 1px solid var(--slt-border) !important;
    border-radius: 9px !important;
}

.cliente-item,
.articulo-item {
    border-color: #e7eaee !important;
}
.cliente-item:hover,
.articulo-item:hover { background: #f1f4f6 !important; }
.cliente-item strong,
.articulo-item strong { color: var(--slt-navy) !important; }

.cliente-seleccionado,
.articulo-seleccionado,
.resumen-box {
    background: var(--slt-surface-soft) !important;
    color: var(--slt-text) !important;
    border: 1px solid var(--slt-border) !important;
    border-radius: 10px !important;
}

.cliente-seleccionado *,
.articulo-seleccionado * { color: inherit; }
.campo-label { color: var(--slt-muted) !important; }
.campo-valor { color: var(--slt-navy) !important; }

.gp-stepper-fix { display: none !important; }
.gp-stepper-original-hidden { display: flex !important; }

@media (max-width: 768px) {
    .wizard-steps { grid-template-columns: 1fr 1fr !important; }
    .modulo-card-body { grid-template-columns: 46px 1fr auto; padding: 18px !important; }
    .modulo-icono { width: 46px; height: 46px; }
}

@media (max-width: 480px) {
    .wizard-steps { grid-template-columns: 1fr !important; }
}