﻿:root{
  --ink:#0A1F38;
  --ink-soft:#163552;
  --accent:#C9A227;
  --accent-soft:#F4E7BE;
  --bg:#F3F6FB;
  --surface:#fff;
  --card-line:#E2E8F0;
  --muted:#62748A;
  --sidebar-w:260px;
  --primary:#1B4F8A;
  --primary-hover:#15406F;
  --success:#1F7A4D;
  --danger:#B42318;
  --info:#1A6F8A;
  --shadow:0 8px 24px rgba(10,31,56,.06);
  --shadow-lg:0 18px 40px rgba(10,31,56,.10);
  --radius:14px;
  --radius-sm:10px;
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  background:var(--bg); color:var(--ink);
  font-family:'Plus Jakarta Sans','Source Sans 3','Segoe UI',system-ui,sans-serif;
  margin:0; letter-spacing:.01em;
}
.app-content::-webkit-scrollbar,.sidebar::-webkit-scrollbar{width:8px;}
.app-content::-webkit-scrollbar-thumb,.sidebar::-webkit-scrollbar-thumb{background:#C5D0DE; border-radius:8px;}
.app-body{display:flex; height:100%; overflow:hidden;}

.sidebar{
  background:linear-gradient(180deg,#071525 0%, #0B2545 42%, #123257 100%);
  color:#C5D0E0; width:var(--sidebar-w);
  height:100%; flex-shrink:0; overflow-y:auto;
  box-shadow:8px 0 32px rgba(7,21,37,.28);
  display:flex; flex-direction:column;
}
.sidebar .brand{
  color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center;
  padding:1.2rem .95rem 1.05rem; position:relative;
}
.sidebar .brand:after{
  content:""; position:absolute; left:1.1rem; right:1.1rem; bottom:0;
  height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent);
}
.sidebar .brand-logo{height:44px; width:auto; max-width:210px; object-fit:contain; display:block;}
.sidebar .brand-mark{display:none; height:36px; width:36px; object-fit:contain;}
.sidebar-nav{padding:.85rem .7rem 1.2rem; display:flex; flex-direction:column; gap:.15rem; flex:1;}
.nav-section{
  font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:#7E90A8; padding:.85rem .85rem .35rem;
}
.sidebar .nav-link{
  color:#B7C4D4; border-radius:10px; padding:.58rem .8rem;
  display:flex; align-items:center; gap:.65rem; font-weight:600; font-size:.92rem;
  transition:background .15s ease, color .15s ease, transform .15s ease;
}
.sidebar .nav-link i{
  width:30px; height:30px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.05); font-size:.88rem;
}
.sidebar .nav-link:hover{background:rgba(255,255,255,.07); color:#fff;}
.sidebar .nav-link:hover i{background:rgba(201,162,39,.16); color:var(--accent);}
.sidebar .nav-link.active{background:linear-gradient(90deg, rgba(27,79,138,.95), rgba(27,79,138,.7)); color:#fff; box-shadow:inset 3px 0 0 var(--accent);}
.sidebar .nav-link.active i{background:rgba(201,162,39,.22); color:var(--accent);}

.app-shell{flex:1; display:flex; flex-direction:column; min-width:0; min-height:0; height:100%; overflow:hidden;}
.topbar{
  background:rgba(255,255,255,.92); border-bottom:1px solid var(--card-line);
  display:flex; align-items:center; justify-content:space-between;
  padding:.72rem 1.35rem; z-index:20; backdrop-filter:blur(10px);
}
.btn-sidebar{
  width:38px; height:38px; border-radius:10px; border:1px solid var(--card-line);
  background:#fff; color:var(--ink-soft); display:inline-flex; align-items:center; justify-content:center;
}
.btn-sidebar:hover{background:#F4F7FB; color:var(--primary); border-color:#C9D6E6;}
.topbar-title{font-weight:800; letter-spacing:.01em; font-size:1.05rem;}
.user-chip{
  display:flex; align-items:center; gap:.55rem; border:1px solid var(--card-line);
  background:#fff; border-radius:999px; padding:.2rem .7rem .2rem .25rem;
}
.user-chip:hover,.user-chip:focus{background:#F7FAFD; border-color:#C9D6E6;}
.user-avatar{
  width:32px;height:32px;border-radius:50%; background:linear-gradient(135deg,#1B4F8A,#0B2545);
  display:inline-flex;align-items:center;justify-content:center;color:#fff; overflow:hidden;
}
.user-avatar img{width:32px;height:32px;object-fit:cover;}
.user-name{max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; font-size:.88rem;}
.app-content{flex:1; padding:1.4rem 1.5rem 1.7rem; overflow:auto; min-height:0;}
.app-footer{
  border-top:1px solid var(--card-line); background:#fff; color:#7A8798;
  font-size:.82rem; padding:.7rem 1.4rem; display:flex; justify-content:space-between;
}

.page-toolbar{display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; margin-bottom:1.2rem; flex-wrap:wrap;}
.page-title{font-size:1.42rem; font-weight:800; margin:0; letter-spacing:-.02em;}
.page-subtitle{color:var(--muted); font-size:.92rem;}
.card{
  border:1px solid var(--card-line); border-radius:var(--radius); background:var(--surface);
  box-shadow:var(--shadow);
}
.table-card{overflow:hidden;}
.table{--bs-table-bg:transparent;}
.table thead th{
  background:linear-gradient(180deg,#0B2545,#0E2E52); color:#fff; font-size:.74rem; letter-spacing:.06em;
  text-transform:uppercase; font-weight:700; border:0; padding:.78rem .9rem; white-space:nowrap;
}
.table tbody td{padding:.74rem .9rem; border-color:#E8EEF4; vertical-align:middle;}
.table-hover tbody tr:hover{background:#F5F8FC;}
.btn-icon{width:34px;height:34px;padding:0;display:inline-flex;align-items:center;justify-content:center; border-radius:9px;}
.table th.col-actions,.table td.col-actions{width:1%;white-space:nowrap;vertical-align:middle;}
.col-actions .d-inline{margin-left:.15rem;}
.btn{font-weight:600; border-radius:10px; padding:.42rem .9rem;}
.btn-primary{background:var(--primary); border-color:var(--primary);}
.btn-primary:hover{background:var(--primary-hover); border-color:var(--primary-hover);}
.btn-success{background:var(--success); border-color:var(--success);}
.btn-success:hover{background:#18633E; border-color:#18633E;}
.btn-info{background:var(--info); border-color:var(--info); color:#fff;}
.btn-info:hover{background:#155A70; border-color:#155A70; color:#fff;}
.btn-warning{background:var(--accent); border-color:var(--accent); color:#0B2545;}
.btn-warning:hover{background:#B08E1F; color:#0B2545;}
.btn-secondary{background:#E8EEF6; border-color:#D5DEEA; color:var(--ink-soft);}
.btn-secondary:hover{background:#DCE5F0; border-color:#C9D4E2; color:var(--ink);}
.btn-outline-success{border-color:#1F7A4D; color:#1F7A4D;}
.dropdown-menu{border:1px solid var(--card-line); border-radius:12px; box-shadow:var(--shadow-lg); padding:.4rem;}
.dropdown-item{border-radius:8px; font-weight:600;}
.dropdown-item:hover{background:#F3F7FB;}

.stat-card{
  display:flex; gap:.95rem; align-items:center; padding:1.15rem 1.2rem !important;
  position:relative; overflow:hidden;
}
.stat-card:before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:var(--primary);
}
.stat-card .stat-icon{
  width:48px;height:48px;border-radius:12px; display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; flex-shrink:0;
}
.stat-card .stat-icon.navy{background:#E4EDF8; color:#1B4F8A;}
.stat-card .stat-icon.gold{background:#F7EFCE; color:#8A7010;}
.stat-card .stat-icon.green{background:#DDF3E7; color:#1F7A4D;}
.stat-card .stat-icon.red{background:#F8E2E2; color:#B42318;}
.stat-card .num{font-size:1.42rem; font-weight:800; line-height:1.1; letter-spacing:-.03em;}
.stat-card .label{color:var(--muted); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;}
.badge{font-weight:700; border-radius:999px; padding:.35em .7em;}
.badge-estado-activo{background:#DCF5E4; color:#1C7C42;}
.badge-estado-inactivo{background:#F1F2F5; color:#6B7280;}
.badge-estado-retenido{background:#FDE3E3; color:#C0392B;}
.badge-tx-pendiente{background:#FFF4CC; color:#8A7010;}
.badge-tx-pagado{background:#DCF5E4; color:#1C7C42;}
.badge-tx-anulado{background:#FDE3E3; color:#C0392B;}
.alert-chip{border-left:4px solid var(--primary); background:#F3F7FB; padding:.85rem 1rem; border-radius:10px;}
.corp-tabs{border:0; gap:.4rem;}
.corp-tabs .nav-link{
  border:0 !important; background:#E7EDF5; color:var(--ink-soft); font-weight:700;
  border-radius:10px 10px 0 0; padding:.6rem 1.05rem;
}
.corp-tabs .nav-link.active{background:#fff; color:var(--primary); box-shadow:var(--shadow);}
.tab-panel{border-radius:0 14px 14px 14px;}
.taxi-grid tbody td{vertical-align:top; padding:.95rem .9rem;}
.taxi-cupo{font-weight:800; letter-spacing:.03em; font-size:1.05rem; line-height:1.15;}
.taxi-placa-year{font-weight:800; color:var(--primary); font-size:1.05rem; line-height:1.15;}
.taxi-placa-amt{display:inline-block; margin-top:.2rem; background:#F7EFCE; color:#8A7010; font-weight:700; padding:.12rem .45rem; border-radius:6px; font-size:.82rem;}
.taxi-owner{font-weight:700; text-transform:uppercase; font-size:.86rem; letter-spacing:.02em;}
.taxi-org{color:var(--primary); font-weight:700; font-size:.78rem; text-transform:uppercase; margin-top:.15rem;}
.taxi-vehicle{font-weight:700; text-transform:uppercase; font-size:.86rem;}
.taxi-muted{color:var(--muted); font-size:.85rem;}
.tx-pill{color:#1F7A4D; font-weight:800; letter-spacing:.04em; font-size:.92rem;}
.pago-recibo{font-weight:700; color:var(--primary);}
.pago-amt{font-weight:700; color:#1A6F8A; font-size:.9rem;}
.info-card{display:flex; gap:.85rem; align-items:flex-start; border:1px solid var(--card-line); border-radius:14px; padding:1rem; background:#F8FAFC; height:100%;}
.info-avatar{width:46px;height:46px;border-radius:50%; background:linear-gradient(135deg,#1B4F8A,#0B2545); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; flex-shrink:0;}
.alert-item{display:flex; gap:.8rem; align-items:flex-start; border-radius:12px; padding:.9rem 1rem; border:1px solid var(--card-line);}
.alert-item-icon{width:36px;height:36px;border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.alert-item-informativa{background:#EEF6FB;}
.alert-item-informativa .alert-item-icon{background:#D6EAF8; color:#1A6F8A;}
.alert-item-advertencia{background:#FBF6E8;}
.alert-item-advertencia .alert-item-icon{background:#F7EFCE; color:#8A7010;}
.alert-item-critica{background:#FBECEC;}
.alert-item-critica .alert-item-icon{background:#F8E2E2; color:#B42318;}
.alert-item.is-off{opacity:.65;}
.empty-pane{text-align:center; color:var(--muted); padding:2.2rem 1rem;}
.empty-pane i{font-size:1.8rem; display:block; margin-bottom:.5rem; color:#A8B4C4;}
.timeline{list-style:none; margin:0; padding:0 0 0 1rem;}
.timeline li{position:relative; padding:0 0 1rem 1.2rem;}
.timeline li:last-child{padding-bottom:0;}
.timeline-dot{position:absolute; left:-.35rem; top:.35rem; width:10px; height:10px; border-radius:50%; background:var(--primary);}
.timeline li:before{content:""; position:absolute; left:-.1rem; top:.7rem; bottom:-.2rem; width:2px; background:#D7DEE8;}
.timeline li:last-child:before{display:none;}
.timeline-card{background:#F8FAFC; border:1px solid var(--card-line); border-radius:12px; padding:.75rem .9rem;}
.sidebar-backdrop{display:none;}
body.sidebar-collapsed .sidebar{width:76px;}
body.sidebar-collapsed .brand-text,
body.sidebar-collapsed .nav-section,
body.sidebar-collapsed .sidebar .nav-link span{display:none;}
body.sidebar-collapsed .sidebar .nav-link{justify-content:center; padding:.58rem .4rem;}
body.sidebar-collapsed .brand{padding:.95rem .4rem;}
body.sidebar-collapsed .brand-logo{display:none;}
body.sidebar-collapsed .brand-mark{display:block;}
body.sidebar-collapsed .sidebar .brand:after{left:.7rem; right:.7rem;}

.login-page{min-height:100vh; display:grid; grid-template-columns:1.08fr 1fr;}
.login-panel-brand{
  background:linear-gradient(165deg,#06121F 0%,#0B2545 52%,#1B4F8A 100%);
  color:#fff; padding:4rem 3.6rem; align-items:center; position:relative; overflow:hidden;
}
.login-panel-brand:before{
  content:""; position:absolute; inset:auto -80px -80px auto; width:340px; height:340px; border-radius:50%;
  border:1px solid rgba(201,162,39,.22);
}
.login-panel-brand:after{
  content:""; position:absolute; width:280px;height:280px;border-radius:50%;
  background:rgba(201,162,39,.14); right:-60px;bottom:-40px;
}
.login-panel-brand > div{position:relative; z-index:1;}
.login-panel-brand h1{font-weight:800; margin-bottom:.75rem;}
.login-panel-brand p{color:#C9D2EC; max-width:28rem; font-size:1.05rem;}
.login-logo{
  width:64px;height:64px;border-radius:16px; background:rgba(201,162,39,.18);
  display:flex;align-items:center;justify-content:center; font-size:1.8rem;color:var(--accent);
}
.login-brand-logo{height:68px; width:auto; max-width:300px; display:block; position:relative; z-index:1;}
.login-form-logo{height:52px; width:auto; max-width:220px; display:block;}
.login-points{list-style:none;padding:0;margin:2.1rem 0 0;color:#AAB4D4;}
.login-points li{
  margin-bottom:.65rem; display:flex; align-items:center; gap:.65rem;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.06);
  border-radius:10px; padding:.7rem .85rem; max-width:24rem;
}
.login-points i{color:var(--accent); width:22px;}
.login-panel-form{
  background:
    radial-gradient(1200px 400px at 80% -10%, rgba(27,79,138,.08), transparent 50%),
    var(--bg);
  display:flex;align-items:center;justify-content:center; padding:2rem 1.25rem;
}
.login-card{
  width:min(430px,100%); background:#fff; border:1px solid var(--card-line);
  border-radius:18px; padding:2.1rem 1.85rem; box-shadow:var(--shadow-lg);
}
.login-card-wide{width:min(480px,100%);}
.otp-wrap{margin-top:.15rem;}
.otp-boxes{display:flex; gap:.4rem; justify-content:space-between;}
.otp-digit{
  width:2.7rem; height:3.15rem; text-align:center;
  font-size:1.35rem; font-weight:600; font-family:'Source Sans 3',sans-serif;
  border:1px solid #C9D4E0; border-radius:10px; color:var(--ink); background:#fff;
  caret-color:var(--primary);
}
.otp-digit:focus{
  outline:0; border-color:var(--primary);
  box-shadow:0 0 0 .2rem rgba(27,79,138,.14);
}
.mfa-key{
  background:#F6F8FB; border:1px solid #E4EBF3; border-radius:12px;
  padding:.85rem 1rem; margin:0 0 1.15rem;
}
.mfa-key-label{
  display:block; font-size:.78rem; font-weight:600; color:#6B7687;
  letter-spacing:.04em; text-transform:uppercase; margin-bottom:.35rem;
}
.mfa-key code{
  display:block; font-size:1.02rem; letter-spacing:.12em; color:#0B2545; font-weight:600;
}
.pw-rules{
  list-style:none; padding:.85rem 1rem; margin:0 0 1.15rem;
  background:#F6F8FB; border:1px solid #E4EBF3; border-radius:12px;
}
.pw-rules li{
  display:flex; align-items:flex-start; gap:.55rem;
  font-size:.86rem; font-weight:400; color:#6B7687; margin:.28rem 0; line-height:1.35;
}
.pw-rules li i{width:1rem; margin-top:.12rem; color:#A0AAB8;}
.pw-rules li.ok{color:#2F6B4F;}
.pw-rules li.ok i{color:#2F9E66;}
.pw-rules li.bad{color:#9A3B3B;}
.pw-rules li.bad i{color:#C0392B;}
.login-title{font-size:1.5rem;font-weight:800;margin-bottom:.25rem; letter-spacing:-.03em;}
.login-sub{color:#6B7280;margin-bottom:1.4rem;}
.input-icon{position:relative;}
.input-icon > i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#8891A8; pointer-events:none;}
.input-icon .form-control{padding-left:2.3rem; padding-right:2.6rem; height:48px; border-radius:11px;}
.input-icon.no-left .form-control{padding-left:.85rem;}
.btn-toggle-password{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  border:0; background:transparent; color:#8891A8; padding:.2rem .4rem; line-height:1;
}
.btn-toggle-password:hover{color:var(--ink);}
.error-stack{
  white-space:pre-wrap; word-break:break-word; overflow:auto;
  background:#F8F9FB; padding:1rem; border-radius:8px; max-width:100%;
  font-size:.85rem;
}
.validation-summary-valid{display:none;}
.form-label{font-weight:600; color:var(--ink-soft); font-size:.86rem;}
.form-control,.form-select{border-color:#C9D4E0; border-radius:10px; min-height:42px;}
.form-control:focus,.form-select:focus{border-color:var(--primary); box-shadow:0 0 0 .2rem rgba(27,79,138,.14);}
.modal-content{border:0; border-radius:16px; overflow:hidden; box-shadow:var(--shadow-lg);}
.modal-header{background:linear-gradient(90deg,#0B2545,#163B66); color:#fff; border:0;}
.modal-header .btn-close{filter:invert(1);}
.modal-footer{background:#F7F9FC; border-top:1px solid var(--card-line);}

.swal2-popup{
  font-family:'Source Sans 3','Plus Jakarta Sans',sans-serif !important;
  border-radius:16px !important; font-weight:400 !important;
}
.swal2-title{
  font-weight:600 !important; font-size:1.15rem !important; letter-spacing:0 !important;
  color:var(--ink) !important; line-height:1.35 !important;
}
.swal2-html-container, .swal2-popup .swal2-html-container{
  font-weight:400 !important; font-size:.95rem !important; color:#4B5563 !important;
}
.swal2-confirm, .swal2-cancel{font-weight:600 !important; border-radius:10px !important;}
.swal2-icon{transform:scale(.88);}

@media (max-width: 991.98px){
  .sidebar{position:fixed; z-index:1050; top:0; left:0; height:100%; transform:translateX(-100%); transition:transform .2s ease;}
  .sidebar.show{transform:translateX(0);}
  body.sidebar-collapsed .sidebar{width:var(--sidebar-w); transform:translateX(-100%);}
  body.sidebar-collapsed .sidebar.show{transform:translateX(0);}
  body.sidebar-collapsed .brand-logo{display:block; height:44px; width:auto; max-width:210px; object-fit:contain;}
  body.sidebar-collapsed .brand-mark{display:none;}
  .sidebar-backdrop.show{display:block; position:fixed; inset:0; background:rgba(6,18,31,.45); z-index:1040;}
  .table-responsive-cards thead{display:none;}
  .table-responsive-cards tbody tr{display:block; border:1px solid var(--card-line); border-radius:12px; margin-bottom:.6rem; padding:.5rem .75rem; background:#fff;}
  .table-responsive-cards tbody td{display:flex; justify-content:space-between; border:none;}
}
@media (max-width: 767.98px){
  .login-page{grid-template-columns:1fr;}
  .user-name{display:none;}
  .app-content{padding:1rem;}
  .otp-digit{width:2.35rem; height:2.85rem; font-size:1.15rem;}
}

.caja-panel{background:#fff; border:1px solid var(--card-line); border-radius:14px; padding:1.05rem 1.2rem; height:100%; box-shadow:var(--shadow);}
.caja-panel-title{font-size:1.02rem; color:var(--primary); font-weight:800; margin-bottom:.85rem;}
.caja-placa{color:#C0392B; font-weight:800; font-size:1.15rem; letter-spacing:.03em;}
.caja-chip{display:inline-block; font-weight:700; padding:.35rem .7rem; border-radius:8px; min-width:5.5rem; text-align:center;}
.caja-chip-year{background:#E8EEF6; color:var(--primary);}
.caja-chip-saldo{background:#F8E2E2; color:#C0392B;}
.caja-chip-gold{background:#F7EFCE; color:#8A7010;}
.caja-logo{max-height:64px; max-width:120px; object-fit:contain;}
.caja-tx-bar{background:linear-gradient(90deg,#1B4F8A,#3A78B8); padding:.5rem .75rem;}
.caja-tx-table thead th{background:linear-gradient(90deg,#C9A227,#E0BE55); color:#1F2933; font-weight:800; border:0;}
.tx-year{display:block; font-size:.78rem; color:var(--muted); font-weight:700;}
.taxi-search{position:relative;}
.taxi-search > i{position:absolute; left:12px; top:14px; color:#8891A8;}
.taxi-search input{padding-left:2.2rem; height:46px; border-radius:12px;}
.taxi-search-list{
  position:absolute; z-index:20; left:0; right:0; top:100%; margin-top:6px;
  background:#fff; border:1px solid var(--card-line); border-radius:12px;
  box-shadow:var(--shadow-lg); max-height:280px; overflow:auto;
}
.taxi-search-item{display:block; width:100%; text-align:left; border:0; background:#fff; padding:.7rem .95rem;}
.taxi-search-item:hover,.taxi-search-item.active{background:#F3F7FB;}
.taxi-search-item strong{display:block; color:var(--primary);}
.taxi-search-item span{font-size:.82rem; color:var(--muted);}
.card-section-title{font-size:.92rem; font-weight:800; margin:0; letter-spacing:.01em;}
.gold-rule{height:3px; width:42px; background:var(--accent); border-radius:4px; margin-top:.45rem;}
