/* Shared glyph/control colors; changing a root theme also changes an unsaved preview. */
[data-brand]{--app-icon-color:var(--brand-action)}
[data-brand] .bi{color:var(--app-icon-color)!important}
[data-brand] .btn:has(.bi){--action-color:var(--brand-action)}
/* Filled notifications require a contrasting close glyph rather than an accent on its own color. */
[data-brand] .toastx{--app-icon-color:currentColor}
[data-brand] .toastx .btn{--action-color:currentColor}
[data-brand] input[type="checkbox"],[data-brand] input[type="radio"]{accent-color:var(--brand-action)}
[data-brand] .form-check-input{border-color:var(--line)}
[data-brand] .form-check-input:checked,[data-brand] .form-check-input[type="checkbox"]:indeterminate{background-color:var(--brand-action);border-color:var(--brand-action)}
[data-brand] input[type="checkbox"]:focus-visible:not(.is-invalid):not(.invalid):not([aria-invalid="true"]),[data-brand] input[type="radio"]:focus-visible:not(.is-invalid):not(.invalid):not([aria-invalid="true"]){outline:2px solid var(--field-focus-color,var(--brand-action));outline-offset:3px}
[data-brand] .form-check-input:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"]){border-color:var(--field-focus-color,var(--brand-action));box-shadow:0 0 0 .2rem color-mix(in srgb,var(--field-focus-color,var(--brand-action)) 25%,transparent)}
[data-brand] .form-switch .form-check-input:focus{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2352606b'/%3e%3c/svg%3e")}
[data-brand] .form-switch .form-check-input:checked{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")}
[data-bs-theme="dark"][data-brand] .form-check-input:checked[type="checkbox"]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23151c21' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}
[data-bs-theme="dark"][data-brand] .form-check-input:checked[type="radio"]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23151c21'/%3e%3c/svg%3e")}
[data-bs-theme="dark"][data-brand] .form-check-input[type="checkbox"]:indeterminate{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23151c21' stroke-linecap='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e")}
[data-bs-theme="dark"][data-brand] .form-switch .form-check-input:focus{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23c0c9d0'/%3e%3c/svg%3e")}
[data-bs-theme="dark"][data-brand] .form-switch .form-check-input:checked{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23151c21'/%3e%3c/svg%3e")}

/* Body-mounted labels avoid clipping inside the compact sidebar scroll area. */
.navigation-label {
    position: fixed;
    z-index: 1080;
    pointer-events: none;
    max-width: min(24rem, calc(100vw - 1rem));
    padding: .6rem .85rem;
    border: 1px solid var(--line);
    border-radius: .5rem;
    background: var(--surface);
    color: var(--ink);
    box-shadow: 0 .25rem .8rem rgb(0 0 0 / .2);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.form-range::-webkit-slider-thumb{background:var(--brand-action)}
.form-range::-moz-range-thumb{background:var(--brand-action)}
.form-range:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"])::-webkit-slider-thumb{box-shadow:0 0 0 .25rem color-mix(in srgb,var(--field-focus-color,var(--brand-action)) 25%,transparent)}
.form-range:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"])::-moz-range-thumb{box-shadow:0 0 0 .25rem color-mix(in srgb,var(--field-focus-color,var(--brand-action)) 25%,transparent)}

/* Account interaction role: keep palette identity and resting commands unchanged. */
html[data-field-highlight="primary"]{--field-focus-color:var(--bs-primary)}
html[data-field-highlight="accent"]{--field-focus-color:var(--brand-action)}
html[data-field-highlight="base"]{--field-focus-color:var(--custom-highlight-base,var(--bs-primary))}
html[data-field-highlight]:not([data-field-highlight="default"]) .form-control:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"]),html[data-field-highlight]:not([data-field-highlight="default"]) .form-select:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"]){border-color:var(--field-focus-color);box-shadow:0 0 0 .25rem color-mix(in srgb,var(--field-focus-color) 25%,transparent)}
html[data-field-highlight]:not([data-field-highlight="default"]) .form-range:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"])::-webkit-slider-thumb{box-shadow:0 0 0 .25rem color-mix(in srgb,var(--field-focus-color) 25%,transparent)}
html[data-field-highlight]:not([data-field-highlight="default"]) .form-range:focus:not(.is-invalid):not(.invalid):not([aria-invalid="true"])::-moz-range-thumb{box-shadow:0 0 0 .25rem color-mix(in srgb,var(--field-focus-color) 25%,transparent)}

/* Explicit choices also style interactive indicators; default retains existing theme behavior. */
html[data-field-highlight]:not([data-field-highlight="default"]){--interaction-highlight:var(--field-focus-color);--app-hover-bg:color-mix(in srgb,var(--interaction-highlight) 12%,var(--surface));--app-selected-bg:color-mix(in srgb,var(--interaction-highlight) 18%,var(--surface))}
html[data-field-highlight]:not([data-field-highlight="default"]) body .btn:not(.btn-danger):not(.btn-outline-danger):not(.btn-success):not(.btn-outline-success):not(.btn-warning):not(.btn-outline-warning):not(.btn-info):not(.btn-outline-info):is(:hover,:focus-visible):not(:disabled){--action-color:var(--interaction-highlight);--app-icon-color:var(--interaction-highlight);outline-color:var(--interaction-highlight)}
html[data-field-highlight]:not([data-field-highlight="default"]) :is(.app-nav-link,.app-nav-summary,.app-user-menu-link,.app-switcher-link,.settings-navigation-link,.app-sidebar-settings-link,.dropdown-item,.directory-entry,.contact-directory-entry):is(:hover,:focus-visible,.active,.selected){--app-icon-color:var(--interaction-highlight);background-color:var(--app-hover-bg);box-shadow:inset 3px 0 0 var(--interaction-highlight);outline-color:var(--interaction-highlight)}
html[data-field-highlight]:not([data-field-highlight="default"]) .dropdown-item:is(:hover,:focus-visible,.active){color:var(--ink)}
html[data-field-highlight]:not([data-field-highlight="default"]) .appearance-choice[aria-pressed="true"]{border-color:var(--interaction-highlight);box-shadow:inset 0 0 0 1px var(--interaction-highlight)}

[data-bs-theme][data-brand="custom"] .form-check-input:checked[type="checkbox"]{--bs-form-check-bg-image:var(--custom-check-image)}
[data-bs-theme][data-brand="custom"] .form-check-input:checked[type="radio"]{--bs-form-check-bg-image:var(--custom-radio-image)}
[data-bs-theme][data-brand="custom"] .form-switch .form-check-input:checked{--bs-form-switch-bg:var(--custom-switch-image)}

/* Real preview and application commands share visible default interaction indicators. */
[data-brand] .dropdown-item:is(:hover,:focus,.active){background-color:var(--app-hover-bg);color:var(--ink);box-shadow:inset 3px 0 0 var(--field-focus-color,var(--brand-action))}
[data-brand] .dropdown-item:focus-visible{outline:2px solid var(--field-focus-color,var(--brand-action));outline-offset:-2px}
[data-brand] body .btn:not(.btn-link):hover:not(:disabled){box-shadow:inset 0 0 0 1px var(--action-color,var(--brand-action))}
[data-brand] body .btn:not(.btn-link):focus-visible:not(:disabled){outline:2px solid var(--action-color,var(--brand-action));outline-offset:2px}