/* ==========================================================================
   SmartPharmacy Design System — Base / Typography
   ========================================================================== */

/* site.css (ASP.NET scaffold boilerplate) bumps html font-size to 16px at
   >=768px; the app previously compensated with a page-wide `zoom: 90%` hack
   (removed — zoom has known bugs with position/print/media-query math).
   Pin a compact root size directly instead, matching the dense sizing of
   the reference dashboard and every rem-based Bootstrap/component size. */
html {
    font-size: 14px;
}

html, body {
    background-color: var(--ds-bg);
    color: var(--ds-text);
    font-family: var(--ds-font);
}

body {
    margin: 0;
    overflow-x: hidden;
    font-size: .9375rem;
    transition: background-color .2s ease, color .2s ease;
}

/* Text-selection color — browsers default to their own (usually blue)
   highlight otherwise, which ignores the user's chosen accent color and
   can read poorly against the dark theme. Follows --ds-primary/--ds-active
   (already recomputed per accent preset + light/dark mode), so selection
   always matches the current theme instead of the OS/browser default. */
::selection {
    background-color: var(--ds-primary);
    color: #fff;
}

::-moz-selection {
    background-color: var(--ds-primary);
    color: #fff;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--ds-font);
    font-weight: 700;
    color: var(--ds-text);
    letter-spacing: -0.01em;
}

h1 { font-size: 1.75rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.125rem; }
h5 { font-size: 1rem; }
h6 { font-size: .875rem; }

.ds-caption {
    font-size: .8125rem;
    color: var(--ds-text-muted);
}

.ds-label {
    font-size: .8125rem;
    font-weight: 600;
    color: var(--ds-text);
}

.ds-helper-text {
    font-size: .75rem;
    color: var(--ds-text-muted);
}