/* ==========================================================
   CIPAVI · Pulido ejecutivo global 2026-09-24
   Capa visual conservadora: no cambia lógica, rutas ni datos.
   Diseñada para convivir con Bootstrap 4.6 y estilos históricos.
   ========================================================== */
:root {
    --cipavi-exec-ink: #172033;
    --cipavi-exec-muted: #64748b;
    --cipavi-exec-border: #dfe7f1;
    --cipavi-exec-surface: #ffffff;
    --cipavi-exec-soft: #f6f9fc;
    --cipavi-exec-blue: #2463b4;
    --cipavi-exec-blue-dark: #163f75;
    --cipavi-exec-shadow: 0 8px 24px rgba(15, 23, 42, .07);
    --cipavi-exec-shadow-soft: 0 4px 14px rgba(15, 23, 42, .055);
}

/* Compatibilidad visual para utilidades Bootstrap 5 usadas en componentes
   dentro de un proyecto que carga Bootstrap 4.6. */
.fw-bold { font-weight: 700 !important; }
.fs-2 { font-size: 2rem !important; }
.fs-6 { font-size: 1rem !important; }
.me-1 { margin-right: .25rem !important; }
.me-2 { margin-right: .5rem !important; }
.me-3 { margin-right: 1rem !important; }
.ms-1 { margin-left: .25rem !important; }
.ms-2 { margin-left: .5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.gap-1 { gap: .25rem !important; }
.gap-2 { gap: .5rem !important; }
.gap-3 { gap: 1rem !important; }
.form-select {
    display: block;
    width: 100%;
    min-height: 38px;
    padding: .375rem 1.75rem .375rem .75rem;
    color: #334155;
    background-color: #fff;
    border: 1px solid var(--cipavi-exec-border);
    border-radius: 9px;
}

body {
    color: var(--cipavi-exec-ink);
    background: #f4f7fb;
}

#main-wrapper,
#main-wrapper .page-wrapper {
    background: #f4f7fb !important;
}

#main-wrapper .page-wrapper > .container-fluid {
    padding-top: 18px;
    padding-bottom: 28px;
}

/* Perfil / salida: evita el posicionamiento por porcentaje que se desborda
   en resoluciones grandes y queda consistente en escritorio y móvil. */
.logout_style {
    top: 8px !important;
    right: 12px !important;
    margin: 0 !important;
    z-index: 1205 !important;
}
.logout_style .pro-pic {
    width: 44px;
    height: 44px;
    padding: 5px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: rgba(255, 255, 255, .95);
    border: 1px solid #dce5ef;
    box-shadow: var(--cipavi-exec-shadow-soft);
}
.logout_style .pro-pic img {
    width: 31px !important;
    height: 31px !important;
    object-fit: cover;
}
.logout_style .dropdown-menu {
    min-width: 190px;
    padding: .45rem;
    border: 1px solid var(--cipavi-exec-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--cipavi-exec-shadow) !important;
}
.logout_style .dropdown-item {
    border-radius: 8px;
    padding: .58rem .7rem;
    color: #334155;
    font-weight: 700;
}
.logout_style .dropdown-item:hover,
.logout_style .dropdown-item:focus {
    color: #173f73;
    background: #eef5ff;
}

/* Barra superior: mismo layout, mejor acabado. */
#main-wrapper .topbar .nav_top {
    background: rgba(255, 255, 255, .94) !important;
    border: 1px solid rgba(218, 227, 238, .92);
    border-radius: 13px;
    box-shadow: 0 5px 18px rgba(15, 23, 42, .045);
}
#main-wrapper .topbar .breadcrumb {
    margin-bottom: 0;
}
#main-wrapper .topbar .breadcrumb-item,
#main-wrapper .topbar .breadcrumb-item a {
    color: #40536b !important;
}
#main-wrapper .topbar .color_buttons {
    min-width: 40px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #24466f !important;
    background: #eef4fb !important;
    border: 1px solid #d9e5f2;
    border-radius: 10px;
}
#main-wrapper .topbar .mailbox {
    border: 1px solid var(--cipavi-exec-border) !important;
    border-radius: 14px !important;
    box-shadow: var(--cipavi-exec-shadow) !important;
}

/* Tarjetas y secciones: sombra discreta y jerarquía más limpia. */
#main-wrapper .card {
    border: 1px solid rgba(222, 231, 241, .96) !important;
    border-radius: 14px !important;
    box-shadow: var(--cipavi-exec-shadow-soft) !important;
}
#main-wrapper .card-header {
    padding: .9rem 1.1rem;
    color: #24364e;
    background: linear-gradient(180deg, #ffffff, #f8fbfe);
    border-bottom: 1px solid #e4ebf3;
    font-weight: 800;
}
#main-wrapper .card-footer {
    background: #fbfcfe;
    border-top-color: #e4ebf3;
}
#main-wrapper hr {
    border-top-color: #e5ebf2;
}

