:root {
  --navy-950: #101e3c;
  --navy-900: #15284d;
  --navy-800: #1c3b63;
  --slate-700: #4b5963;
  --slate-500: #7a878b;
  --slate-200: #dce4e5;
  --slate-100: #f0f5f5;
  --surface: #ffffff;
  --teal: #008999;
  --teal-soft: #e5f5f6;
  --green: #6ab100;
  --lime: #c4d800;
  --blue: #3885a6;
  --success: #5b9900;
  --warning: #c48a00;
  --danger: #bd4d55;
}

@font-face { font-family: "Neo Sans Intel"; font-style: normal; font-weight: 400; src: url("../fonts/NeoSansIntel.dbe19255a71c.ttf") format("truetype"); }
@font-face { font-family: "Neo Sans Intel"; font-style: normal; font-weight: 600 800; src: url("../fonts/NeoSansIntel-Medium.9f31081e32fe.ttf") format("truetype"); }
@font-face { font-family: "Neo Sans Intel"; font-style: italic; font-weight: 500; src: url("../fonts/NeoSansIntel-MediumItalic.505e8ef34d06.ttf") format("truetype"); }

html, body { max-width: 100%; overflow-x: hidden; }
body { background: #f4f8f8; color: #31454d; font-family: "Neo Sans Intel", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.app-navbar { min-height: 74px; background: linear-gradient(100deg, var(--navy-950), #173158); border-bottom: 3px solid var(--teal); box-shadow: 0 2px 12px rgba(16, 30, 60, .22); }
.navbar-brand { color: #fff; line-height: 1.05; }
.navbar-brand small { color: rgba(255, 255, 255, .7); font-size: .62rem; letter-spacing: .045em; text-transform: uppercase; }
.navbar-logo { height: 47px; object-fit: contain; width: 128px; }
.navbar-product { border-left: 1px solid rgba(255, 255, 255, .26); padding-left: 12px; }
.navbar-product strong { font-size: 1.03rem; letter-spacing: .01em; }
.navbar-user { color: rgba(255, 255, 255, .82); font-size: .88rem; }
.app-shell { display: flex; min-height: 100vh; padding-top: 74px; }
.app-sidebar { background: var(--navy-950); color: #fff; flex: 0 0 236px; min-height: calc(100vh - 74px); padding: 26px 16px; transition: flex-basis .2s ease, padding .2s ease; }
.sidebar-section-label { color: rgba(255, 255, 255, .42); font-size: .67rem; font-weight: 700; letter-spacing: .14em; margin: 0 10px 12px; text-transform: uppercase; }
.sidebar-link { align-items: center; border-radius: 9px; color: rgba(255, 255, 255, .76); display: flex; font-size: .89rem; gap: 10px; margin-bottom: 5px; padding: 10px 11px; text-decoration: none; }
.sidebar-link.active { background: rgba(0, 137, 153, .42); box-shadow: inset 3px 0 0 var(--lime); color: #fff; font-weight: 700; }
.sidebar-link:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.sidebar-link.disabled { color: rgba(255, 255, 255, .38); cursor: default; }
.sidebar-icon { display: inline-flex; font-size: 1rem; justify-content: center; width: 18px; }
.app-main { flex: 1; max-width: 100%; min-width: 0; padding: 30px; }
.page-header, .section-heading { align-items: center; display: flex; justify-content: space-between; margin-bottom: 22px; }
.page-header h1 { color: var(--navy-950); font-size: 1.8rem; font-weight: 750; letter-spacing: -.02em; margin-bottom: 6px; }
.eyebrow { color: var(--teal); font-size: .72rem; font-weight: 800; letter-spacing: .14em; margin-bottom: 5px; text-transform: uppercase; }
.page-header-meta { background: var(--teal-soft); border: 1px solid #bce6e9; border-radius: 999px; color: #006d79; font-size: .78rem; font-weight: 700; padding: 7px 12px; }
.status-dot { background: var(--green); border-radius: 50%; display: inline-block; height: 8px; margin-right: 6px; width: 8px; }
.filter-panel, .panel-card, .kpi-card { background: var(--surface); border: 1px solid #e1e8f0; border-radius: 13px; box-shadow: 0 4px 14px rgba(34, 53, 75, .04); min-width: 0; }
.filter-panel { padding: 18px; }
.section-title { color: var(--navy-950); font-size: 1.05rem; font-weight: 750; margin-bottom: 3px; }
.section-caption, .panel-header span { color: var(--slate-500); font-size: .79rem; }
.form-label { color: var(--slate-700); font-size: .76rem; font-weight: 750; margin-bottom: 5px; text-transform: uppercase; }
.form-select, .form-control { border-color: #d6e0e9; color: #34485f; font-size: .88rem; }
.btn-primary { background: var(--teal); border-color: var(--teal); }.btn-primary:hover, .btn-primary:focus { background: #007582; border-color: #007582; }
.btn-outline-primary { border-color: var(--teal); color: var(--teal); }.btn-outline-primary:hover, .btn-outline-primary:focus { background: var(--teal); border-color: var(--teal); color: #fff; }
.kpi-card { border-left: 4px solid var(--navy-800); min-height: 110px; padding: 17px 18px; }
.kpi-card span { color: var(--slate-500); display: block; font-size: .75rem; font-weight: 700; letter-spacing: .04em; margin-bottom: 16px; text-transform: uppercase; }
.kpi-card strong { color: var(--navy-950); display: block; font-size: 1.5rem; letter-spacing: -.04em; }
.kpi-success { border-left-color: var(--success); }.kpi-warning { border-left-color: var(--warning); }.kpi-danger { border-left-color: var(--danger); }.kpi-accent { border-left-color: var(--teal); }
.panel-card { padding: 18px; }
.panel-header { align-items: baseline; display: flex; justify-content: space-between; margin-bottom: 14px; }
.panel-header h2 { color: var(--navy-950); font-size: 1rem; font-weight: 750; margin: 0; }
.chart-wrap { height: 280px; position: relative; }.chart-large { height: 330px; }
.executive-table { color: #34485f; font-size: .84rem; margin-bottom: 0; }
.executive-table thead th { background: var(--slate-100); border-bottom: 0; color: var(--slate-700); font-size: .69rem; letter-spacing: .06em; padding: 10px; text-transform: uppercase; }
.dashboard-hierarchy { align-items: center; display: flex; flex-wrap: wrap; gap: 10px; }
.dashboard-hierarchy button { background: #fff; border: 1px solid rgba(0, 137, 153, .16); border-radius: 999px; color: var(--slate-600); cursor: pointer; font-size: .78rem; font-weight: 800; letter-spacing: .04em; padding: 8px 12px; text-transform: uppercase; transition: all .15s ease; }
.dashboard-hierarchy button:hover, .dashboard-hierarchy button:focus { border-color: rgba(0, 137, 153, .45); color: var(--brand-teal); outline: none; }
.dashboard-hierarchy button.active { background: rgba(0, 137, 153, .11); border-color: rgba(0, 137, 153, .35); color: var(--brand-teal); }
.dashboard-table-scroll { max-height: 360px; overflow: auto; }
.dashboard-table-scroll .dataTables_wrapper { min-width: 100%; }
.executive-table td { border-color: #eef2f6; padding: 10px; }
.badge-soft-danger { background: #fae9eb; color: #9e3c45; }.badge-soft-warning { background: #fff2da; color: #946313; }
.contract-link { color: var(--navy-800); font-weight: 750; text-decoration: none; }.contract-link:hover { color: var(--teal); }
.status-badge { border-radius: 999px; display: inline-block; font-size: .69rem; font-weight: 800; padding: 4px 8px; text-transform: uppercase; }
.status-active { background: #e4f4ec; color: #237151; }.status-expired, .status-cancelled { background: #fae9eb; color: #9e3c45; }.status-draft { background: #fff2da; color: #946313; }.status-closed, .status-renewed { background: #e7edf4; color: #52677f; }
.status-borrador, .status-registrada { background: #fff2da; color: #946313; }.status-validada { background: #e4f4ec; color: #237151; }.status-anulada, .status-rechazada { background: #fae9eb; color: #9e3c45; }
.contract-section-nav { background: #fff; border: 1px solid #e1e8f0; border-radius: 11px; display: flex; flex-wrap: wrap; gap: 4px; padding: 8px; }
.contract-section-nav a { border-radius: 7px; color: var(--slate-700); font-size: .8rem; font-weight: 700; padding: 7px 9px; text-decoration: none; }.contract-section-nav a:hover { background: var(--slate-100); color: var(--navy-950); }
.contract-data-grid div { margin-bottom: 14px; }.contract-data-grid dt { color: var(--slate-500); font-size: .7rem; letter-spacing: .08em; margin-bottom: 4px; text-transform: uppercase; }.contract-data-grid dd { color: var(--navy-950); font-size: .9rem; margin-bottom: 0; }
.traffic-light { border-radius: 50%; display: inline-block; height: 9px; margin-right: 7px; width: 9px; }.traffic-success { background: var(--success); }.traffic-warning { background: var(--warning); }.traffic-danger { background: var(--danger); }.traffic-orange { background: #e66d17; }
.json-view { background: #f7f9fb; border: 1px solid #e1e8f0; border-radius: 8px; color: #34485f; font-size: .78rem; max-height: 420px; max-width: 100%; overflow: auto; overflow-wrap: anywhere; padding: 14px; white-space: pre-wrap; word-break: break-word; }
.analytics-line { border-top: 1px solid #e6edf4; padding: 17px 0 8px; }.analytics-line:first-of-type { border-top: 0; padding-top: 0; }.analytics-line-header { align-items: center; display: flex; justify-content: space-between; margin-bottom: 8px; }.analytics-line-header strong { color: var(--navy-950); display: block; }.analytics-line-header span { color: var(--slate-500); display: block; font-size: .78rem; }.analytics-line-header b { color: var(--teal); }
.progress { background: #e7eef4; height: 6px; }.progress-bar { background: var(--teal); }
.contract-timeline { border-left: 2px solid #dce5ee; list-style: none; margin: 4px 0 0 8px; padding-left: 22px; }.contract-timeline li { padding: 0 0 19px 3px; position: relative; }.contract-timeline li::before { background: var(--teal); border: 3px solid #e8f6f3; border-radius: 50%; content: ""; height: 13px; left: -30px; position: absolute; top: 2px; width: 13px; }.contract-timeline time { color: var(--slate-500); display: block; font-size: .72rem; margin-bottom: 3px; }.contract-timeline strong { color: var(--navy-950); font-size: .9rem; }.contract-timeline p { color: var(--slate-700); font-size: .83rem; margin: 3px 0 0; }
.form-card { max-width: 980px; }.form-check-input { margin-right: 7px; }
.billing-detail-row { border-top: 1px solid #e6edf4; padding: 15px 0; }.billing-detail-row:first-child { border-top: 0; padding-top: 0; }.billing-detail-total { background: #eef5f7; color: var(--navy-950); font-weight: 750; }.summary-label { color: var(--slate-500); display: block; font-size: .72rem; font-weight: 750; letter-spacing: .06em; margin-bottom: 4px; text-transform: uppercase; }
.notification-count { background: var(--danger); border-radius: 999px; color: #fff; font-size: .62rem; font-weight: 800; min-width: 17px; padding: 2px 5px; position: absolute; right: -8px; top: -8px; }.notification-menu { min-width: 330px; padding: 0; }.notification-menu-header, .notification-footer { color: var(--navy-950); font-size: .75rem; font-weight: 800; letter-spacing: .05em; padding: 11px 14px; text-transform: uppercase; }.notification-item { border-top: 1px solid #eef2f6; padding: 10px 14px; white-space: normal; }.notification-item strong, .notification-item span { display: block; font-size: .78rem; }.notification-item span { color: var(--slate-500); margin-top: 3px; }.notification-unread { background: #eef7f7; }
.priority-badge { border-radius: 999px; display: inline-block; font-size: .69rem; font-weight: 800; padding: 4px 8px; text-transform: uppercase; }.priority-low { background: #e7edf4; color: #52677f; }.priority-medium { background: #fff2da; color: #946313; }.priority-high, .priority-critical { background: #fae9eb; color: #9e3c45; }
.status-nueva { background: #fff2da; color: #946313; }.status-vista { background: #e7edf4; color: #52677f; }.status-gestionada { background: #e8f6f3; color: #276e68; }.status-cerrada { background: #e4f4ec; color: #237151; }
.loading-overlay { opacity: .62; pointer-events: none; }
div.dt-container div.dt-layout-row { margin: 12px 0 0; }.dt-search { display: none; }
.login-page { background: linear-gradient(135deg, var(--navy-950), #183762 72%, var(--teal)); min-height: 100vh; }
.login-shell { align-items: center; display: flex; justify-content: center; min-height: 100vh; padding: 20px; }
.login-card { background: #fff; border-radius: 16px; border-top: 5px solid var(--teal); box-shadow: 0 18px 45px rgba(0, 0, 0, .22); max-width: 440px; padding: 34px; width: 100%; }
.login-card h1 { color: var(--navy-950); font-size: 1.75rem; font-weight: 750; }
.login-brand { align-items: center; color: var(--navy-950); display: flex; justify-content: center; margin-bottom: 28px; width: 100%; }
.login-logo { display: block; height: auto; max-width: 220px; object-fit: contain; width: 100%; }
.login-brand small { color: var(--slate-500); display: block; font-size: .67rem; letter-spacing: .08em; text-transform: uppercase; }
.mobile-navigation { background: var(--navy-950); color: #fff; max-width: 310px; }.mobile-navigation .offcanvas-header { border-bottom: 1px solid rgba(255, 255, 255, .14); }.mobile-menu-logo { height: auto; max-width: 145px; }.mobile-menu-title { color: #fff; font-size: 1.05rem; font-weight: 700; margin: 0 10px 22px; }
.sidebar-collapsed .app-sidebar { flex-basis: 74px; padding-left: 10px; padding-right: 10px; }
.sidebar-collapsed .app-sidebar .sidebar-section-label, .sidebar-collapsed .app-sidebar .sidebar-link-label { display: none; }
.sidebar-collapsed .app-sidebar .sidebar-link { font-size: 0; justify-content: center; padding-left: 8px; padding-right: 8px; }
.sidebar-collapsed .app-sidebar .sidebar-icon { font-size: 1rem; }
.sidebar-collapse-toggle { align-items: center; justify-content: center; }
.table-responsive { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-responsive > .executive-table { min-width: max-content; }
div.dt-container { max-width: 100%; overflow: hidden; }
.select2-container { max-width: 100%; }
.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple { border: 1px solid #d6e0e9; border-radius: .375rem; min-height: 38px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: #34485f; font-size: .88rem; line-height: 36px; padding-left: 12px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; }
.select2-container--default .select2-selection--multiple { padding: 3px 7px; }
.select2-dropdown { border-color: #d6e0e9; }
.session-warning-card { border-top: 4px solid var(--warning); }
.audit-json-grid > div { min-width: 0; }
@media (max-width: 991.98px) { .app-sidebar { display: none; }.app-main { padding: 20px; }.page-header { align-items: flex-start; flex-direction: column; gap: 12px; }.navbar-logo { height: 41px; width: 112px; }.navbar-product strong { font-size: .94rem; }.navbar-product small { max-width: 270px; } }
@media (max-width: 767.98px) { .contract-section-nav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }.contract-section-nav a { flex: 0 0 auto; }.notification-menu { min-width: min(330px, calc(100vw - 24px)); }.panel-card, .filter-panel { padding: 15px; } }
@media (max-width: 575.98px) { .app-navbar .container-fluid { padding-left: 12px !important; padding-right: 12px !important; }.navbar-brand { gap: 7px !important; margin-right: 4px; }.navbar-logo { height: 32px; width: 88px; }.navbar-product { padding-left: 8px; }.navbar-product strong { display: block; font-size: .78rem; }.navbar-product small { display: none !important; }.app-main { padding: 16px; }.chart-large, .chart-wrap { height: 250px; }.page-header h1 { font-size: 1.55rem; }.kpi-card { min-height: 100px; padding: 14px; }.kpi-card strong { font-size: 1.25rem; }.login-card { padding: 26px 22px; }.login-logo { max-width: 200px; }.modal-footer { align-items: stretch; flex-direction: column-reverse; }.modal-footer .btn, .modal-footer form { width: 100%; } }