:root {
  --sidebar-width: 290px;
}

.app-shell{
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
  min-height: calc(100vh - 56px);
}

.sidebar{
  position: sticky;
  top: 56px;
  height: calc(100vh - 56px);
  overflow: auto;
}

.content{
  min-width: 0;
}

.container-narrow{
  /* max-width: 760px;
  margin: 40px auto; */
    margin: 5px auto;
}

.auth-shell{
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.auth-shell .card{
  width: min(430px, 92vw);
  border-radius: 4px;
}

.brand-dot{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #0d6efd, #20c997);
}

.avatar{
  width: 40px;
  height: 40px;
    border-radius: 4px;
  display: grid;
  place-items: center;
  font-weight: 700;
}

.kpi{
   border-radius: 4px;
}

.card{
   border-radius: 4px;
}

@media (max-width: 992px) {
  .app-shell{ grid-template-columns: 1fr; }
  .sidebar{ position: static; height: auto; }
}


.hover-card{transition:transform .12s ease, box-shadow .12s ease; cursor:pointer;}
.hover-card:hover{transform:translateY(-2px); box-shadow:0 .75rem 1.5rem rgba(0,0,0,.08)!important;}
.icon-pill{width:44px;height:44px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;}

.policy-content h2,.policy-content h3,.policy-content h4{margin-top:1rem;}
.policy-content p{color:#374151;}
.policy-content ul{padding-left:1.2rem;}


/* ===== Responsive Sidebar Fix ===== */

.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 56px 0 0 0;
  background: rgba(0,0,0,.35);
  z-index: 1038;
}

@media (max-width: 992px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: fixed;
    top: 56px;
    left: 0;
    height: calc(100vh - 56px);
    width: 260px;
    max-width: 85vw;
    background: #fff;
    border-right: 1px solid rgba(0,0,0,.1);
    transform: translateX(-110%);
    transition: transform .25s ease;
    z-index: 1039;
    overflow-y: auto;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
  }

  body.sidebar-open .sidebar {
    transform: translateX(0);
  }

  body.sidebar-open .sidebar-overlay {
    display: block;
  }
}

/* Active menu */
.sidebar .nav-link.active {
  background: rgba(13,110,253,.12);
  border-radius: 4px;
  font-weight: 600;
}

.p-4 {
  padding: 1em !important;
}