/* Títulos detectados por el runtime existente. */
#main-wrapper .cipavi-module-title {
    min-height: 62px !important;
    padding: 13px 18px !important;
    margin-bottom: 1rem !important;
    border-left: 4px solid var(--cipavi-exec-blue) !important;
    border-radius: 13px !important;
    background: linear-gradient(90deg, #ffffff 0%, #fbfdff 72%, #f5f9ff 100%) !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, .055) !important;
    color: #1d2d43 !important;
    font-size: 1.24rem !important;
    letter-spacing: -.012em !important;
}
#main-wrapper .cipavi-module-title::before {
    width: 9px !important;
    height: 9px !important;
    flex: 0 0 9px !important;
    margin-right: 13px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--cipavi-exec-blue) !important;
    box-shadow: 0 0 0 5px #e8f1fc !important;
}

/* Formularios: mayor legibilidad sin aumentar demasiado la altura. */
#main-wrapper label,
#main-wrapper .col-form-label,
#main-wrapper .form-group > label {
    color: #304159;
    font-weight: 700;
    margin-bottom: .36rem;
}
#main-wrapper .form-control,
#main-wrapper .custom-select,
#main-wrapper .form-select,
#main-wrapper .input-group-text,
#main-wrapper .multiselect__tags,
#main-wrapper .vs__dropdown-toggle {
    border-color: #d9e3ee !important;
    border-radius: 9px !important;
}
#main-wrapper .form-control,
#main-wrapper .custom-select,
#main-wrapper .form-select {
    min-height: 39px;
    color: #24364e;
    background-color: #fff;
}
#main-wrapper textarea.form-control {
    min-height: 82px;
    resize: vertical;
}
#main-wrapper .form-control:focus,
#main-wrapper .custom-select:focus,
#main-wrapper .form-select:focus,
#main-wrapper .multiselect--active .multiselect__tags,
#main-wrapper .vs--open .vs__dropdown-toggle {
    border-color: #84addd !important;
    box-shadow: 0 0 0 .18rem rgba(36, 99, 180, .11) !important;
}
#main-wrapper .form-control[readonly],
#main-wrapper .form-control:disabled,
#main-wrapper .custom-select:disabled,
#main-wrapper .form-select:disabled {
    color: #66758a;
    background: #f3f6f9;
}
#main-wrapper .invalid-feedback {
    font-weight: 650;
}

/* Botones: más claros y consistentes. No cambia acciones ni tamaño de tablas. */
#main-wrapper .btn,
.cipavi-standalone .btn {
    min-height: 36px;
    border-radius: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .002em;
    transition: transform .14s ease, box-shadow .14s ease, background-color .14s ease, border-color .14s ease;
}
#main-wrapper .btn-sm,
.cipavi-standalone .btn-sm {
    min-height: 31px;
    padding-top: .28rem;
    padding-bottom: .28rem;
}
#main-wrapper .btn-lg,
.cipavi-standalone .btn-lg {
    min-height: 43px;
}
#main-wrapper .btn:not(.btn-link):not(:disabled):hover,
.cipavi-standalone .btn:not(.btn-link):not(:disabled):hover {
    transform: translateY(-1px);
}
#main-wrapper .btn-primary,
#main-wrapper .btn-info,
#main-wrapper .btn-success,
#main-wrapper .btn-danger,
#main-wrapper .btn-dark,
.cipavi-standalone .btn-primary,
.cipavi-standalone .btn-info,
.cipavi-standalone .btn-success,
.cipavi-standalone .btn-danger,
.cipavi-standalone .btn-dark {
    box-shadow: 0 4px 10px rgba(15, 23, 42, .10);
}
#main-wrapper .btn-outline-primary,
#main-wrapper .btn-outline-info,
#main-wrapper .btn-outline-success,
#main-wrapper .btn-outline-danger,
#main-wrapper .btn-outline-secondary,
.cipavi-standalone .btn-outline-primary,
.cipavi-standalone .btn-outline-info,
.cipavi-standalone .btn-outline-success,
.cipavi-standalone .btn-outline-danger,
.cipavi-standalone .btn-outline-secondary {
    background-color: rgba(255, 255, 255, .92);
}
#main-wrapper .btn-link,
.cipavi-standalone .btn-link {
    min-height: auto;
    box-shadow: none !important;
}
#main-wrapper .btn.rounded-circle {
    width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50% !important;
}
#main-wrapper .btn i,
#main-wrapper .btn svg,
.cipavi-standalone .btn i,
.cipavi-standalone .btn svg {
    flex: 0 0 auto;
}
#main-wrapper .btn-group .btn:hover {
    transform: none;
}

