/* display-prefs.css — global body classes applied by display-prefs.js
 *
 * Set from Settings → Display → Behavior toggles:
 *   body.compact-mode        → Tighter spacing everywhere
 *   body.animations-disabled → Kill transitions/animations (a11y + snap)
 *   body.hide-header-greeks  → Hide [data-header-greek] metrics in top bar
 */

/* ─── Compact mode ──────────────────────────────────────────────────
 * Reduce vertical padding on major surfaces so more fits on one screen.
 * Keep horizontal padding so inputs don't crowd their borders.
 */
body.compact-mode .settings-card,
body.compact-mode .card,
body.compact-mode .widget,
body.compact-mode .widget-card {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
body.compact-mode .form-group { margin-bottom: 10px; }
body.compact-mode .form-group.mt-16 { margin-top: 10px; }
body.compact-mode .form-group.mt-20 { margin-top: 12px; }
body.compact-mode .form-group.mt-24 { margin-top: 14px; }
body.compact-mode h2 { margin-bottom: 8px; }
body.compact-mode h3 { margin-top: 14px !important; margin-bottom: 6px; }
body.compact-mode table td,
body.compact-mode table th { padding-top: 6px !important; padding-bottom: 6px !important; }
body.compact-mode .metric-item { padding-top: 4px; padding-bottom: 4px; }

/* ─── Animations disabled ──────────────────────────────────────────
 * Respects users who want zero motion. Uses !important to override any
 * inline transitions set by components. Does not touch pseudo-classes
 * that depend on transform for layout (none currently).
 */
body.animations-disabled *,
body.animations-disabled *::before,
body.animations-disabled *::after {
    transition: none !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
}

/* ─── Hide Greeks in header ───────────────────────────────────────
 * Targets the metric-item wrappers of Delta (β) and Theta/day, plus their
 * trailing metric-divider siblings so no orphan dividers remain.
 */
body.hide-header-greeks [data-header-greek="1"],
body.hide-header-greeks [data-header-greek="1"] + .metric-divider {
    display: none !important;
}