:root{
  --brand-blue:#0038A8;
  --brand-blue-2:#007BFF;
  --brand-gradient:linear-gradient(180deg,#0038A8 0%,#007BFF 100%);
  --sidebar-bg:#0A0E19;
  --text-light:#E5E7EB;
  --icon-muted:#D1D5DB;
  --divider:rgba(255,255,255,0.08);
}

/* Sidebar container */
.sidebar{
  width:260px; /* slightly wider */
  min-height:100vh;
  background:linear-gradient(180deg,#0A0E19 0%,#111828 100%);
  border-right:1px solid rgba(255,255,255,0.05);
  box-shadow:0 10px 30px rgba(0,0,0,0.25);
  border-top-right-radius:20px;
  border-bottom-right-radius:20px;
  position:fixed;
  top:0;left:0;
  overflow-y:auto;
  z-index:1000;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.sidebar-brand{padding:1.5rem 1rem;border-bottom:1px solid var(--divider);} 
.sidebar-brand .logo{max-height:48px;width:auto;filter: drop-shadow(0 0 6px rgba(0,123,255,0.4));}
.sidebar-subtitle{font-size:12px;letter-spacing:1px;color:#9CA3AF;margin:0;}
.sidebar-divider{height:1px;background:rgba(255,255,255,0.06);margin:.75rem 1rem 0 1rem;}

.sidebar-nav{padding:1rem 0;}
.sidebar .nav-link{
  display:flex;align-items:center;gap:.65rem;
  color:rgba(255,255,255,0.7);
  padding:.8rem 1.2rem;
  margin:.15rem .75rem;
  border-radius:.5rem;
  position:relative;
  border-left:3px solid transparent;
  transition:all .2s ease-in-out;
}
.sidebar .nav-link i{font-size:1.25rem;width:22px;text-align:center;color:var(--icon-muted);transition:color .2s ease, filter .2s ease;}
.sidebar .nav-link span{white-space:nowrap;}
.sidebar .nav-link:hover{background:rgba(255,255,255,0.05);color:#fff;transform: translateX(2px);} 
.sidebar .nav-link:hover i{color:#007BFF;filter:drop-shadow(0 0 6px rgba(0,123,255,0.4));}
.sidebar .nav-link.active{background:linear-gradient(90deg, rgba(0,56,168,0.8) 0%, rgba(0,123,255,0.8) 100%);color:#fff !important;font-weight:600;box-shadow: inset 0 0 12px rgba(0,123,255,0.25);border-left-color:transparent;border-radius:10px;}
.sidebar .nav-link.active::before{content:'';position:absolute;left:0;top:10%;height:80%;width:3px;background:#007BFF;border-radius:3px;}
.sidebar .nav-link.active i{color:#fff;filter:drop-shadow(0 0 8px rgba(0,123,255,0.5));}

/* Separation to main content */
.main-content{margin-left:260px;width:calc(100% - 260px);} 

/* Collapsed behavior */
body.sidebar-collapsed .sidebar{width:80px;}
body.sidebar-collapsed .main-content{margin-left:80px;width:calc(100% - 80px);} 
body.sidebar-collapsed .sidebar .nav-link{justify-content:center;padding:.8rem .5rem;}
body.sidebar-collapsed .sidebar .nav-link span{display:none;}
body.sidebar-collapsed .sidebar-brand .logo{max-height:40px;}
body.sidebar-collapsed .sidebar-subtitle{display:none;}

/* Responsive auto-collapse */
@media (max-width: 768px){
  .sidebar{transform:translateX(-100%);transition:transform .25s ease;}
  .sidebar.sidebar-open{transform:translateX(0);}  
  .main-content{margin-left:0;width:100%;}
}

/* Scrollbar styling */
.sidebar::-webkit-scrollbar{width:6px;}
.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:10px;}

/* Sidebar footer icons */
.sidebar-footer{border-top:1px solid rgba(255,255,255,0.1);} 
.sidebar-footer a{opacity:.7;transition:all .2s ease;}
.sidebar-footer a:hover{opacity:1;transform:scale(1.1);} 

/* Navbar polish */
.navbar{border-bottom:1px solid #e5e7eb;}
.navbar .form-control:focus{border-color:#007bff;box-shadow:none;}
.navbar .navbar-nav i:hover{color:#007bff;cursor:pointer;}

/* Tables and buttons */
.table thead th{font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;color:#6b7280;border-bottom:none;}
.btn-sm{border-radius:8px;}

/* === ACTION BUTTONS === */
.btn-icon{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:10px;border:none;transition:all .2s ease;background-color:#f9fafb;}
.btn-icon i{font-size:1.1rem;transition:all .2s ease;}

/* VIEW BUTTON */
.btn-view{color:#007bff;}
.btn-view:hover{background:rgba(0,123,255,.1);box-shadow:0 2px 8px rgba(0,123,255,.25);transform:translateY(-2px);} 

/* EDIT BUTTON */
.btn-edit{color:#6c757d;}
.btn-edit:hover{background:rgba(108,117,125,.1);box-shadow:0 2px 8px rgba(108,117,125,.25);transform:translateY(-2px);} 

/* DELETE BUTTON */
.btn-delete{color:#dc3545;}
.btn-delete:hover{background:rgba(220,53,69,.1);box-shadow:0 2px 8px rgba(220,53,69,.25);transform:translateY(-2px);} 

/* ACKNOWLEDGE BUTTON */
.btn-ack{color:#28a745;}
.btn-ack:hover{background:rgba(40,167,69,.1);box-shadow:0 2px 8px rgba(40,167,69,.25);transform:translateY(-2px);} 

/* === TABLE REFINEMENTS === */
.table tbody tr {
    -webkit-transition: background-color 0.15s ease !important;
    -moz-transition: background-color 0.15s ease !important;
    -o-transition: background-color 0.15s ease !important;
    transition: background-color 0.15s ease !important;
}
.table tbody tr:hover,
.table-hover tbody tr:hover {
    background-color: #eff6ff !important;
}
.table tbody tr.project-row,
.table tbody tr.trip-row,
.table tbody tr.vehicle-row {
    -webkit-transition: background-color 0.15s ease !important;
    -moz-transition: background-color 0.15s ease !important;
    -o-transition: background-color 0.15s ease !important;
    transition: background-color 0.15s ease !important;
}
.table tbody tr.project-row:hover,
.table tbody tr.trip-row:hover,
.table tbody tr.vehicle-row:hover,
.table-hover tbody tr.project-row:hover,
.table-hover tbody tr.trip-row:hover,
.table-hover tbody tr.vehicle-row:hover {
    background-color: #eff6ff !important;
} 

/* === ADD COMPANY BUTTON === */
.btn-primary{border-radius:10px;padding:.55rem 1.25rem;font-weight:500;box-shadow:0 2px 8px rgba(0,123,255,.25);} 
.btn-primary:hover{box-shadow:0 3px 12px rgba(0,123,255,.35);} 

/* Outline small buttons fallback (for legacy tables not yet migrated to btn-icon) */
.btn-outline-primary.btn-sm,.btn-outline-secondary.btn-sm,.btn-outline-danger.btn-sm,.btn-outline-success.btn-sm{
  border-radius:10px;background:#f9fafb;transition:all .2s ease;
}
.btn-outline-primary.btn-sm:hover{box-shadow:0 2px 8px rgba(0,123,255,.25);} 
.btn-outline-secondary.btn-sm:hover{box-shadow:0 2px 8px rgba(108,117,125,.25);} 
.btn-outline-danger.btn-sm:hover{box-shadow:0 2px 8px rgba(220,53,69,.25);} 
.btn-outline-success.btn-sm:hover{box-shadow:0 2px 8px rgba(40,167,69,.25);} 

/* Subtle card padding */
.card-body{padding:2rem 2.5rem;}



