/*!
 * MunFactu Premium Theme v2
 * Copyright (C) 2025 MunFactu <soporte@munfactu.com>
 */

/* =========================================================
   1. VARIABLES PREMIUM
   ========================================================= */
:root {
    /* Índigo – acción principal */
    --mf-primary:           #4F46E5;
    --mf-primary-dark:      #3730A3;
    --mf-primary-light:     #818CF8;
    --mf-primary-xlight:    #EEF2FF;
    --mf-primary-rgb:       79, 70, 229;

    /* Slate – secundario */
    --mf-secondary:         #475569;
    --mf-secondary-dark:    #334155;
    --mf-secondary-light:   #94A3B8;
    --mf-secondary-xlight:  #F1F5F9;
    --mf-secondary-rgb:     71, 85, 105;

    /* Esmeralda – NUEVO / SUCCESS */
    --mf-success:           #5B5FEF;
    --mf-success-dark:      #4547C2;
    --mf-success-light:     #8B8FF5;
    --mf-success-xlight:    #EEEFFE;
    --mf-success-rgb:       91, 95, 239;

    /* Ámbar – WARNING */
    --mf-warning:           #D97706;
    --mf-warning-dark:      #B45309;
    --mf-warning-light:     #FCD34D;
    --mf-warning-xlight:    #FFFBEB;
    --mf-warning-rgb:       217, 119, 6;

    /* Rosa/Rojo – BORRAR / DANGER */
    --mf-danger:            #6B7280;
    --mf-danger-dark:       #4B5563;
    --mf-danger-light:      #9CA3AF;
    --mf-danger-xlight:     #F3F4F6;
    --mf-danger-rgb:        107, 114, 128;

    /* Cian – INFO */
    --mf-info:              #0891B2;
    --mf-info-dark:         #0E7490;
    --mf-info-light:        #22D3EE;
    --mf-info-xlight:       #ECFEFF;
    --mf-info-rgb:          8, 145, 178;

    /* Violeta – acento especial */
    --mf-accent:            #7C3AED;
    --mf-accent-dark:       #6D28D9;
    --mf-accent-xlight:     #F5F3FF;

    /* Superficie */
    --mf-bg:                #F8FAFC;
    --mf-surface:           #FFFFFF;
    --mf-border:            #E2E8F0;
    --mf-border-light:      #F1F5F9;

    /* Texto */
    --mf-text:              #0F172A;
    --mf-text-secondary:    #475569;
    --mf-text-muted:        #94A3B8;
    --mf-text-white:        #FFFFFF;

    /* Radios */
    --mf-r-xs:   4px;
    --mf-r-sm:   7px;
    --mf-r:      11px;
    --mf-r-lg:   16px;
    --mf-r-xl:   22px;
    --mf-r-full: 999px;

    /* Sombras */
    --mf-s-xs:  0 1px 2px rgba(15,23,42,.06);
    --mf-s-sm:  0 1px 3px rgba(15,23,42,.08), 0 1px 2px rgba(15,23,42,.05);
    --mf-s:     0 4px 6px -1px rgba(15,23,42,.08), 0 2px 4px -2px rgba(15,23,42,.05);
    --mf-s-md:  0 10px 15px -3px rgba(15,23,42,.08), 0 4px 6px -4px rgba(15,23,42,.04);
    --mf-s-lg:  0 20px 25px -5px rgba(15,23,42,.07), 0 8px 10px -6px rgba(15,23,42,.04);

    /* Gradientes */
    --mf-g-nav:     linear-gradient(135deg, #1E1B4B 0%, #312E81 40%, #4F46E5 100%);
    --mf-g-primary: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    --mf-g-success: linear-gradient(135deg, #4547C2 0%, #5B5FEF 60%, #7B7FF5 100%);
    --mf-g-danger:  linear-gradient(135deg, #4B5563 0%, #6B7280 60%, #9CA3AF 100%);
    --mf-g-warning: linear-gradient(135deg, #B45309 0%, #D97706 60%, #F59E0B 100%);
    --mf-g-info:    linear-gradient(135deg, #0E7490 0%, #0891B2 60%, #06B6D4 100%);
    --mf-g-accent:  linear-gradient(135deg, #6D28D9 0%, #7C3AED 60%, #8B5CF6 100%);
    --mf-g-secondary:linear-gradient(135deg, #334155 0%, #475569 60%, #64748B 100%);

    /* Transiciones */
    --mf-t:    all .18s cubic-bezier(.4,0,.2,1);
    --mf-t-f:  all .12s cubic-bezier(.4,0,.2,1);

    /* Override Bootstrap 5 */
    --bs-primary:        #4F46E5;
    --bs-primary-rgb:    79, 70, 229;
    --bs-secondary:      #475569;
    --bs-success:        #059669;
    --bs-warning:        #D97706;
    --bs-danger:         #E11D48;
    --bs-info:           #0891B2;
    --bs-body-bg:        #F8FAFC;
    --bs-body-color:     #0F172A;
    --bs-border-color:   #E2E8F0;
    --bs-link-color:     #4F46E5;
    --bs-link-hover-color: #3730A3;
}

/* =========================================================
   2. TIPOGRAFÍA BASE
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    background: var(--mf-bg);
    color: var(--mf-text);
    font-size: .89rem;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

h1,h2,h3,h4,h5,h6 {
    font-weight: 700;
    color: var(--mf-text);
    letter-spacing: -.022em;
    line-height: 1.3;
}

a { color: var(--mf-primary); text-decoration: none; transition: var(--mf-t-f); }
a:hover { color: var(--mf-primary-dark); }
strong, b { font-weight: 600; }

/* =========================================================
   3. NAVBAR PREMIUM
   ========================================================= */
.navbar.bg-primary,
.navbar.navbar-dark.bg-primary {
    background: var(--mf-g-nav) !important;
    box-shadow: 0 2px 16px rgba(79,70,229,.28), 0 1px 0 rgba(255,255,255,.06) inset;
    border-bottom: none;
    padding: .48rem 1.25rem;
    min-height: 54px;
}

.navbar-brand {
    font-weight: 800;
    font-size: .95rem;
    letter-spacing: -.01em;
    color: #fff !important;
    transition: var(--mf-t);
}
.navbar-brand:hover { opacity: .85; transform: translateY(-1px); }

.navbar .nav-link {
    color: rgba(255,255,255,.78) !important;
    font-weight: 500;
    font-size: .81rem;
    padding: .42rem .72rem !important;
    border-radius: var(--mf-r-sm);
    transition: var(--mf-t);
}
.navbar .nav-link:hover,
.navbar .nav-link.active,
.navbar .nav-item.show .nav-link {
    color: #fff !important;
    background: rgba(255,255,255,.12);
}

.navbar .dropdown-menu {
    background: var(--mf-surface);
    border: 1px solid var(--mf-border);
    border-radius: var(--mf-r);
    box-shadow: var(--mf-s-md);
    padding: .4rem;
    margin-top: 8px !important;
    animation: mf-drop .15s ease;
}
.navbar .dropdown-item {
    font-size: .845rem; font-weight: 500;
    color: var(--mf-text); padding: .48rem .85rem;
    border-radius: var(--mf-r-sm); transition: var(--mf-t-f);
}
.navbar .dropdown-item:hover { background: var(--mf-primary-xlight); color: var(--mf-primary); }
.navbar .dropdown-divider { border-color: var(--mf-border); margin: .3rem .4rem; }
.navbar .dropdown-toggle::after { display: none; }

.pace .pace-progress {
    background: linear-gradient(90deg, #C7D2FE, #818CF8, #4F46E5);
    height: 3px;
    box-shadow: 0 0 14px rgba(79,70,229,.55);
}

/* =========================================================
   4. ★ BOTONES PREMIUM – NUEVO Y BORRAR MEJORADOS ★
   ========================================================= */

/* — Base — */
.btn {
    font-family: 'Inter', system-ui, sans-serif;
    font-weight: 600;
    font-size: .825rem;
    letter-spacing: .012em;
    border-radius: var(--mf-r-sm);
    padding: .44rem 1.05rem;
    border: none;
    white-space: nowrap;
    transition: var(--mf-t);
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    cursor: pointer;
    user-select: none;
}
.btn:focus { outline: none; }
.btn:focus-visible {
    box-shadow: 0 0 0 3px rgba(var(--mf-primary-rgb), .28) !important;
}
.btn-sm { padding: .3rem .75rem; font-size: .775rem; }
.btn-lg { padding: .62rem 1.6rem; font-size: .94rem; border-radius: var(--mf-r); }

/* — PRIMARY – Acción principal — */
.btn-primary {
    background: var(--mf-g-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--mf-primary-rgb),.38), 0 1px 0 rgba(255,255,255,.12) inset;
}
.btn-primary:hover, .btn-primary:focus {
    background: linear-gradient(135deg, var(--mf-primary-dark) 0%, var(--mf-primary) 100%);
    color: #fff;
    box-shadow: 0 5px 16px rgba(var(--mf-primary-rgb),.45);
    transform: translateY(-1px);
}
.btn-primary:active { transform: translateY(0); box-shadow: 0 2px 6px rgba(var(--mf-primary-rgb),.3); }

/* ★★ SUCCESS / NUEVO – Verde Esmeralda profundo ★★ */
.btn-success {
    background: var(--mf-g-success);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--mf-success-rgb),.40), 0 1px 0 rgba(255,255,255,.12) inset;
}
.btn-success:hover, .btn-success:focus {
    background: linear-gradient(135deg, #3A3BA0 0%, #4547C2 50%, #5B5FEF 100%);
    color: #fff;
    box-shadow: 0 5px 16px rgba(var(--mf-success-rgb),.48);
    transform: translateY(-1px);
}
.btn-success:active { transform: translateY(0); box-shadow: 0 2px 6px rgba(var(--mf-success-rgb),.32); }

/* ★★ DANGER / BORRAR – Rosa carmesí impactante ★★ */
.btn-danger {
    background: var(--mf-g-danger);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--mf-danger-rgb),.40), 0 1px 0 rgba(255,255,255,.12) inset;
}
.btn-danger:hover, .btn-danger:focus {
    background: linear-gradient(135deg, #374151 0%, #4B5563 50%, #6B7280 100%);
    color: #fff;
    box-shadow: 0 5px 18px rgba(var(--mf-danger-rgb),.50);
    transform: translateY(-1px);
}
.btn-danger:active { transform: translateY(0); box-shadow: 0 2px 6px rgba(var(--mf-danger-rgb),.32); }

/* — SECONDARY — */
.btn-secondary {
    background: var(--mf-g-secondary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--mf-secondary-rgb),.28);
}
.btn-secondary:hover, .btn-secondary:focus {
    background: linear-gradient(135deg, #1E293B 0%, #334155 100%);
    color: #fff;
    box-shadow: 0 5px 14px rgba(var(--mf-secondary-rgb),.36);
    transform: translateY(-1px);
}
.btn-secondary:active { transform: translateY(0); }

/* — WARNING — */
.btn-warning {
    background: var(--mf-g-warning);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--mf-warning-rgb),.38);
}
.btn-warning:hover, .btn-warning:focus {
    background: linear-gradient(135deg, #92400E 0%, #B45309 50%, #D97706 100%);
    color: #fff;
    box-shadow: 0 5px 16px rgba(var(--mf-warning-rgb),.46);
    transform: translateY(-1px);
}

/* — INFO — */
.btn-info {
    background: var(--mf-g-info);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--mf-info-rgb),.35);
}
.btn-info:hover, .btn-info:focus {
    background: linear-gradient(135deg, #164E63 0%, #0E7490 50%, #0891B2 100%);
    color: #fff;
    box-shadow: 0 5px 16px rgba(var(--mf-info-rgb),.42);
    transform: translateY(-1px);
}

/* — LIGHT — */
.btn-light {
    background: #fff;
    color: var(--mf-text);
    border: 1.5px solid var(--mf-border) !important;
    box-shadow: var(--mf-s-xs);
}
.btn-light:hover {
    background: var(--mf-border-light);
    border-color: #CBD5E1 !important;
    color: var(--mf-text);
    box-shadow: var(--mf-s-sm);
}

/* — DARK — */
.btn-dark {
    background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
    color: #fff;
    box-shadow: 0 2px 6px rgba(15,23,42,.35);
}
.btn-dark:hover { background: #0F172A; color: #fff; transform: translateY(-1px); }

/* ★★ OUTLINE VARIANTS – Con glow en hover ★★ */
.btn-outline-primary {
    color: var(--mf-primary);
    border: 1.5px solid var(--mf-primary) !important;
    background: transparent;
}
.btn-outline-primary:hover {
    background: var(--mf-g-primary);
    border-color: var(--mf-primary) !important;
    color: #fff;
    box-shadow: 0 4px 14px rgba(var(--mf-primary-rgb),.35);
    transform: translateY(-1px);
}

/* ★★ OUTLINE DANGER / BORRAR ★★ */
.btn-outline-danger {
    color: var(--mf-danger);
    border: 1.5px solid var(--mf-danger) !important;
    background: transparent;
}
.btn-outline-danger:hover {
    background: var(--mf-g-danger);
    border-color: var(--mf-danger) !important;
    color: #fff;
    box-shadow: 0 4px 14px rgba(var(--mf-danger-rgb),.38);
    transform: translateY(-1px);
}

/* ★★ OUTLINE SUCCESS / NUEVO ★★ */
.btn-outline-success {
    color: var(--mf-success);
    border: 1.5px solid var(--mf-success) !important;
    background: transparent;
}
.btn-outline-success:hover {
    background: var(--mf-g-success);
    border-color: var(--mf-success) !important;
    color: #fff;
    box-shadow: 0 4px 14px rgba(var(--mf-success-rgb),.38);
    transform: translateY(-1px);
}

.btn-outline-secondary {
    color: var(--mf-secondary);
    border: 1.5px solid var(--mf-border) !important;
    background: #fff;
}
.btn-outline-secondary:hover {
    background: var(--mf-g-secondary);
    border-color: var(--mf-secondary) !important;
    color: #fff;
    transform: translateY(-1px);
}

.btn-outline-warning {
    color: var(--mf-warning-dark);
    border: 1.5px solid var(--mf-warning) !important;
    background: transparent;
}
.btn-outline-warning:hover {
    background: var(--mf-g-warning);
    border-color: var(--mf-warning) !important;
    color: #fff;
    transform: translateY(-1px);
}

.btn-outline-info {
    color: var(--mf-info);
    border: 1.5px solid var(--mf-info) !important;
    background: transparent;
}
.btn-outline-info:hover {
    background: var(--mf-g-info);
    color: #fff;
    transform: translateY(-1px);
}

.btn-outline-dark {
    color: var(--mf-text);
    border: 1.5px solid #334155 !important;
    background: transparent;
}
.btn-outline-dark:hover {
    background: linear-gradient(135deg, #0F172A, #1E293B);
    color: #fff;
    transform: translateY(-1px);
}

.btn-link {
    color: var(--mf-primary); font-weight: 600;
    text-decoration: none; padding-left: .3rem; padding-right: .3rem;
    background: none; border: none;
}
.btn-link:hover { color: var(--mf-primary-dark); background: var(--mf-primary-xlight); border-radius: var(--mf-r-xs); }

/* Grupos de botones */
.btn-group > .btn { border-radius: 0; }
.btn-group > .btn:first-child { border-radius: var(--mf-r-sm) 0 0 var(--mf-r-sm); }
.btn-group > .btn:last-child  { border-radius: 0 var(--mf-r-sm) var(--mf-r-sm) 0; }

/* =========================================================
   5. CARDS
   ========================================================= */
.card {
    background: var(--mf-surface);
    border: 1px solid var(--mf-border);
    border-radius: var(--mf-r-lg);
    box-shadow: var(--mf-s-sm);
    overflow: hidden;
    transition: box-shadow .22s ease, transform .22s ease;
    animation: mf-up .22s ease;
}
.card:hover { box-shadow: var(--mf-s); }
.shadow   { box-shadow: var(--mf-s)    !important; }
.shadow-sm{ box-shadow: var(--mf-s-sm) !important; }
.shadow-lg{ box-shadow: var(--mf-s-lg) !important; }

.card-header {
    background: linear-gradient(135deg, #FAFBFC 0%, #F1F5F9 100%);
    border-bottom: 1px solid var(--mf-border);
    padding: .88rem 1.3rem;
    font-weight: 700; font-size: .9rem;
    color: var(--mf-text); letter-spacing: -.01em;
}
.card-header h3,.card-header h4,.card-header h5 { margin-bottom:0; font-size:inherit; font-weight:700; }
.card-header > i, .card-header .fa-solid, .card-header .fa-brands { color: var(--mf-primary); margin-right: .45rem; }

.card-body { padding: 1.3rem; }
.card-footer {
    background: #F8FAFC; border-top: 1px solid var(--mf-border);
    padding: .75rem 1.3rem; font-size: .85rem; color: var(--mf-text-secondary);
}

/* Borde lateral de color */
.border-left-primary { border-left: 4px solid var(--mf-primary) !important; }
.border-left-success { border-left: 4px solid var(--mf-success) !important; }
.border-left-warning { border-left: 4px solid var(--mf-warning) !important; }
.border-left-danger  { border-left: 4px solid var(--mf-danger)  !important; }
.border-left-info    { border-left: 4px solid var(--mf-info)    !important; }

/* =========================================================
   6. TABLAS
   ========================================================= */
.table { color: var(--mf-text); font-size: .848rem; border-color: var(--mf-border); margin-bottom:0; }

.table thead th,
.table > thead > tr > th {
    background: linear-gradient(180deg, #F8FAFC 0%, #EEF2F7 100%);
    color: var(--mf-text-secondary);
    font-weight: 700; font-size: .765rem; letter-spacing: .045em; text-transform: uppercase;
    border-bottom: 2px solid var(--mf-border); border-top: none;
    padding: .72rem 1rem; white-space: nowrap;
}

.table tbody tr { border-bottom: 1px solid var(--mf-border-light); transition: background .1s ease; }
.table tbody tr:last-child { border-bottom: none; }
.table tbody td { padding: .62rem 1rem; vertical-align: middle; border-color: var(--mf-border-light); }

.table-hover tbody tr:hover,
.clickableRow:hover,
.clickableListRow:hover {
    background: linear-gradient(90deg, rgba(var(--mf-primary-rgb),.05) 0%, rgba(var(--mf-primary-rgb),.02) 100%) !important;
    cursor: pointer;
}
.table-striped > tbody > tr:nth-of-type(odd) { background-color: rgba(248,250,252,.6); }
.table-responsive { border-radius: 0 0 var(--mf-r-lg) var(--mf-r-lg); overflow-x: auto; }

/* Estados de fila */
.table-success,  .table-success  td, .table-success  th { background-color: var(--mf-success-xlight) !important; color: #065F46; }
.table-warning,  .table-warning  td, .table-warning  th { background-color: var(--mf-warning-xlight) !important; color: #92400E; }
.table-danger,   .table-danger   td, .table-danger   th { background-color: var(--mf-danger-xlight)  !important; color: #374151; }
.table-info,     .table-info     td, .table-info     th { background-color: var(--mf-info-xlight)    !important; color: #164E63; }
.table-secondary,.table-secondary td,.table-secondary th { background-color: var(--mf-secondary-xlight) !important; color: var(--mf-text-secondary); }

/* =========================================================
   7. FORMULARIOS
   ========================================================= */
.form-control, .form-select {
    border: 1.5px solid var(--mf-border);
    border-radius: var(--mf-r-sm);
    padding: .45rem .88rem;
    font-size: .875rem; color: var(--mf-text);
    background: var(--mf-surface);
    transition: var(--mf-t); box-shadow: var(--mf-s-xs); line-height: 1.5;
}
.form-control:hover, .form-select:hover { border-color: #CBD5E1; }
.form-control:focus, .form-select:focus {
    border-color: var(--mf-primary-light);
    box-shadow: 0 0 0 3px rgba(var(--mf-primary-rgb),.16);
    outline: none;
}
.form-control::placeholder { color: var(--mf-text-muted); font-size: .855rem; }
.form-control[readonly], .form-select[readonly] {
    background: #F8FAFC; opacity: 1;
    border-color: var(--mf-border-light); color: var(--mf-text-secondary);
}
.form-control:disabled, .form-select:disabled {
    background: #F1F5F9; color: var(--mf-text-muted); border-color: var(--mf-border-light);
}

/* Requeridos – acento índigo sutil */
input[required].form-control:not(:read-only),
textarea[required].form-control:not(:read-only) {
    background-image: linear-gradient(to bottom, rgba(var(--mf-primary-rgb),.055), rgba(var(--mf-primary-rgb),.02));
    border-left: 3px solid rgba(var(--mf-primary-rgb),.45);
}
select[required].form-control:not(:disabled),
select[required].form-select:not(:disabled) {
    background-image: linear-gradient(to bottom, rgba(var(--mf-primary-rgb),.055), rgba(var(--mf-primary-rgb),.02));
    border-left: 3px solid rgba(var(--mf-primary-rgb),.45);
}
select[required].form-select.select2 + .select2-container--bootstrap-5 .select2-selection {
    box-shadow: 0 0 0 3px rgba(var(--mf-primary-rgb),.14) !important;
    border-left: 3px solid rgba(var(--mf-primary-rgb),.45) !important;
}

.form-label, label {
    font-weight: 600; font-size: .8rem;
    color: var(--mf-text-secondary);
    letter-spacing: .024em; text-transform: uppercase;
    margin-bottom: .33rem;
}

.input-group-text {
    background: linear-gradient(180deg, #F8FAFC, #EEF2F7);
    border: 1.5px solid var(--mf-border);
    color: var(--mf-text-secondary); font-size: .875rem; transition: var(--mf-t-f);
}
.input-group:focus-within .input-group-text { border-color: var(--mf-primary-light); color: var(--mf-primary); }
.input-group .form-control:not(:first-child) { border-left: none; }
.input-group .form-control:first-child:not(:last-child) { border-right: none; }

.form-check-input {
    width: 1.1em; height: 1.1em;
    border: 1.5px solid #CBD5E1; cursor: pointer; transition: var(--mf-t-f);
}
.form-check-input:checked { background-color: var(--mf-primary); border-color: var(--mf-primary); }
.form-check-input:focus { box-shadow: 0 0 0 3px rgba(var(--mf-primary-rgb),.22); border-color: var(--mf-primary); }
.form-check-label { cursor: pointer; font-size: .875rem; font-weight: 500; color: var(--mf-text); text-transform: none; letter-spacing: 0; }

/* =========================================================
   8. BADGES
   ========================================================= */
.badge { font-weight: 600; font-size: .68rem; letter-spacing: .04em; padding: .3em .72em; border-radius: var(--mf-r-full); }
.bg-primary  { background: var(--mf-g-primary)   !important; }
.bg-secondary{ background: var(--mf-g-secondary) !important; }
.bg-success  { background: var(--mf-g-success)   !important; }
.bg-warning  { background: var(--mf-g-warning)   !important; color:#fff !important; }
.bg-danger   { background: var(--mf-g-danger)    !important; }
.bg-info     { background: var(--mf-g-info)      !important; }
.bg-light    { background: #F1F5F9 !important; color: var(--mf-text-secondary) !important; }
.bg-dark     { background: linear-gradient(135deg,#0F172A,#1E293B) !important; }

/* =========================================================
   9. ALERTAS
   ========================================================= */
.alert {
    border: none; border-radius: var(--mf-r); padding: .9rem 1.2rem;
    font-size: .875rem; font-weight: 500;
    border-left: 4px solid transparent; box-shadow: var(--mf-s-sm);
}
.alert-success { background: var(--mf-success-xlight); color: #065F46; border-left-color: var(--mf-success); }
.alert-warning { background: var(--mf-warning-xlight); color: #92400E; border-left-color: var(--mf-warning); }
.alert-danger  { background: var(--mf-danger-xlight);  color: #374151; border-left-color: var(--mf-danger);  }
.alert-info    { background: var(--mf-info-xlight);    color: #164E63; border-left-color: var(--mf-info);    }
.alert-primary { background: var(--mf-primary-xlight); color: var(--mf-primary-dark); border-left-color: var(--mf-primary); }

/* =========================================================
   10. PAGINACIÓN
   ========================================================= */
.pagination { gap: 3px; }
.page-link {
    border: 1.5px solid var(--mf-border); border-radius: var(--mf-r-sm) !important;
    color: var(--mf-primary); font-weight: 600; font-size: .81rem;
    padding: .38rem .72rem; transition: var(--mf-t); background: var(--mf-surface);
}
.page-link:hover {
    background: var(--mf-primary-xlight); border-color: var(--mf-primary-light);
    color: var(--mf-primary-dark); transform: translateY(-1px);
}
.page-item.active .page-link {
    background: var(--mf-g-primary); border-color: var(--mf-primary); color: #fff;
    box-shadow: 0 2px 8px rgba(var(--mf-primary-rgb),.35);
}
.page-item.disabled .page-link { color: var(--mf-text-muted); background: #F8FAFC; border-color: var(--mf-border-light); }

/* =========================================================
   11. BREADCRUMB
   ========================================================= */
.breadcrumb { background: transparent; padding: 0; margin: 0; font-size: .79rem; }
.breadcrumb-item a { color: var(--mf-primary); font-weight: 500; }
.breadcrumb-item.active { color: var(--mf-text-muted); font-weight: 600; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--mf-text-muted); }
h1 .fa-solid, h2 .fa-solid, h3 .fa-solid, h1 .fa-brands { color: var(--mf-primary); margin-right: .45rem; }

/* =========================================================
   12. DROPDOWN
   ========================================================= */
.dropdown-menu {
    border: 1px solid var(--mf-border); border-radius: var(--mf-r);
    box-shadow: var(--mf-s-md); padding: .4rem;
    animation: mf-drop .15s ease; position: absolute !important;
}
.dropdown-item {
    font-size: .845rem; font-weight: 500; color: var(--mf-text);
    padding: .48rem .85rem; border-radius: var(--mf-r-sm); transition: var(--mf-t-f);
}
.dropdown-item:hover, .dropdown-item:focus { background: var(--mf-primary-xlight); color: var(--mf-primary); }
.dropdown-item.active, .dropdown-item:active { background: var(--mf-g-primary); color: #fff; }
.dropdown-item .fa-solid,.dropdown-item .fa-brands { width:18px; color:var(--mf-text-muted); transition: var(--mf-t-f); }
.dropdown-item:hover .fa-solid,.dropdown-item:hover .fa-brands { color: var(--mf-primary); }
.dropdown-header { font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--mf-text-muted); padding:.5rem .85rem .3rem; }
.dropdown-divider { border-color: var(--mf-border); margin: .35rem .4rem; }

.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu { top:0; left:100%; margin-top:-6px; }
.dropdown-submenu:hover > .dropdown-menu { display: block; }
.dropdown-submenu > a::after {
    display:block; content:""; float:right;
    width:0; height:0; border-color:transparent; border-style:solid;
    border-left-width:.3em; border-left-color:inherit;
    margin-right:-.6em; margin-top:.6em;
}
.dropdown-submenu.pull-left { float:none; }
.dropdown-submenu.pull-left > .dropdown-menu { left:-100%; margin-left:10px; }

/* =========================================================
   13. TABS Y PILLS
   ========================================================= */
.nav-tabs { border-bottom: 2px solid var(--mf-border); gap: 3px; }
.nav-tabs .nav-link {
    color: var(--mf-text-secondary); font-weight: 600; font-size: .83rem;
    border: none; border-bottom: 2px solid transparent; margin-bottom: -2px;
    padding: .52rem 1rem; border-radius: var(--mf-r-sm) var(--mf-r-sm) 0 0;
    transition: var(--mf-t);
}
.nav-tabs .nav-link:hover { color: var(--mf-primary); background: var(--mf-primary-xlight); }
.nav-tabs .nav-link.active { color: var(--mf-primary); border-bottom-color: var(--mf-primary); background: transparent; font-weight: 700; }

.nav-pills .nav-link {
    color: var(--mf-text-secondary); font-weight: 600; font-size: .83rem;
    border-radius: var(--mf-r-sm); padding: .44rem .9rem; transition: var(--mf-t);
}
.nav-pills .nav-link:hover { background: var(--mf-primary-xlight); color: var(--mf-primary); }
.nav-pills .nav-link.active { background: var(--mf-g-primary); color:#fff; box-shadow: 0 2px 8px rgba(var(--mf-primary-rgb),.32); }

.nav-pills-sm.nav > li > a, .nav-pills-sm a { padding-top: 3px; padding-bottom: 3px; }

/* =========================================================
   14. MODALES
   ========================================================= */
.modal-content { border:none; border-radius: var(--mf-r-xl); box-shadow: var(--mf-s-lg); overflow:hidden; }
.modal-header { background: linear-gradient(135deg,#F8FAFC,#EEF2F7); border-bottom:1px solid var(--mf-border); padding:1.1rem 1.5rem; }
.modal-title { font-weight:700; font-size:1rem; color:var(--mf-text); letter-spacing:-.01em; }
.modal-title .fa-solid, .modal-title i { color: var(--mf-primary); margin-right:.5rem; }
.modal-body { padding:1.5rem; }
.modal-footer { background:#F8FAFC; border-top:1px solid var(--mf-border); padding:1rem 1.5rem; gap:.5rem; }
.modal-backdrop.show { opacity:.32; }
.btn-close { opacity:.6; transition: var(--mf-t-f); }
.btn-close:hover { opacity:1; transform:rotate(90deg); }

/* =========================================================
   15. COLORES TEXTO Y FONDO
   ========================================================= */
.text-primary   { color: var(--mf-primary)        !important; }
.text-secondary { color: var(--mf-text-secondary)  !important; }
.text-success   { color: var(--mf-success)         !important; }
.text-warning   { color: var(--mf-warning)         !important; }
.text-danger    { color: var(--mf-danger)          !important; }
.text-info      { color: var(--mf-info)            !important; }
.text-muted     { color: var(--mf-text-muted)      !important; }
.text-dark      { color: var(--mf-text)            !important; }
.bg-light       { background-color: var(--mf-bg)   !important; }

.card .text-primary  { color: var(--mf-primary) !important; }
.card .text-success  { color: var(--mf-success) !important; }
.card .text-warning  { color: var(--mf-warning) !important; }
.card .text-danger   { color: var(--mf-danger)  !important; }
.card .text-info     { color: var(--mf-info)    !important; }
.card .text-muted    { color: var(--mf-text-muted) !important; }
.card a:not(.btn)    { color: var(--mf-primary); font-weight: 500; }
.card a:not(.btn):hover { color: var(--mf-primary-dark); }

/* =========================================================
   16. SCROLL PREMIUM
   ========================================================= */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: var(--mf-r-full); }
::-webkit-scrollbar-thumb:hover { background: #94A3B8; }

/* =========================================================
   17. PROGRESS Y SPINNERS
   ========================================================= */
.progress { background: var(--mf-border-light); border-radius: var(--mf-r-full); height: 8px; overflow:hidden; }
.progress-bar { background: var(--mf-g-primary); border-radius: var(--mf-r-full); }
.spinner-border { color: var(--mf-primary); }

/* =========================================================
   18. TOOLTIPS
   ========================================================= */
.tooltip .tooltip-inner { background:#1E293B; border-radius:var(--mf-r-sm); font-size:.76rem; font-weight:500; padding:.33rem .72rem; box-shadow:var(--mf-s); }

/* =========================================================
   19. ANIMACIONES
   ========================================================= */
@keyframes mf-drop { from { opacity:0; transform:translateY(-7px); } to { opacity:1; transform:translateY(0); } }
@keyframes mf-up   { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }

/* =========================================================
   20. UTILIDADES HEREDADAS
   ========================================================= */
.pointer, .clickable, .clickableRow, .clickableListRow { cursor: pointer; }
.cancelClickable { cursor: default; }
.custom-checkbox-control { position:relative; display:inline-flex; min-height:1.2rem; padding-left:1.5rem; margin-right:1rem; }
.order-6{order:6!important;} .order-7{order:7!important;} .order-8{order:8!important;}
.order-9{order:9!important;} .order-10{order:10!important;} .order-11{order:11!important;} .order-12{order:12!important;}

/* =========================================================
   21. RESPONSIVE
   ========================================================= */
@media (max-width: 768px) {
    .card-body   { padding: .95rem; }
    .card-header { padding: .72rem 1rem; }
    .modal-body  { padding: 1rem; }
    .btn         { font-size: .81rem; }
    .table thead th { font-size: .7rem; }
}
@media (max-width: 576px) {
    h1 { font-size:1.35rem; } h2 { font-size:1.15rem; }
    .btn-group .btn { font-size:.74rem; padding:.28rem .58rem; }
}

/* =========================================================
   22. IMPRESIÓN
   ========================================================= */
@media print {
    .d-print-none { display:none !important; }
    .navbar       { display:none !important; }
    body  { background:#fff; }
    .card { box-shadow:none; border:1px solid #dee2e6; }
    .table thead th { background:#f1f5f9; color:#334155; }
}