/* Tablas y reportes. Se conserva el scroll/compactación especializado existente. */
#main-wrapper .table-responsive,
#main-wrapper .vbt-table-wrapper,
#main-wrapper .vbt-table-responsive {
    border-radius: 11px;
    scrollbar-color: #b9c7d8 #edf2f7;
    scrollbar-width: thin;
}
#main-wrapper table.table thead th,
#main-wrapper .vue-bootstrap4-table table.table thead th {
    color: #263950 !important;
    background: #f1f5f9 !important;
    border-bottom-color: #cbd8e7 !important;
    font-weight: 800 !important;
}
#main-wrapper table.table tbody td {
    border-top-color: #e6ecf3;
    color: #2b3c51;
}
#main-wrapper table.table tbody tr:hover > td {
    background: #f8fbff;
}
#main-wrapper table.table .btn {
    box-shadow: none;
}
#main-wrapper .vbt-table-tools {
    margin-bottom: .6rem;
}
#main-wrapper .vbt-table-tools input[type="text"],
#main-wrapper .vbt-table-tools input[type="search"] {
    border-color: #d5e0eb !important;
}

/* Estados y navegación secundaria. */
#main-wrapper .badge {
    border-radius: 999px;
    font-weight: 750;
    letter-spacing: .005em;
}
#main-wrapper .alert {
    border-radius: 11px;
    border-width: 1px;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .035);
}
#main-wrapper .nav-tabs .nav-link,
#main-wrapper .nav-pills .nav-link {
    transition: background-color .14s ease, color .14s ease, border-color .14s ease;
}
#main-wrapper .pagination .page-link {
    min-width: 35px;
    text-align: center;
    border-color: #dce5ef;
}

/* Modales: encabezado sobrio y controles siempre legibles. */
#main-wrapper .modal-content,
.modal-content {
    border-radius: 14px !important;
    border: 1px solid rgba(218, 227, 238, .95) !important;
    box-shadow: 0 20px 54px rgba(15, 23, 42, .18) !important;
}
#main-wrapper .modal-header,
.modal-header {
    padding: 1rem 1.15rem;
    background: linear-gradient(180deg, #ffffff, #f7faff);
    border-bottom-color: #dfe7f1;
}
#main-wrapper .modal-footer,
.modal-footer {
    padding: .85rem 1.15rem;
    background: #fbfcfe;
    border-top-color: #dfe7f1;
}
#main-wrapper .modal-title,
.modal-title {
    color: #21344d;
    font-weight: 800;
}

/* Menú lateral: conserva 65 px e iconos, solo mejora contraste/feedback. */
#main-wrapper .left-sidebar .sidebar-link {
    border-radius: 0 10px 10px 0;
}
#main-wrapper .left-sidebar .sidebar-link img {
    filter: saturate(.94);
    transition: transform .14s ease, filter .14s ease;
}
#main-wrapper .left-sidebar .sidebar-link:hover img,
#main-wrapper .left-sidebar .sidebar-item.cipavi-nav-active .sidebar-link img {
    transform: scale(1.04);
    filter: saturate(1.08);
}

/* Carga rápida de combustible (vista independiente). */
body .fuel-quick-top {
    box-shadow: 0 7px 22px rgba(15, 23, 42, .16);
}
body .fuel-quick-intro,
body .fuel-enterprise-card {
    border-color: #dbe5f0;
    box-shadow: var(--cipavi-exec-shadow-soft);
}
body .fuel-enterprise-card:focus-visible {
    outline: 3px solid rgba(36, 99, 180, .22);
    outline-offset: 2px;
}

@media (max-width: 991.98px) {
    #main-wrapper .page-wrapper > .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
    }
    #main-wrapper .card-header {
        padding: .8rem .9rem;
    }
}

@media (max-width: 767.98px) {
    .logout_style {
        top: 7px !important;
        right: 8px !important;
    }
    #main-wrapper .cipavi-module-title {
        min-height: 56px !important;
        padding: 12px 14px !important;
        font-size: 1.06rem !important;
    }
    #main-wrapper .card {
        border-radius: 12px !important;
    }
    #main-wrapper .card-body {
        padding: .9rem !important;
    }
    #main-wrapper .form-control,
    #main-wrapper .custom-select,
    #main-wrapper .form-select {
        min-height: 41px;
        font-size: 16px; /* evita zoom automático en iOS */
    }
    #main-wrapper .btn:not(.btn-sm) {
        min-height: 40px;
    }
    #main-wrapper .modal-dialog {
        margin: .55rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    #main-wrapper *,
    #main-wrapper *::before,
    #main-wrapper *::after,
    .cipavi-standalone *,
    .cipavi-standalone *::before,
    .cipavi-standalone *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* ==========================================================
   CIPAVI 2026-10-07 · Pulido visual Hoja de Vida / Reporte AF
   Solo presentación: márgenes, respiración y responsive.
   ========================================================== */
