/* css/base.css
   Layout + global baseline
*/

:root{
  --sidebar-w: 320px;
}

*{ box-sizing: border-box; }

html, body{
  height: 100%;
}

body{
  margin: 0;
  font-family: var(--font-body, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif);
  background: #ffffff;
}

/* Two-column app shell */
.container{
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  min-height: 100vh;
}

/* Collapsed nav */
html.nav-collapsed{
  --sidebar-w: 92px;
}

/* Right panel: THE DARK BACKGROUND YOU LIKED */
.main{
  min-height: 100vh;
  background: radial-gradient(1200px 700px at 30% 20%, rgba(31,73,89,0.55), rgba(1,20,37,0) 55%),
              linear-gradient(180deg, #011425 0%, #061a2a 55%, #011425 100%);
}

/* Content spacing */
.content{
  max-width: 1020px;
  padding: 44px 44px 70px;
}

/* Basic type defaults in dark panel */
h1, h2, h3{
  margin: 0;
  color: rgba(255,255,255,0.94);
}

p{
  margin: 0;
}

/* Responsive */
@media (max-width: 980px){
  .container{
    grid-template-columns: 1fr;
  }
  .sidebar{
    position: relative;
    height: auto;
  }
}