:
root{
  --brand:#0033A0;
  --bg:#f9fafb;
  --card:#ffffff;
  --text:#1f2937;
  --muted:#6b7280;
  --border:#e5e7eb;
  --hover:rgba(0,51,160,0.08);
}
*{box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--text)}
.auth-body{
  min-height:100vh;
  background:radial-gradient(circle at top, #e5efff 0, #dde7f5 35%, #c7d5ee 70%, #b0c4e3 100%);
  display:flex;
  align-items:center;
  justify-content:center;
}

.wrapper{display:flex;min-height:100vh}
.sidebar{width:260px;background:#fff;border-right:1px solid var(--border);position:sticky;top:0;height:100vh;padding:16px 12px}
.sidebar .brand{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--brand);font-size:1.1rem;margin-bottom:4px}
.sidebar .small{color:var(--muted)}
.nav-section{margin-top:14px}

/*CONFIGURAÇÕES BARRA DE*/
.nav-title {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:transparent;
  border:0;color:var(--muted);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:12px 14px;
  margin:4px 2px 6px;
  border-radius:8px
}






.nav-title:hover{background:var(--hover);color:var(--brand);cursor:pointer}
.nav-divider{height:1px;width:100%;background:var(--border);margin:6px 0 10px;border-radius:1px}
.nav-group{padding:4px 4px 10px}
.nav-group.collapsed{display:none}
.nav-link{display:flex;align-items:center;gap:10px;color:var(--text);padding:10px 12px;border-radius:10px;text-decoration:none}
.nav-link:hover{background:var(--hover);color:var(--brand)}
.nav-link.active{background:rgba(0,51,160,0.10);color:var(--brand);border:1px solid rgba(0,51,160,0.65)}
.main{flex:1;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 22px;border-bottom:1px solid var(--border);background:#fff;position:sticky;top:0;z-index:10}
.topbar .title{font-weight:700;color:var(--brand)}
.content{padding:20px}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 20px rgba(0,0,0,.04)}
.table{color:var(--text)}
.table-hover tbody tr:hover{background:#f3f4f6}
.form-control,.form-select{background:#fff;color:var(--text);border-color:var(--border)}
.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:none}
.btn-primary{background:var(--brand);border-color:var(--brand)}
.btn-outline-light{border-color:var(--brand);color:var(--brand)}
.btn-outline-light:hover{background:var(--brand);color:#fff}
.badge-dark{background:#e5e7eb;color:#111827}
.kpi .value{font-size:2.25rem;font-weight:700}
.app-footer{margin-top:auto;border-top:1px solid var(--border);background:#fff;color:var(--muted);padding:12px 22px;font-size:.95rem;display:flex;align-items:center;justify-content:space-between}
@media(max-width:992px){.sidebar{position:fixed;left:-280px;transition:left .25s ease;z-index:1000}.sidebar.open{left:0}.main{margin-left:0}}

/* === Super Fix: botões e contraste no tema claro === */
.btn-outline-light{ border-color:#0d6efd; color:#0d6efd; }
.btn-outline-light:hover{ background:#0d6efd; color:#fff; }
.btn-primary{ background:#0d6efd; border-color:#0d6efd; }
.btn-primary:hover{ background:#0b5ed7; border-color:#0b5ed7; }
.card{ background:#fff; border:1px solid #dee2e6; box-shadow:0 2px 6px rgba(0,0,0,.06); }
.sidebar{ background:#fff; border-right:1px solid #dee2e6; }

/* === UX: foco suave (elevação) e estados de validação === */
.form-control, .form-select, textarea {
  transition: box-shadow .2s ease, border-color .2s ease, transform .06s ease;
}
.form-control:focus, .form-select:focus, textarea:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 .2rem rgba(0,77,97,.18);
  transform: translateY(-1px);
}

/* Validação compatível com Bootstrap-like */
.is-invalid { border-color: #dc3545 !important; }
.is-invalid:focus { box-shadow: 0 0 0 .2rem rgba(220,53,69,.15); }
.is-valid { border-color: #198754 !important; }
.is-valid:focus { box-shadow: 0 0 0 .2rem rgba(25,135,84,.15); }
.invalid-feedback { color: #dc3545; font-size: .875rem; margin-top: .25rem; display: none; }
.is-invalid + .invalid-feedback { display: block; }

/* === Dark mode (usa classes e CSS vars) === */
body.dark {
  --bg:#0f172a;
  --card:#0b1220;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --border:#172036;
  --hover:rgba(0,51,160,0.08);
}
body.dark .sidebar { background:#0b1220; border-color:var(--border); }
body.dark .sidebar .brand, body.dark .sidebar .nav-title { color:#cdeafe; }
body.dark .topbar { background:#0b1220; border-color:var(--border); color:var(--text); }
body.dark .card { background:#0b1220; border-color:var(--border); }
body.dark .table { color:var(--text); }
body.dark .nav-link { color:var(--text); }
body.dark .nav-link.is-active { background:#0b2d2f!important; border-color:#174e57!important; color:#9de2e8!important; }


/* === Seta visível em <select> === */
select.form-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg fill='none' height='10' viewBox='0 0 20 10' width='20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L10 9L19 1' stroke='%23004d61' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 14px 10px;
  padding-right: 2rem;
}
select.form-select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 .15rem rgba(0,77,97,.2);
}


/* === Smooth hover animation on sidebar submenus === */
.sidebar .submenu a,
.sidebar .submenu .nav-link,
.sidebar .nav .nav-item .submenu .nav-link {
  transition: transform .18s ease, background-color .18s ease, color .18s ease;
  will-change: transform;
}
.sidebar .submenu a:hover,
.sidebar .submenu .nav-link:hover {
  transform: translateX(6px);
  background-color: rgba(0,0,0,.04);
}
body.dark .sidebar .submenu a:hover,
body.dark .sidebar .submenu .nav-link:hover {
  background-color: rgba(255,255,255,.06);
}
/* subtle indicator on hover */
.sidebar .submenu .nav-link:hover i,
.sidebar .submenu a:hover i { transform: translateX(2px); transition: transform .18s ease; }


/* === Fancy Hover & Active for Sidebar === */
.sidebar .nav-link{
  position: relative;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
  overflow: hidden;
}
.sidebar .nav-link::before{
  content:"";
  position:absolute; left:8px; top:50%;
  width:6px; height:6px; border-radius:3px;
  background: transparent;
  transform: translateY(-50%) scale(0);
  transition: transform .18s ease, background .18s ease;
}
.sidebar .nav-link:hover{
  background: var(--hover);
  color: var(--brand);
  transform: translateX(2px);
}
.sidebar .nav-link:hover::before{ background: var(--brand); transform: translateY(-50%) scale(1); }

/* Active (clicked/route) */
.sidebar .nav-link.is-active{
  background: rgba(0,51,160,0.10);
  color: var(--brand);
  border: 1px solid rgba(0,51,160,0.65);
  box-shadow: 0 4px 12px rgba(0,0,0,.04);
}
.sidebar .nav-link.is-active::before{
  background: var(--brand);
  width: 6px; height: 6px; left: 8px;
  transform: translateY(-50%) scale(1);
}

/* Submenu indent animation */
.sidebar .submenu .nav-link{ padding-left: 28px; }
.sidebar .submenu .nav-link:hover{ transform: translateX(4px); }
.sidebar .nav-title i{ transition: transform .18s ease; }
/* Ícone principal destacado */
.nav-title i:first-child{ font-size:1.8rem; color:var(--brand); }

.sidebar .nav-section.open .nav-title i{ transform: rotate(180deg); }


/* === Sidebar FX v10: Left Bar + Gradients + Ripple === */
:root{
  --grad1: #0ea5e9;  /* sky-500 */
  --grad2: #22d3ee;  /* cyan-400 */
  --gradHover: linear-gradient(90deg, rgba(14,165,233,0.10), rgba(34,211,238,0.06));
  --gradActive: linear-gradient(90deg, rgba(14,165,233,0.18), rgba(34,211,238,0.12));
}
.sidebar .nav-link{
  position: relative;
  overflow: hidden;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
  will-change: transform;
}
/* vertical animated bar */
.sidebar .nav-link::before{
  content:"";
  position:absolute; left:6px; top:8px; bottom:8px;
  width:0;
  background: linear-gradient(180deg, var(--grad1), var(--grad2));
  border-radius:3px;
  transform: scaleY(0);
  transition: transform .18s ease, width .18s ease, opacity .18s ease;
  opacity: 0;
}
.sidebar .nav-link:hover{
  background: var(--gradHover);
  color: var(--brand);
  transform: translateX(2px);
}
.sidebar .nav-link:hover::before{
  width:4px;
  transform: scaleY(1);
  opacity: 1;
}
.sidebar .nav-link.is-active{
  background: var(--gradActive);
  color: var(--brand);
  border: 1px solid rgba(34,211,238,0.35);
  box-shadow: 0 4px 12px rgba(0,0,0,.04);
}
.sidebar .nav-link.is-active::before{
  width:6px;
  transform: scaleY(1);
  opacity: 1;
}

/* submenu indent */
.sidebar .submenu .nav-link{ padding-left: 30px; }
.sidebar .submenu .nav-link:hover{ transform: translateX(4px); }

/* ripple element */
.sidebar .nav-link .ripple{
  position:absolute;
  border-radius:50%;
  background: radial-gradient(circle, rgba(34,211,238,0.35) 0%, rgba(34,211,238,0.20) 40%, rgba(34,211,238,0.00) 70%);
  transform: scale(0);
  pointer-events:none;
  animation: ripple .6s ease-out forwards;
}
@keyframes ripple{
  to{ transform: scale(3); opacity: 0; }
}


/* === Sidebar FX v11: Floating Highlight Tracker (unique hover) === */
.sidebar{
  position: sticky;
  top: 0;
  overflow: hidden;
}
.sidebar .hover-highlight{
  position:absolute;
  left:8px;
  width: calc(100% - 16px);
  height:42px;
  border-radius:12px;
  background: radial-gradient(120px 40px at 20% 50%, rgba(34,211,238,0.22), rgba(14,165,233,0.12) 60%, rgba(14,165,233,0.0) 80%),
              linear-gradient(90deg, rgba(14,165,233,0.14), rgba(34,211,238,0.14));
  box-shadow: 0 8px 24px rgba(14,165,233,0.10);
  transform: translateY(-60px) scale(0.98);
  opacity: 0;
  pointer-events:none;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), opacity .22s ease, width .22s ease;
}
/* icon and text micro-parallax on hover */
.sidebar .nav-link{ transform: translateZ(0); }
.sidebar .nav-link:hover i{ transform: translateX(2px); transition: transform .18s ease; }
.sidebar .nav-link:hover{ color: var(--brand); }
body.dark .sidebar .hover-highlight{
  background: radial-gradient(120px 40px at 20% 50%, rgba(34,211,238,0.30), rgba(14,165,233,0.18) 60%, rgba(14,165,233,0.0) 80%),
              linear-gradient(90deg, rgba(14,165,233,0.18), rgba(34,211,238,0.18));
  box-shadow: 0 10px 30px rgba(34,211,238,0.16);
}

.sidebar .hover-highlight{display:none !important}


/* === Sidebar FX v12: Shimmer Ribbon (distinct) === */
:root{
  --ribbon1:#00c2ff;
  --ribbon2:#00ffa3;
  --glassHover: rgba(0,0,0,0.03);
  --glassHoverDark: rgba(255,255,255,0.06);
}
.sidebar .nav-link{
  position:relative;
  overflow:hidden;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
/* Left ribbon that shimmers */
.sidebar .nav-link::before{
  content:"";
  position:absolute; left:6px; top:10px; bottom:10px;
  width:4px;
  border-radius:8px;
  background: linear-gradient(180deg, var(--ribbon1), var(--ribbon2));
  box-shadow: 0 0 0 rgba(0,0,0,.0);
  transform: scaleY(.6);
  opacity:.7;
  transition: width .22s ease, transform .22s ease, box-shadow .22s ease, opacity .22s ease;
}
/* Diagonal shimmer sweep */
.sidebar .nav-link::after{
  content:"";
  position:absolute; left:0; top:0; right:0; bottom:0;
  background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.35) 12%, transparent 24%);
  background-size: 200% 100%;
  transform: translateX(-60%);
  opacity:0;
  pointer-events:none;
  transition: transform .6s cubic-bezier(.2,.8,.2,1), opacity .3s ease;
}
.sidebar .nav-link:hover{
  background: var(--glassHover);
  color: var(--brand);
  transform: translateX(2px);
}
body.dark .sidebar .nav-link:hover{ background: var(--glassHoverDark); }
.sidebar .nav-link:hover::before{
  width:6px; transform: scaleY(1);
  box-shadow: 0 6px 18px rgba(0, 194, 255, .25);
  opacity:1;
}
.sidebar .nav-link:hover::after{
  transform: translateX(30%);
  opacity:.7;
}
/* Active state */
.sidebar .nav-link.is-active{
  background: linear-gradient(90deg, rgba(0,194,255,.12), rgba(0,255,163,.08));
  color: var(--brand);
  border: 1px solid rgba(0,194,255,.35);
  box-shadow: 0 6px 18px rgba(0,0,0,.05);
}
.sidebar .nav-link.is-active::before{
  width:7px; transform: scaleY(1);
  box-shadow: 0 8px 22px rgba(0, 255, 163, .25);
  opacity:1;
}

/* v13 override: neutralize shimmer sweep on hover */
.sidebar .nav-link::after{background:none!important;opacity:0!important;}


/* === Sidebar FX v13: Magnetic Underline (distinct & clean) === */
:root{
  --ul1:#00c2ff;
  --ul2:#22d3ee;
}
.sidebar .nav-link{
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
  transition: color .16s ease, transform .16s ease;
}
/* Underline track */
.sidebar .nav-link .underline{
  position:absolute; left:14px; right:14px; bottom:8px;
  height:2px; background: linear-gradient(90deg, var(--ul1), var(--ul2));
  transform: scaleX(0);
  transform-origin: left;
  border-radius:2px;
  transition: transform .22s cubic-bezier(.2,.8,.2,1);
  pointer-events:none;
}
.sidebar .nav-link:hover .underline{
  transform: scaleX(1);
}
.sidebar .nav-link:hover{ color: var(--brand); transform: translateX(1px); }
/* Active: thicker underline + subtle left rail */
.sidebar .nav-link.is-active{
  background: rgba(0,194,255,.06);
  border: 1px solid rgba(0,194,255,.35);
}
.sidebar .nav-link.is-active .underline{
  transform: scaleX(1);
  height:3px;
}
.sidebar .nav-link.is-active::before{
  content:""; position:absolute; left:6px; top:10px; bottom:10px; width:4px;
  background: linear-gradient(180deg, var(--ul1), var(--ul2)); border-radius:3px;
}
/* Submenu indentation preserved */
.sidebar .submenu .nav-link{ padding-left:30px; }


/* === Sidebar FX v14: Corner Fold Glass (distinct) === */
/* neutralize previous underline/shimmer visuals */
.sidebar .nav-link .underline{ display:none !important; }

.sidebar .nav-link{
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .18s ease, color .18s ease, box-shadow .18s ease;
}
/* glass backdrop */
.sidebar .nav-link::before{
  content:"";
  position:absolute; inset:4px;
  border-radius:12px;
  background: rgba(0,194,255,0);
  backdrop-filter: blur(0px);
  transform: scale(1);
  transition: background .22s ease, backdrop-filter .22s ease, transform .22s ease;
  z-index: 0;
}
/* corner fold ribbon */
.sidebar .nav-link::after{
  content:"";
  position:absolute; right:10px; top:-10px;
  width:22px; height:22px; border-radius:4px;
  background: linear-gradient(135deg, #00c2ff, #00ffa3);
  box-shadow: 0 6px 14px rgba(0,194,255,.20);
  transform: rotate(45deg) scale(0);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
  z-index: 1;
}
.sidebar .nav-link:hover{
  color: var(--brand);
  transform: translateX(2px);
}
.sidebar .nav-link:hover::before{
  background: rgba(0,194,255,.08);
  backdrop-filter: blur(2px);
}
.sidebar .nav-link:hover::after{
  transform: rotate(45deg) scale(1);
}

/* active state */
.sidebar .nav-link.is-active{
  color: var(--brand);
  box-shadow: 0 6px 16px rgba(0,0,0,.05);
  border: 1px solid rgba(0,194,255,.30);
}
.sidebar .nav-link.is-active::before{
  background: rgba(0,194,255,.12);
  backdrop-filter: blur(2px);
}
.sidebar .nav-link.is-active::after{
  transform: rotate(45deg) scale(1);
}

/* submenu spacing preserved */
.sidebar .submenu .nav-link{ padding-left: 26px; }


/* JOBEL Azul Rei theme additions */
:root{
  --brand:#0033A0;
  --brand-dark:#001A55;
  --brand-soft:rgba(0,51,160,0.08);
  --brand-border:rgba(0,51,160,0.45);
}

.btn-primary{
  background-color:var(--brand);
  border-color:var(--brand);
}
.btn-primary:hover,
.btn-primary:focus{
  background-color:var(--brand-dark);
  border-color:var(--brand-dark);
}

.text-brand{ color:var(--brand); }

.sidebar .brand-logo img,
.auth-logo img{
  max-height:52px;
  width:auto;
}

.sidebar-badge{
  margin:8px 0 14px;
  padding:8px 10px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--brand),var(--brand-dark));
  color:#fff;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
  box-shadow:0 8px 18px rgba(0,51,160,.35);
}
.sidebar-badge i{
  font-size:.9rem;
}

.auth-wrapper{
  min-height:calc(100vh - 40px);
  background:radial-gradient(circle at top left,rgba(0,51,160,.18),transparent 55%),
             radial-gradient(circle at bottom right,rgba(0,51,160,.20),transparent 55%),
             #f3f4f6;
}
.auth-card{
  max-width:420px;
  border-radius:18px;
  border:1px solid rgba(148,163,184,.35);
  box-shadow:0 18px 45px rgba(15,23,42,.12);
  backdrop-filter:blur(12px);
}

footer.app-footer{
  margin-top:auto;
  width:100%;
  border-top:1px solid var(--brand-border);
  background:linear-gradient(90deg,#001A55,#0033A0);
  color:#e5e7eb;
  font-size:.78rem;
}
footer.app-footer .inner{
  padding:8px 16px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px;
}
@media (max-width:576px){
  footer.app-footer .inner{ text-align:center; }
}

/* === FINAL OVERRIDE: Base de submenus unificada === */
.sidebar .nav-link{
  display:flex;
  align-items:left !important;
  gap:8px;
  padding:8px 18px;
  font-size:13px;
  font-weight:500;
  color:var(--muted);
  border-radius:10px;
  text-decoration:none;
  position:relative;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.sidebar .nav-link i{
  font-size:1.05rem;
  color:var(--muted);
}
.sidebar .nav-link:hover{
  color:var(--brand);
  transform: translateX(2px);
}
.sidebar .nav-link:hover i{
  color:var(--brand);
}

/*BARRA DE NAVEGAÇÃO DO MENU*/
.sidebar {
  height: 100vh;
  overflow-y: auto;
}


/* === Unificar cor do item ativo no sidebar === */
.sidebar .nav-link.active,
.sidebar .sub-item.active {
    background: #dbe8ff !important;
    color: #003c8f !important;
    border-radius: 6px;
}
  

/* Ícone do ativo */
.sidebar .nav-link.active i,
.sidebar .sub-item.active i {
    color: #0d47a1 !important;
}










/* Linha do título da seção (GERAL, CADASTROS, etc.) */
.nav-title{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
  gap: 8px;
  padding: 8px 12px;
  background: none;
  border: 0;
}

/* Ícone grande da esquerda (velocímetro, pasta, engrenagem) */
.nav-title-icon{
  flex-shrink: 0;
}

/* Texto da seção */
.nav-title span{
  flex: 1;
  text-align: left;
}

/* Seta sempre grudada na direita */
.nav-title-caret{
  margin-left: auto;
}

/* Esconde grupos colapsados */
.nav-group.collapsed{
  display: none;
}







/* Força o tamanho da fonte em TODOS os submenus da sidebar */
.sidebar .nav-group .nav-link{
  font-size: 14px !important;   /* ajuste aqui: 15, 16, 17… */
}

/* Se quiser, aumenta também o ícone dos submenus */
.sidebar .nav-group .nav-link i{
  font-size: 1.2rem !important;
}

.sidebar,
.menu,
.navbar,
#sidebar,
.left-menu {
    position: relative !important;
    z-index: 9999 !important;
}


/* CORREÇÃO DEFINITIVA PARA LIBERAR CLIQUES NA SIDEBAR */
.sidebar, 
#sidebar, 
.app-sidebar {
    position: relative !important;
    z-index: 99999 !important;
    pointer-events: auto !important;
}

/* Qualquer overlay ou área do relatório deve ficar atrás da sidebar */
.report-wrapper,
.report-container,
.print-area,
.content-area,
.page-body,
#report {
    position: relative !important;
    z-index: 1 !important;
    pointer-events: auto !important;
}



/* === Dashboard PRO cards === */
.stat-card{
  border:0;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  color:#fff;
  box-shadow:0 10px 25px rgba(17,24,39,.08);
}
.stat-card .stat-body{padding:16px 18px}
.stat-card .stat-title{font-size:.85rem;opacity:.9;margin:0}
.stat-card .stat-value{font-size:2rem;font-weight:800;line-height:1.1;margin-top:6px}
.stat-card .stat-sub{font-size:.8rem;opacity:.9;margin-top:6px}
.stat-card .stat-icon{
  width:46px;height:46px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.18);
  backdrop-filter: blur(6px);
}
.stat-card .stat-icon i{font-size:1.5rem}
.stat-card::after{
  content:'';
  position:absolute;inset:-40% -30% auto auto;
  width:220px;height:220px;border-radius:50%;
  background:rgba(255,255,255,.14);
  transform:rotate(12deg);
}
.bg-grad-blue{background:linear-gradient(135deg,#0d6efd 0%,#0aa2c0 100%)}
.bg-grad-indigo{background:linear-gradient(135deg,#4f46e5 0%,#0d6efd 100%)}
.bg-grad-green{background:linear-gradient(135deg,#16a34a 0%,#22c55e 100%)}
.bg-grad-amber{background:linear-gradient(135deg,#f59e0b 0%,#f97316 100%)}
.bg-grad-red{background:linear-gradient(135deg,#dc3545 0%,#fb7185 100%)}
.bg-grad-slate{background:linear-gradient(135deg,#334155 0%,#64748b 100%)}

.card-soft{
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 10px 25px rgba(17,24,39,.06);
}
.progress.pro{
  height:12px;border-radius:999px;background:#e9ecef;overflow:hidden;
}
.progress.pro .progress-bar{
  border-radius:999px;
}

/* === Sidebar polish === */
.sidebar{
  border-right:1px solid var(--border);
  background:linear-gradient(180deg,#ffffff 0%, #f8fafc 100%);
}
.nav-title{
  transition:background .15s ease, transform .15s ease;
}
.nav-title:active{transform:scale(.99)}
.nav-link{
  border:1px solid transparent;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.nav-link:hover{transform:translateX(2px)}
.nav-link.active{
  border-color:rgba(13,110,253,.25);
  box-shadow:0 8px 18px rgba(13,110,253,.10);
}
.nav-link.active::before{
  content:'';
  position:absolute;
  left:10px;
  width:6px;height:22px;
  border-radius:8px;
  background:var(--brand);
}
.nav-link{position:relative}



/* Sidebar UX: caret rotation + smoother sections */
.nav-section[aria-expanded="true"] .nav-title-caret,
.nav-section.open .nav-title-caret{
  transform:rotate(180deg);
}
.nav-title-caret{transition:transform .18s ease}
.nav-group{padding-left:6px}
.brand{
  display:flex;align-items:center;gap:10px;
  font-weight:800;
}
.brand i{font-size:1.4rem}
.sidebar .small{margin-bottom:12px;color:var(--muted)}
.nav-divider{opacity:.6}

