/* Loaded after component styles. Only brand roles are overridden here. */
:focus-visible { outline-color: var(--brand-focus); }
.site-footer :focus-visible, .admin-sidebar :focus-visible, .utility-bar :focus-visible { outline-color: #fff; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--primary); }
:is(.public-field, .settings-field, .admin-content) :is(input,select,textarea):focus-visible {
    outline: 2px solid var(--brand-focus); outline-offset: 2px; border-color: var(--primary);
    box-shadow: 0 0 0 4px var(--primary-soft);
}
.button:not(.button-danger):not(.button-outline):not(.button-secondary) {
    color: var(--brand-primary-on); background: var(--brand-primary); border-color: var(--primary);
}
.button:not(.button-danger):not(.button-outline):not(.button-secondary):hover {
    color: var(--brand-primary-hover-on); background: var(--brand-primary-hover);
}
.button:not(.button-danger):not(.button-outline):not(.button-secondary):active {
    color: var(--brand-primary-active-on); background: var(--brand-primary-active); transform: none;
}
.button-outline:hover { color: #fff; background: var(--primary-dark); }
.button-secondary { color: var(--brand-secondary-on); background: var(--brand-secondary); border-color: var(--brand-secondary-text); }
.button-secondary:hover { color: var(--brand-secondary-hover-on); background: var(--brand-secondary-hover); }
.button-secondary:active { color: var(--brand-secondary-active-on); background: var(--brand-secondary-active); }
.button:disabled, .button[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }
.brand-mark { border-color: var(--brand-secondary); color: var(--brand-secondary-text); background: var(--brand-secondary-soft); }
.site-footer { background: linear-gradient(130deg,var(--primary),var(--navy) 58%,var(--navy-deep)); }
.site-footer section > a:hover, .footer-bottom a:hover, .utility-contact a:hover { color: #fff; text-decoration: underline; }
.nav-submenu-toggle { color: var(--primary); }
.nav-group.is-current > .nav-parent-row, .nav-submenu a[aria-current="page"] { background: var(--primary-soft); }
.content-card:hover, .learning-icon, .filter-tabs a[aria-current="page"] { border-color: var(--brand-primary-border); }
.stats-strip { background: linear-gradient(90deg,var(--primary-soft),var(--brand-secondary-soft)); }
.stats-strip i { color: var(--brand-secondary-text); }
.admin-sidebar { background: linear-gradient(180deg,var(--navy),var(--navy-deep)); }
.admin-sidebar nav > a.active { box-shadow: inset 3px 0 var(--brand-secondary); }
.admin-logo > span { border-color: var(--brand-secondary); color: #fff; }
.welcome-card { background: linear-gradient(115deg,var(--primary),var(--navy)); }
.settings-overview { background: linear-gradient(118deg,#fff,var(--primary-soft)); }
.brand-color-control { display:flex; align-items:center; gap:12px; }
.brand-color-control input[type="color"] { flex:0 0 52px; width:52px; height:44px; padding:3px; border:1px solid var(--border); border-radius:8px; background:#fff; cursor:pointer; }
.brand-color-control input[data-brand-hex] { width:100%; min-width:0; padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-family:monospace; }
.brand-settings-preview { padding:0 24px 24px; }
.brand-settings-preview > p { color:var(--muted); font-size:13px; }
.brand-preview { margin:16px 0; padding:22px; border:1px solid var(--brand-primary-border); border-top:4px solid var(--brand-secondary); border-radius:12px; background:var(--primary-soft); color:var(--text); }
.brand-preview > strong { color:var(--primary-dark); }
.brand-preview > div { display:flex; flex-wrap:wrap; gap:10px; }
.brand-preview-badge { display:inline-block; padding:3px 10px; border-radius:6px; color:var(--brand-secondary-on); background:var(--brand-secondary); }
.brand-settings-preview [role="status"] { display:block; margin-top:10px; font-size:12px; }
@media(max-width:600px) { .brand-settings-preview { padding:0 16px 16px; } }