/* Shared palette. Legacy light colors remain the first argument of light-dark(). */
:root {
    color-scheme: light dark;
    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%231e3a5f' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --theme-ink: #e3ebf5;
    --theme-muted: #a5b5c9;
    --theme-surface: #182638;
    --theme-raised: #203148;
    --theme-canvas: #101b2a;
    --theme-line: #3a4c63;
    --theme-control-line: #7388a3;
    --theme-accent: #8fc4ff;
    --theme-info-soft: #1c3550;
    --theme-positive: #87dcb2;
    --theme-positive-soft: #193d33;
    --theme-warning: #f4cd82;
    --theme-warning-soft: #3d321f;
    --theme-danger: #ffaaa3;
    --theme-danger-soft: #442d31;
    --surface: light-dark(#fff, var(--theme-surface));
    --border: light-dark(#dce3e8, var(--theme-line));
}
/* Standalone capture/scanner pages also need readable unstyled and visited links. */
:where(a, a:visited) { color: light-dark(#2265ad, var(--theme-accent)); }
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
/* Logos are artwork, not interface colors. Use the supplied inverse artwork on dark surfaces. */
html[data-theme="dark"] :is(.account-brand, .clock-brand, .enrollment-brand, .setup-brand, .device-brand) img { content: url('/img/brand/mitchell-logo-horizontal-light.svg'); }
@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) :is(.account-brand, .clock-brand, .enrollment-brand, .setup-brand, .device-brand) img { content: url('/img/brand/mitchell-logo-horizontal-light.svg'); }
}

/* SVG chevrons cannot inherit the color scheme; select the matching artwork. */
html[data-theme="dark"] { --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%238fc4ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
@media (prefers-color-scheme: dark) { html:not([data-theme="light"]) { --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%238fc4ff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); } }

/* Paper previews and printing keep their original palette and artwork. */
.contractor-badge { color-scheme: light; }
@media print {
    html:root, html[data-theme] { color-scheme: light; --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%231e3a5f' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
    .theme-options, .user-menu-trigger, .appearance-footer { display: none !important; }
    html :is(.account-brand, .clock-brand, .enrollment-brand, .setup-brand, .device-brand) img { content: url('/img/brand/mitchell-logo-horizontal-dark.svg') !important; }
}

/* Compact account menu and the same appearance choices on standalone pages. */
.user-menu-trigger { display:inline-flex; align-items:center; gap:.55rem; min-height:2.5rem; padding:.2rem .55rem .2rem .2rem; border:1px solid #ffffff36; border-radius:2rem; background:#ffffff0c; color:#fff; font:inherit; font-size:.8rem; cursor:pointer; }
.user-menu-trigger:hover { background:#ffffff22; }
.user-menu-trigger:focus-visible { outline:2px solid #fff; outline-offset:3px; }
.user-menu-avatar { display:grid; place-items:center; width:2rem; height:2rem; border-radius:50%; background:#d4e5f4; color:#19324d; font-size:.7rem; font-weight:700; }
.user-menu-name { max-width:12rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.user-menu-chevron { color:#c9d8e8; }
.action-menu-popover.user-menu-popover { width:19rem; padding:1rem; border-radius:.75rem; }
.user-menu-identity { display:grid; gap:.25rem; padding-bottom:1rem; border-bottom:1px solid var(--border); overflow-wrap:anywhere; }
.user-menu-identity > span, .user-menu-identity small { color:light-dark(#526377,var(--theme-muted)); font-size:.75rem; }
.user-menu-identity strong { font-size:.95rem; }
.theme-options { min-width:0; margin:0; padding:1rem 0; border:0; color:light-dark(#19324d,var(--theme-ink)); font:inherit; }
.theme-options legend { float:left; width:100%; margin-bottom:.6rem; padding:0; font-size:.75rem; font-weight:600; }
.theme-option-list { display:flex; clear:both; gap:.3rem; padding:.25rem; border:1px solid light-dark(#dce3e8,var(--theme-line)); border-radius:.55rem; background:light-dark(#f3f6f8,var(--theme-canvas)); }
.theme-option-list label { position:relative; display:flex; justify-content:center; align-items:center; gap:.35rem; flex:1; min-height:2.5rem; padding:.3rem .5rem; border:1px solid transparent; border-radius:.35rem; color:light-dark(#526377,var(--theme-muted)); font-size:.75rem; cursor:pointer; }
.theme-option-list input { position:absolute; opacity:0; width:1px; height:1px; }
.theme-option-list label:has(input:checked) { border-color:light-dark(#b9ccdf,var(--theme-control-line)); background:light-dark(#fff,var(--theme-raised)); color:light-dark(#19324d,var(--theme-ink)); box-shadow:0 1px 3px #00000014; }
.theme-option-list label:has(input:focus-visible) { outline:2px solid light-dark(#2265ad,var(--theme-accent)); outline-offset:2px; }
.user-menu-signout { border-top:1px solid var(--border); padding-top:.5rem; }
.user-menu-signout .sign-out-form { display:block; }
.appearance-footer { display:flex; justify-content:center; padding:.5rem 1rem; }
.appearance-footer .theme-options { width:18rem; }
@media(max-width:680px) { .user-menu-name, .user-menu-chevron { display:none; } .user-menu-trigger { padding:.2rem; } }