/**
 * App Layout - Main Grid Structure
 *
 * Definerer den overordnede app-struktur med sidebar og main content
 */

/* ===========================================
   MAIN APP GRID
   =========================================== */
swp-app-layout {
  display: grid;
  grid-template-columns: var(--side-menu-width) 1fr;
  grid-template-rows: var(--topbar-height) 1fr;
  height: 100vh;
  transition: grid-template-columns var(--transition-normal);
}

/* ===========================================
   COLLAPSED MENU STATE
   =========================================== */
swp-app-layout.menu-collapsed {
  grid-template-columns: var(--side-menu-width-collapsed) 1fr;
}

/* ===========================================
   MAIN CONTENT AREA
   =========================================== */
swp-main-content {
  display: block;
  overflow-y: auto;
  background: var(--color-background);
}

/* ===========================================
   DRAWER OVERLAY
   Styles moved to drawers.css for consistency with calpoc
   =========================================== */
