/* ============================================================
   CarGO UTA - Design System v2.0
   Bootstrap 5.3 + custom tokens
   ============================================================ */
:root {
  --nav-height: 60px;
  --admin-sidebar-width: 240px;
  --footer-height: 42px;
  --navy:        #0B1220;
  --navy2:       #17233A;
  --blue:        #2563EB;
  --blue-soft:   #E8F1FF;
  --cyan:        #06B6D4;
  --green:       #10B981;
  --green-soft:  #DCFCE7;
  --warn:        #F59E0B;
  --warn-soft:   #FEF3C7;
  --danger:      #EF4444;
  --danger-soft: #FEE2E2;
  --bg:          #F5F8FC;
  --surface:     #FFFFFF;
  --surface2:    #EEF5FF;
  --surface3:    #F9FBFF;
  --line:        #DCE6F2;
  --text:        #0B1220;
  --text2:       #334155;
  --text3:       #94A3B8;
  --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-xl: 20px;
  --sh-sm: 0 1px 2px rgba(15, 23, 42, .05);
  --sh-md: 0 8px 22px rgba(37, 99, 235, .08);
  --sh-lg: 0 18px 42px rgba(15, 23, 42, .13);
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;padding:0;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:radial-gradient(circle at top left, rgba(219,234,254,.55), transparent 34rem), var(--bg);color:var(--text);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;letter-spacing:-.003em;min-height:100vh;display:flex;flex-direction:column}

