/* ═══════════════════════════════════════════════════════════════════════════
   Layout Tokens — Single source of truth for responsive layout dimensions.
   Loaded FIRST by all pages. All layout CSS references these variables.
   Target: PC/laptop only (1024px – 1920px+)
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  --layout-sidebar:       248px;
  --layout-sidebar-right: 248px;
  --layout-nav-h:         52px;
  --layout-search-row-h:  60px;
  --layout-padding:       1.25rem;
}

@media (max-width: 1440px) {
  :root {
    --layout-sidebar:       220px;
    --layout-sidebar-right: 220px;
    --layout-padding:       1.1rem;
  }
}

@media (max-width: 1280px) {
  :root {
    --layout-sidebar:       200px;
    --layout-sidebar-right: 200px;
    --layout-padding:       0.85rem;
  }
}

@media (max-width: 1100px) {
  :root {
    --layout-sidebar:       185px;
    --layout-sidebar-right: 185px;
    --layout-padding:       0.75rem;
  }
}

@media (max-width: 1024px) {
  :root {
    --layout-sidebar:       165px;
    --layout-sidebar-right: 165px;
    --layout-nav-h:         48px;
    --layout-padding:       0.65rem;
  }
}

@media (max-height: 800px) {
  :root {
    --layout-nav-h:         48px;
    --layout-search-row-h:  52px;
  }
}