/* Global document defaults and small utilities shared by every page.
   Component look-and-feel lives in components.css (Bootstrap theming). */
body {
    color: var(--color-text);
    background: var(--color-canvas);
    font-family: var(--font-family-body);
    line-height: var(--line-height-body);
}

a {
    color: var(--color-primary);
}

a:hover {
    color: var(--color-primary-hover);
}

/* Buttons keep the Fluent focus outline (Bootstrap's wide glow is disabled
   per-variant in components.css; this restores the thin ring). */
.btn:focus-visible,
.btn.focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 1px;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
}

.fs-xs { font-size: var(--font-size-xs) !important; }
.fs-sm { font-size: var(--font-size-md) !important; }
.fs-base { font-size: var(--font-size-base) !important; }
.opacity-60 { opacity: .6 !important; }
.preserve-lines { white-space: pre-wrap; }

::placeholder {
    color: var(--color-text-muted);
    opacity: 1;
}