/* Navbar */
.cargo-nav{margin:0!important;padding-top:0!important;padding-bottom:0!important;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(15,23,42,.03), 0 10px 30px rgba(15,23,42,.04);min-height:var(--nav-height);height:auto;position:sticky;top:0;z-index:1000;backdrop-filter:blur(12px)}
.cargo-logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--navy);text-decoration:none}
.logo-mark{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--blue),var(--cyan));display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;flex-shrink:0}
.nav-link-cargo{font-size:13px;font-weight:500;color:var(--text2);border-radius:var(--r-sm);padding:7px 12px!important;transition:all .15s;text-decoration:none;display:flex;align-items:center;gap:6px}
.nav-link-cargo:hover,.nav-link-cargo.active{background:var(--blue-soft);color:var(--blue)}
.badge-notif{position:absolute;top:0;right:0;min-width:18px;height:18px;background:var(--danger);color:#fff;border-radius:9px;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid #fff}

/* Avatars */
.av{border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;background:var(--blue);color:#fff}
.av-sm{width:34px;height:34px;font-size:12px}
.av-md{width:48px;height:48px;font-size:17px}
.av-lg{width:72px;height:72px;font-size:26px}
.av-navy{background:var(--navy)}
.av-green{background:var(--green)}
.av-cyan{background:var(--cyan)}

/* Cards */
.card{border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);background:linear-gradient(180deg,#fff,var(--surface3))}
.card-hover{transition:transform .2s,box-shadow .2s;cursor:pointer}
.card-hover:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:#C7D7FE}

/* Stats */
.stat-card{background:linear-gradient(180deg,#fff,var(--surface3));border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh-sm)}
.stat-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text3);margin-bottom:6px}
.stat-val{font-size:28px;font-weight:800;color:var(--navy);line-height:1}

/* Chips/badges */
.chip{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:600}
.chip-blue{background:var(--blue-soft);color:#1D4ED8}
.chip-green{background:var(--green-soft);color:#047857}
.chip-warn{background:var(--warn-soft);color:#92400E}
.chip-danger{background:var(--danger-soft);color:#B91C1C}
.chip-navy{background:var(--navy);color:#fff}
.chip-gray{background:#EDF2F7;color:var(--text2)}

/* Buttons */
.btn-navy,.btn-blue{background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff;border:none;border-radius:var(--r-md);padding:10px 20px;font-weight:700;font-size:14px;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;text-decoration:none;display:inline-flex;align-items:center;gap:6px;box-shadow:0 8px 18px rgba(11,18,32,.14)}
.btn-navy:hover,.btn-blue:hover{background:linear-gradient(135deg,var(--blue),#1D4ED8);color:#fff;transform:translateY(-1px);box-shadow:0 10px 22px rgba(37,99,235,.22)}
.btn-green{background:var(--green);color:#fff;border:none;border-radius:var(--r-md);padding:10px 20px;font-weight:600;font-size:14px;cursor:pointer;transition:background .15s;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.btn-green:hover{background:#059669;color:#fff}
.btn-outline{background:transparent;color:var(--navy);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 20px;font-weight:600;font-size:14px;cursor:pointer;transition:all .15s;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.btn-outline:hover{background:var(--surface2);color:var(--navy)}

/* Forms */
.form-control,.form-select{border:1px solid var(--line);border-radius:var(--r-md);font-size:14px;padding:10px 12px;transition:border-color .15s,box-shadow .15s;width:100%;font-family:inherit}
.form-control:focus,.form-select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.14);outline:none}
.form-label{font-size:12px;font-weight:700;color:var(--text);margin-bottom:5px;display:block}
.form-group{margin-bottom:16px}

/* Tables */
.table-cargo{width:100%;font-size:13px;border-collapse:collapse}
.table-cargo th{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#8190AA;border-bottom:1px solid var(--line);padding:10px 12px;background:linear-gradient(180deg,#F4F8FF,#EEF5FF);text-align:left}
.table-cargo td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle}
.table-cargo tbody tr:hover{background:#F7FAFF}
.table-cargo tbody tr:last-child td{border-bottom:none}

/* Route visual */
.route-display{display:flex;align-items:flex-start;gap:12px}
.route-spine{display:flex;flex-direction:column;align-items:center;padding-top:4px}
.dot-start{width:10px;height:10px;background:var(--blue);border-radius:50%;flex-shrink:0}
.dot-line{width:2px;height:30px;background:var(--line)}
.dot-end{width:10px;height:10px;background:var(--navy);border-radius:3px;flex-shrink:0}

/* GPS pulse */
@keyframes gpsPulse{0%{transform:scale(.9);opacity:.85}70%{transform:scale(2.4);opacity:0}100%{transform:scale(2.4);opacity:0}}
.gps-dot{position:relative;width:12px;height:12px;border-radius:50%;background:var(--green);flex-shrink:0}
.gps-dot::before{content:'';position:absolute;inset:0;border-radius:50%;background:var(--green);animation:gpsPulse 1.8s ease-out infinite}

/* Stars rating */
.stars-wrap{display:flex;flex-direction:row-reverse;gap:4px}
.stars-wrap input{display:none}
.stars-wrap label{font-size:28px;color:var(--line);cursor:pointer;transition:color .1s}
.stars-wrap label:hover,.stars-wrap label:hover~label,.stars-wrap input:checked~label{color:var(--warn)}

/* Hero / Landing */
.hero{background:linear-gradient(135deg,var(--navy) 0%,var(--navy2) 60%,#1e3a5f 100%);color:#fff;border-radius:var(--r-xl);padding:48px 40px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-40px;right:-40px;width:280px;height:280px;border-radius:50%;background:rgba(59,130,246,.1)}
.hero h1{font-size:38px;font-weight:800;letter-spacing:-.03em;line-height:1.1;margin-bottom:14px}
.hero p{font-size:16px;opacity:.8;line-height:1.6}
.hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:28px}
.hero-stat{background:rgba(255,255,255,.1);border-radius:var(--r-lg);padding:16px;text-align:center}
.hero-stat strong{display:block;font-size:22px;font-weight:800}
.hero-stat span{font-size:12px;opacity:.7}

/* Dashboard grid */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}

/* Trip card */
.trip-card{background:linear-gradient(180deg,#fff,var(--surface3));border:1px solid var(--line);border-radius:var(--r-lg);padding:16px;transition:transform .2s,box-shadow .2s,border-color .2s}
.trip-card:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:#C7D7FE}
.trip-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--text2);padding-top:10px;border-top:1px dashed var(--line)}

/* Notifications */
.notif-item{display:flex;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);transition:background .15s}
.notif-item:hover{background:#F7FAFF}
.notif-item.unread{background:#EFF6FF;border-left:3px solid var(--blue)}
.notif-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}

/* Admin sidebar */
.admin-wrap{display:block;flex:0 0 auto;min-height:0}
.admin-sidebar{
  width:var(--admin-sidebar-width);
  background:linear-gradient(180deg,#0B1220,#13233D);
  color:#fff;
  padding:18px 0;
  position:fixed;
  top:var(--nav-height);
  left:0;
  bottom:var(--footer-height);
  height:calc(100vh - var(--nav-height) - var(--footer-height));
  overflow-y:auto;
  z-index:990;
}
.admin-sidebar .nav-section{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.35);padding:14px 20px 6px}
.admin-sidebar a{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.7);padding:10px 20px;font-size:13px;font-weight:500;text-decoration:none;transition:all .15s;border-left:3px solid transparent}
.admin-sidebar a:hover,.admin-sidebar a.active{background:rgba(37,99,235,.18);color:#fff;border-left-color:var(--cyan)}
.admin-content{
  margin-left:var(--admin-sidebar-width);
  padding:28px;
  overflow-x:hidden;
  min-height:0;
}
body.admin-body .cargo-footer,
body:has(.admin-wrap) .cargo-footer{
  flex-shrink:0;
  z-index:1105;
}
.admin-empty-state{
  min-height:180px;
  display:grid;
  place-items:center;
  padding:30px 24px!important;
}
.admin-empty-state i{
  font-size:36px!important;
  color:var(--line)!important;
  display:block;
}
.admin-empty-state h3{
  margin:10px 0 0!important;
  font-size:22px;
  font-weight:800;
}

/* Mobile shell */
.mobile-shell{max-width:430px;min-height:100vh;margin:0 auto;background:var(--bg);position:relative;box-shadow:var(--sh-lg)}
.mobile-content{padding:24px 20px 100px}
.mobile-header{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.mobile-title{font-size:22px;font-weight:800;letter-spacing:-.02em;margin:0}
.mobile-card{background:linear-gradient(180deg,#fff,var(--surface3));border:1px solid var(--line);border-radius:20px;padding:18px;margin-bottom:16px;box-shadow:var(--sh-sm)}
.mobile-card-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--text3);margin-bottom:10px}
.mobile-bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(430px,100%);background:rgba(255,255,255,.94);border-top:1px solid var(--line);padding:10px 24px;display:flex;justify-content:space-around;z-index:100;backdrop-filter:blur(12px)}
.mobile-nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px;font-weight:600;color:var(--text3);text-decoration:none;padding:6px 12px;border-radius:12px;transition:all .15s}
.mobile-nav-item.active,.mobile-nav-item:hover{color:var(--blue);background:var(--blue-soft)}
.mobile-nav-item i{font-size:21px}
.mobile-cta{position:fixed;bottom:78px;left:50%;transform:translateX(-50%);width:min(390px,calc(100% - 40px));background:linear-gradient(135deg,var(--green),#0F766E);color:#fff;border:none;border-radius:18px;padding:18px;font-size:18px;font-weight:800;text-align:center;box-shadow:0 12px 28px rgba(16,185,129,.28);text-decoration:none;z-index:99;display:block;transition:transform .2s}
.mobile-cta:hover{color:#fff;transform:translateX(-50%) translateY(-2px)}

/* Misc */
.page-header{padding:28px 0 20px;margin:0}
.page-header h1{font-size:24px;font-weight:800;letter-spacing:-.02em;margin-bottom:4px;line-height:1.15}
.page-header p{margin-top:0}
.section{padding:0 0 32px}
.fw500{font-weight:500}.fw600{font-weight:600}.fw700{font-weight:700}.fw800{font-weight:800}
.text-navy{color:var(--navy)!important}.text-blue{color:var(--blue)!important}.text-green{color:var(--green)!important}
.text-t2{color:var(--text2)!important}.text-t3{color:var(--text3)!important}
.cargo-footer{background:rgba(255,255,255,.9);border-top:1px solid var(--line);padding:0;color:var(--text2);font-size:12px;margin-top:0;backdrop-filter:blur(10px);height:42px;min-height:42px;overflow:visible;position:relative;z-index:1105}
.cargo-footer .container-fluid{height:100%;min-height:100%;display:flex;align-items:center}
.cargo-footer .container-fluid>.d-flex{width:100%}
.footer-logo{width:86px;max-height:28px;height:auto;object-fit:contain;display:block}
.footer-copy{font-size:11px;white-space:nowrap}
.main-content{flex:0 0 auto;display:flex;flex-direction:column;min-height:0}
.main-content .card.p-5.text-center,
.main-content .text-center.py-5.card,
.main-content .card.text-center.py-5{
  padding:30px 24px!important;
}
.main-content .card.p-5.text-center i,
.main-content .text-center.py-5.card i,
.main-content .card.text-center.py-5 i{
  font-size:36px!important;
}
.main-content .card.p-5.text-center h3,
.main-content .text-center.py-5.card h3,
.main-content .card.text-center.py-5 h3{
  margin-top:10px!important;
  font-size:22px;
}

/* Responsive */
@media(max-width:1100px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:991px){
  .admin-wrap{display:flex;flex-direction:column}
  .admin-sidebar{position:static;width:100%;min-height:auto;height:auto;padding:10px 0}
  .admin-content{margin-left:0;padding:20px 16px}
  body.admin-body .cargo-footer,
  body:has(.admin-wrap) .cargo-footer{margin-left:0;width:100%}
}
@media(max-width:991px){
  .cargo-nav{height:auto;min-height:var(--nav-height)}
  .cargo-nav .container-fluid{align-items:center}
  .cargo-nav .navbar-toggler{width:42px;height:42px;border:1px solid var(--line)!important;border-radius:12px;background:#fff;display:grid;place-items:center;box-shadow:var(--sh-sm)}
  .cargo-nav .navbar-toggler:focus{box-shadow:0 0 0 3px rgba(59,130,246,.16)}
  .cargo-nav .navbar-collapse{position:absolute;top:calc(100% + 8px);left:12px;right:12px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-lg);padding:10px;z-index:1001}
  .cargo-nav .navbar-nav{gap:4px!important;margin-top:0!important}
  .cargo-nav .nav-link-cargo{width:100%;padding:10px 12px!important;border-radius:10px;font-size:14px}
  .cargo-nav .navbar-nav.ms-auto{border-top:1px solid var(--line);margin-top:8px!important;padding-top:8px;align-items:stretch!important}
  .cargo-nav .dropdown-menu{position:static!important;transform:none!important;width:100%;margin-top:6px;border:1px solid var(--line);box-shadow:none}
  .cargo-logo img{width:118px!important}
}
@media(max-width:576px){.footer-logo{width:78px}.footer-copy{font-size:10px}.cargo-footer{padding:6px 0}}
@media(max-width:768px){.stats-grid{grid-template-columns:1fr 1fr}.hero{padding:28px 20px}.hero h1{font-size:26px}}
@media(max-width:576px){.stats-grid{grid-template-columns:1fr 1fr}.stat-val{font-size:22px}}

.chip-gray{background:#EDF2F7;color:var(--text2)}
.role-chip-btn{border:0;cursor:pointer;font-family:inherit;line-height:1.2;transition:transform .15s,box-shadow .15s,opacity .15s}
.role-chip-btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(15,23,42,.12);opacity:.95}
.role-chip-muted{opacity:.45}

/* Tablas responsive: evita que las columnas se corten en mobile */
.card:has(.table-cargo){
  overflow-x:auto!important;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}
.card:has(.table-cargo)::-webkit-scrollbar{height:8px}
.card:has(.table-cargo)::-webkit-scrollbar-track{background:#EEF5FF;border-radius:999px}
.card:has(.table-cargo)::-webkit-scrollbar-thumb{background:#B8C7DD;border-radius:999px}
.card:has(.table-cargo)::-webkit-scrollbar-thumb:hover{background:#94A3B8}

@media(max-width:768px){
  .card:has(.table-cargo){
    max-width:100%;
  }
  .table-cargo{
    min-width:760px;
    white-space:nowrap;
  }
  .admin-content .table-cargo{
    min-width:980px;
  }
  .table-cargo th,
  .table-cargo td{
    padding:10px 12px;
  }
}

/* Fallback explicito para tablas en mobile */
.table-scroll{
  overflow-x:auto!important;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}
.table-scroll::-webkit-scrollbar{height:8px}
.table-scroll::-webkit-scrollbar-track{background:#EEF5FF;border-radius:999px}
.table-scroll::-webkit-scrollbar-thumb{background:#B8C7DD;border-radius:999px}
.table-scroll::-webkit-scrollbar-thumb:hover{background:#94A3B8}
@media(max-width:768px){
  .table-scroll{max-width:100%}
  .table-scroll .table-cargo{min-width:980px;white-space:nowrap}
}

/* Toasts y confirmaciones globales */
.cargo-toast-root{
  position:fixed;
  top:76px;
  right:22px;
  z-index:2140;
  width:min(340px,calc(100vw - 28px));
  display:flex;
  flex-direction:column;
  gap:12px;
  pointer-events:none;
}
.cargo-toast{
  position:relative;
  display:grid;
  grid-template-columns:38px 1fr 28px;
  gap:10px;
  align-items:flex-start;
  min-height:72px;
  padding:14px 12px 12px 14px;
  border-radius:10px;
  color:#fff;
  box-shadow:0 16px 34px rgba(15,23,42,.22);
  overflow:hidden;
  pointer-events:auto;
  transform:translateX(24px);
  opacity:0;
  transition:transform .24s ease,opacity .24s ease;
}
.cargo-toast.is-visible{transform:translateX(0);opacity:1}
.cargo-toast.is-leaving{transform:translateX(24px);opacity:0}
.cargo-toast-success{background:linear-gradient(135deg,#178A3D,#1F9D55)}
.cargo-toast-error{background:linear-gradient(135deg,#DC2626,#EF4444)}
.cargo-toast-warning{background:linear-gradient(135deg,#F59E0B,#FBBF24);color:#231B08}
.cargo-toast-info{background:linear-gradient(135deg,#1D4ED8,#3B82F6)}
.cargo-toast-icon{
  width:32px;
  height:32px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.2);
  font-size:18px;
}
.cargo-toast-warning .cargo-toast-icon{background:rgba(255,255,255,.34)}
.cargo-toast-title{font-weight:900;font-size:14px;line-height:1.1;margin-bottom:3px}
.cargo-toast-message{font-size:12px;line-height:1.35;font-weight:500;opacity:.95}
.cargo-toast-close{
  width:26px;
  height:26px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:inherit;
  opacity:.74;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:background .15s,opacity .15s;
}
.cargo-toast-close:hover{background:rgba(255,255,255,.16);opacity:1}
.cargo-toast-warning .cargo-toast-close:hover{background:rgba(0,0,0,.08)}
.cargo-toast-progress{
  position:absolute;
  left:0;
  bottom:0;
  height:3px;
  width:100%;
  background:rgba(255,255,255,.42);
  transform-origin:left;
  animation:cargoToastProgress 5s linear forwards;
}
.cargo-toast-warning .cargo-toast-progress{background:rgba(0,0,0,.18)}
@keyframes cargoToastProgress{from{transform:scaleX(1)}to{transform:scaleX(0)}}

.cargo-confirm-modal .modal-content{
  border:0;
  border-radius:16px;
  box-shadow:0 24px 70px rgba(15,23,42,.28);
}
.modal{
  z-index:1300;
}
.modal-backdrop{
  z-index:1290;
}
.cargo-confirm-modal .modal-body{padding:22px}
.cargo-confirm-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.cargo-confirm-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:var(--warn-soft);
  color:#B45309;
  font-size:20px;
}
.cargo-confirm-close{
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  background:#F1F5F9;
  color:var(--text2);
  display:grid;
  place-items:center;
}
.cargo-confirm-close:hover{background:#E2E8F0}
.cargo-confirm-title{font-size:20px;font-weight:900;color:var(--navy);margin-bottom:6px}
.cargo-confirm-message{font-size:14px;color:var(--text2);margin-bottom:18px}
.cargo-confirm-actions{display:flex;gap:10px;justify-content:flex-end}
.cargo-confirm-actions .btn-outline,.cargo-confirm-actions .btn-navy{min-width:118px;justify-content:center}
.cargo-confirm-danger{background:linear-gradient(135deg,#991B1B,#B91C1C)!important}
.cargo-confirm-danger:hover{background:linear-gradient(135deg,#DC2626,#EF4444)!important}
.driver-note-box{
  display:flex;
  gap:10px;
  background:#E0F2FE;
  border:1px solid #7DD3FC;
  color:#0C4A6E;
  border-radius:12px;
  padding:14px 16px;
}
@media(max-width:576px){
  .cargo-toast-root{top:68px;right:14px;left:14px;width:auto}
  .cargo-confirm-actions{flex-direction:column-reverse}
  .cargo-confirm-actions .btn-outline,.cargo-confirm-actions .btn-navy{width:100%}
}


.profile-role-chip{
  width:auto;
  min-width:64px;
  max-width:max-content;
  justify-content:center;
  padding:4px 14px;
  font-size:11px;
  line-height:1;
  margin:2px auto 0;
}
@media(max-width:576px){
  .profile-role-chip{
    min-width:58px;
    padding:4px 12px;
    font-size:10px;
  }
}

/* Layout global final: navbar fijo arriba, sidebar estable, footer al fondo */
html,
body{
  height:100%;
  margin:0;
  padding:0;
}
body{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  overflow-x:hidden;
}
body.admin-body{
  overflow:hidden;
}
.cargo-nav{
  position:sticky;
  top:0;
  z-index:1200;
  flex:0 0 auto;
}
.main-content{
  flex:1 0 auto;
  min-height:0;
  padding-bottom:0;
}
body.admin-body .main-content{
  height:calc(100dvh - var(--nav-height));
  overflow:hidden;
}
.main-content > .container,
.main-content > .container-fluid{
  padding-top:22px;
  padding-bottom:28px;
}
body.admin-body .admin-wrap{
  height:100%;
  min-height:0;
}
.admin-content{
  margin-left:var(--admin-sidebar-width);
  padding:28px;
  height:calc(100dvh - var(--nav-height) - var(--footer-height));
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding-bottom:28px;
}
.page-header,
body.admin-body .page-header,
.driver-page .page-header{
  padding:0 0 22px;
  margin:0;
}
.page-header h1,
body.admin-body .page-header h1,
.driver-page .page-header h1{
  font-size:24px;
  font-weight:800;
  letter-spacing:-.02em;
  margin:0 0 4px;
  line-height:1.15;
}
.page-header p,
body.admin-body .page-header p,
.driver-page .page-header p{
  margin:0;
}
.cargo-footer{
  min-height:var(--footer-height);
  margin-top:0;
  flex:0 0 auto;
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  z-index:1205;
}
.cargo-footer .container-fluid{
  min-height:calc(var(--footer-height) - 12px);
  display:flex;
  align-items:center;
}
.cargo-footer .container-fluid>.d-flex{
  width:100%;
}
.footer-logo{
  width:92px;
  max-height:30px;
  height:auto;
  object-fit:contain;
  display:block;
}
.footer-copy{
  margin-left:auto;
  white-space:nowrap;
}
body.admin-body .cargo-footer{
  left:0;
  width:100%;
}
@media(max-width:991px){
  body.admin-body{
    overflow:auto;
  }
  body.admin-body .main-content{
    height:auto;
    overflow:visible;
  }
  body.admin-body .admin-wrap{
    height:auto;
  }
  .admin-content{
    margin-left:0;
    padding:24px 16px 24px;
    min-height:0;
    height:auto;
    overflow-y:visible;
    padding-bottom:24px;
  }
  .main-content > .container,
  .main-content > .container-fluid{
    padding-top:18px;
    padding-bottom:24px;
  }
  body.admin-body .cargo-footer{
    left:0;
    width:100%;
  }
}