/* ==========================================================================
   Chrome palette and responsive scale tokens (--fh-shell-max, gutter, etc.).
   Owning feature: shared / base
   Load order is defined in Views/Shared/_CssIncludes.cshtml — do not reorder.
   ========================================================================== */

/* ==========================================================================
   FileHub overview screen — visual refactor (Bootstrap 5 + Font Awesome)
   ========================================================================== */
:root {
  /* Chrome brand — matched to SihubDrive_Overview.html (light shell,
     near-black ink, brighter blue). One palette for navbar, sidebar, well. */
  --fh-primary: #2563eb;
  --fh-primary-dark: #1d4ed8;
  --fh-border: #eaebef;
  --fh-muted: #6b7280;
  --fh-soft: #f7f8fa;
  --fh-bg: #f4f5f7;
  --fh-sidebar: #ffffff;
  --fh-sidebar-2: #f7f8fa;
  /* Hover/selected wash — same family as --fh-primary-soft so the drawer
     matches selected cards, list rows, and tree-picker rows. */
  --fh-sidebar-hover: #eff6ff;
  --fh-text: #14161a;
  --fh-ink: #14161a;
  /* Rendered .fh-navbar height. Declared here with the other chrome tokens
     so the shell's padding-top / drawer inset cannot resolve to unset
     before the later :root block that restates the same number. */
  --fh-header-h: 4.25rem;

  /* ---- Responsive scale tokens ------------------------------------------
     One place to reason about how the app grows, so individual components
     stop hard-coding their own pixel caps and drifting apart.

     The app's breakpoint ladder is 480 / 576 / 768 / 1024 / 1440 /
     1920 / 2560 / 3840. Media queries use the `.98` upper bounds
     (575.98/767.98/1023.98/1439.98/…) so a `max-width` rule and the
     `min-width` rule above it can never both match at the boundary — a
     viewport of exactly 768px used to satisfy both `max-width: 768px` and
     the desktop defaults.

     --fh-shell-max  Widest the centered app shell is allowed to grow.
                     Full well on laptops; stepped caps from 1920 so FHD–
                     4K stay readable instead of edge-to-edge or a 1440px
                     grey island. Values are overridden in the wide-screen
                     token blocks below (same queries as the grid/gap ladder).
     --fh-read-max   Cap for reading-width surfaces (search, home, storage)
                     where unbounded line length hurts rather than helps.
                     Grows more conservatively than the shell.
     --fh-preview-max  File-preview modal dialog width (Bootstrap modal-xl
                     default at smaller widths; steps up from 1920).
     --fh-gutter     Horizontal page padding, scaling with the viewport.
                     Cap is raised on the 2560 / 3840 bands in content.css.
     --fh-card-pad / --fh-modal-pad  Surface padding for Bootstrap .card
                     and .modal; declared with the spacing ladder in
                     layouts/content.css so they step with row/well padding. */
  --fh-shell-max: 100%;
  --fh-read-max: min(100%, 72rem);
  --fh-preview-max: 1140px;
  --fh-gutter: clamp(0.75rem, 0.45rem + 1.1vw, 2.5rem);
}