/* Host extension: bridge existing SBSOne components to the Starter palette.
   The upstream adapter owns native components; status and request-type colors
   remain semantic. Higher shell specificity resolves legacy page overrides. */
html[data-starter-brand] body[data-starter-theme="dashcode"] :is(.home-page, .approval-template-page, .area-page, .location-page, .segment-page, .customer-type-page, .customer-page, .product-page) {
    --energy-blue: var(--starter-brand-primary);
    --energy-navy: color-mix(in srgb, var(--starter-brand-primary), #101c2b 65%);
    --energy-sky: color-mix(in srgb, var(--starter-brand-primary), white 25%);
    --energy-mist: var(--starter-brand-primary-soft);
    --energy-line: var(--starter-brand-primary-border);
    --energy-primary-gradient: linear-gradient(115deg, color-mix(in srgb, var(--starter-brand-primary), #101c2b 45%), var(--starter-brand-primary-text));
}
html:root[data-starter-brand] body[data-starter-theme="dashcode"] :is(.btn.btn-primary, .btn-primary) {
    background: var(--starter-brand-primary);
    border-color: var(--starter-brand-primary);
    color: var(--starter-brand-primary-contrast);
    --tw-ring-color: rgba(var(--starter-brand-accent-rgb), .45);
}
html:root[data-starter-brand] body[data-starter-theme="dashcode"] :is(.btn.btn-secondary, .btn-secondary) {
    background: var(--starter-brand-secondary);
    border-color: var(--starter-brand-secondary);
    color: var(--starter-brand-secondary-contrast);
    --tw-ring-color: rgba(var(--starter-brand-accent-rgb), .45);
}
html:root[data-starter-brand] body[data-starter-theme="dashcode"] :is(.btn.btn-primary, .btn-primary):is(:hover, :active):not(:disabled, .disabled, [aria-disabled="true"]) {
    background: var(--starter-brand-primary-hover);
    border-color: var(--starter-brand-primary-hover);
    color: var(--starter-brand-primary-contrast);
}
html:root[data-starter-brand] body[data-starter-theme="dashcode"] :is(.btn.btn-secondary, .btn-secondary):is(:hover, :active):not(:disabled, .disabled, [aria-disabled="true"]) {
    background: var(--starter-brand-secondary-hover);
    border-color: var(--starter-brand-secondary-hover);
    color: var(--starter-brand-secondary-contrast);
}
html[data-starter-brand] body[data-starter-theme="dashcode"] :is(.btn-primary, .btn-secondary):is(:disabled, .disabled, [aria-disabled="true"]) { opacity: .6; cursor: not-allowed; }
html[data-starter-brand] body[data-starter-theme="dashcode"] :is(.btn-primary, .btn-secondary, .btn-outline-primary, .btn-outline-secondary, .form-control, .form-select):not(.is-invalid):focus-visible {
    outline: 3px solid var(--starter-brand-accent-text);
    outline-offset: 2px;
}
html[data-starter-brand] body[data-starter-theme="dashcode"] :is(.form-control, .form-select):not(.is-invalid):focus { border-color: var(--starter-brand-accent-text); }
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-ai-workspace {
    border-color: var(--starter-brand-primary-text);
    background: linear-gradient(115deg, #142538, color-mix(in srgb, var(--starter-brand-primary), #142538 55%));
}
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-ai-emblem {
    background: rgba(var(--starter-brand-primary-rgb), .3);
    border-color: rgba(var(--starter-brand-accent-rgb), .6);
}
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-kicker { color: var(--starter-brand-primary-soft); }
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-hero::before { background: linear-gradient(90deg, var(--starter-brand-primary) 0% 40%, var(--starter-brand-secondary) 40% 70%, var(--starter-brand-accent) 70%); }
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-request-stat-link { background: var(--starter-brand-primary-soft); border-color: var(--starter-brand-primary-border); }
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-request-stat-icon { color: var(--starter-brand-primary-contrast); background: var(--starter-brand-primary); }
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-request-stat-link:focus-visible { outline: 3px solid var(--starter-brand-accent-text); }
html[data-starter-brand] body[data-starter-theme="dashcode"] .home-request-search-popup .home-search-suggestion:is(:hover, .is-active, :focus-visible) { background: var(--starter-brand-primary-soft); outline-color: var(--starter-brand-accent-text); }
html.dark[data-starter-brand] body[data-starter-theme="dashcode"] .home-request-stat-link { background: #17344b; }

/* Keep page-size text clear of native select arrows, including three-digit values. */
body[data-starter-theme="dashcode"] .starter-pg-per-page {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    max-width: 100%;
}
body[data-starter-theme="dashcode"] .starter-pg-per-page > span:first-child {
    width: 6.5rem;
    min-width: 6.5rem;
    flex: 0 0 6.5rem;
}
body[data-starter-theme="dashcode"] :is(
    .starter-pg-per-page select,
    .operation-pagination select,
    .approval-page-size select,
    .access-filter-control.is-size select,
    #customer-invitation-size
) {
    min-width: 6.5rem;
    flex-shrink: 0;
}