@media (min-width: 769px) {
    #main-wrapper.report-page .report-module,
    #main-wrapper.life-page .life-module {
        padding-top: 24px !important;
        padding-right: 26px !important;
        padding-bottom: 48px !important;
        padding-left: calc(var(--cipavi-sidebar-width, 65px) + 26px) !important;
    }
}

#main-wrapper.report-page .report-module > .container-fluid,
#main-wrapper.life-page .life-module > .container-fluid {
    width: 100% !important;
    max-width: 1720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

#main-wrapper.report-page .report-hero,
#main-wrapper.life-page .life-hero {
    margin-bottom: 20px !important;
    border-radius: 14px !important;
}
#main-wrapper.report-page .report-hero .card-body,
#main-wrapper.life-page .life-hero .card-body {
    padding: 20px 22px !important;
}
#main-wrapper.report-page .report-hero h3,
#main-wrapper.life-page .life-hero h3 {
    line-height: 1.25 !important;
}
#main-wrapper.report-page .report-hero p,
#main-wrapper.life-page .life-hero p {
    line-height: 1.45 !important;
}

#main-wrapper.report-page .report-module > .container-fluid > .row,
#main-wrapper.life-page .life-module > .container-fluid > .row {
    margin-left: -8px !important;
    margin-right: -8px !important;
}
#main-wrapper.report-page .report-module > .container-fluid > .row > [class*="col-"],
#main-wrapper.life-page .life-module > .container-fluid > .row > [class*="col-"] {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

#main-wrapper.report-page .kpi-card,
#main-wrapper.life-page .life-kpi {
    border-radius: 13px !important;
    min-height: 104px !important;
    padding: 15px 17px !important;
}
#main-wrapper.report-page .kpi-card strong,
#main-wrapper.life-page .life-kpi strong {
    line-height: 1.08 !important;
}

#main-wrapper.report-page .report-panel,
#main-wrapper.life-page .life-panel,
#main-wrapper.report-page .report-module .card,
#main-wrapper.life-page .life-module .card {
    border-radius: 14px !important;
}
#main-wrapper.report-page .report-panel > .card-body,
#main-wrapper.life-page .life-panel > .card-body {
    padding: 20px 22px !important;
}

#main-wrapper.report-page .report-panel label,
#main-wrapper.life-page .life-panel label {
    margin-bottom: 6px !important;
}
#main-wrapper.report-page .report-panel .form-control,
#main-wrapper.life-page .life-panel .form-control {
    min-height: 38px !important;
}

/* Hoja de Vida: el buscador y Actualizar ocupan todo el ancho útil. */
@media (min-width: 768px) {
    #main-wrapper.life-page .life-panel .row.align-items-end.mb-3 > .col-md-7.col-lg-6 {
        flex: 0 0 75% !important;
        max-width: 75% !important;
    }
    #main-wrapper.life-page .life-panel .row.align-items-end.mb-3 > .col-md-5.col-lg-3 {
        flex: 0 0 25% !important;
        max-width: 25% !important;
    }
}

/* Reporte: segunda línea de filtros equilibrada, sin hueco muerto. */
@media (min-width: 992px) {
    #main-wrapper.report-page .report-panel .row.align-items-end > .col-lg-4.col-md-6.mb-3:nth-last-child(2) {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
    #main-wrapper.report-page .report-panel .row.align-items-end > .col-lg-4.col-md-6.mb-3.d-flex:last-child {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
}

#main-wrapper.report-page .mini-row {
    min-height: 38px !important;
    align-items: center !important;
    padding: 8px 11px !important;
}
#main-wrapper.report-page .report-table-wrap,
#main-wrapper.life-page .life-table-wrap {
    border-radius: 11px !important;
}

@media (max-width: 991.98px) {
    #main-wrapper.report-page .report-module,
    #main-wrapper.life-page .life-module {
        padding-top: 20px !important;
        padding-right: 18px !important;
        padding-bottom: 36px !important;
        padding-left: calc(var(--cipavi-sidebar-width, 65px) + 18px) !important;
    }
}

@media (max-width: 768px) {
    #main-wrapper.report-page .report-module,
    #main-wrapper.life-page .life-module {
        padding: 16px 10px 32px !important;
    }
    #main-wrapper.report-page .report-module > .container-fluid,
    #main-wrapper.life-page .life-module > .container-fluid {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    #main-wrapper.report-page .report-hero .card-body,
    #main-wrapper.life-page .life-hero .card-body,
    #main-wrapper.report-page .report-panel > .card-body,
    #main-wrapper.life-page .life-panel > .card-body {
        padding: 16px !important;
    }
    #main-wrapper.report-page .report-hero h3,
    #main-wrapper.life-page .life-hero h3 {
        font-size: 1.25rem !important;
    }
}
