/* Operonn overrides on top of Metronic dark.
   Kept intentionally small — every rule should be removable without
   breaking layout, since Metronic's bundles already deliver the chrome. */

html, body {
    background-color: #15171c;
}

/* Sidebar chrome (brand-logo hover, section toggles, group collapse, item
   indent and the macOS scroll fix) now ships from the shared RCL
   (_content/Fifteen.Web.Shared/css/fifteen-sidebar.css), referenced in
   _Layout. Removed from here so there is no double-definition. */

/* Onboarding-status pill styling — small column in the instructors list. */
.onboarding-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.onboarding-pill.onboarding-newly-added { background: rgba(255, 199, 0, 0.12); color: #ffc700; }
.onboarding-pill.onboarding-folders-provisioned { background: rgba(54, 153, 255, 0.14); color: #3699FF; }
.onboarding-pill.onboarding-assistant-provisioned { background: rgba(143, 75, 255, 0.16); color: #b18bff; }
.onboarding-pill.onboarding-active { background: rgba(80, 205, 137, 0.14); color: #50CD89; }

/* Shared page-header card — see _PageHeader.cshtml.
   Explicit hex values (not --kt-gray-*) so the Metronic dark-mode
   gray-scale inversion can't flip the card to white. Same pattern as
   the artefact viewer in office.css (cf7693f). */
.page-header-card {
    background-color: #1e1e2d;
    border: 1px solid #2B2B40;
}
.page-header-card .page-header-actions .btn {
    /* Buttons sit comfortably inside the card padding without their own
       inherited margin. The `gap-2` utility on the wrapper handles
       horizontal spacing between actions. */
    margin: 0;
}

/* Sidebar section-heading / collapsible-toggle / caret rules moved to the
   shared RCL (fifteen-sidebar.css). */

/* ---------------------------------------------------------------------
   Shared form-input surface — readable in both themes.

   Background story: Razor pages across the app were leaning on the
   utility combo `bg-gray-{800|900} text-gray-100` for form-control /
   form-select / textarea / input surfaces. Metronic's dark palette
   inverts --kt-gray-900 to #FFFFFF and renders --kt-gray-800 as
   #CDCDDE, while fifteen-dark.css remaps text-gray-100 to near-white
   #f5f8fa. Result: bg-gray-900 + text-gray-100 paints white-on-white
   (unreadable) and bg-gray-800 + text-gray-100 paints near-white on
   mid-grey (poor). Reference: commits f03a451 / cab9694 / 0a49bb6.

   Fix: one shared scoped class with explicit per-theme surface + ink
   + border + focus colours. Replace the broken utility combo with
   `.nexus-form-input` on every affected element. Modal-content
   surfaces (display family, no focus) use `.nexus-modal-surface`. */

.nexus-form-input {
    background-color: #f5f8fa;
    color: #181C32;
    border: 1px solid #E4E6EF;
}
.nexus-form-input::placeholder {
    color: #A1A5B7;
    opacity: 1;
}
.nexus-form-input:focus {
    background-color: #ffffff;
    color: #181C32;
    border-color: #B5B5C3;
    box-shadow: none;
}
[data-bs-theme="dark"] .nexus-form-input,
[data-theme="dark"] .nexus-form-input {
    background-color: #1b1b29;
    color: #f5f8fa;
    border-color: #2B2B40;
}
[data-bs-theme="dark"] .nexus-form-input::placeholder,
[data-theme="dark"] .nexus-form-input::placeholder {
    color: #565674;
    opacity: 1;
}
[data-bs-theme="dark"] .nexus-form-input:focus,
[data-theme="dark"] .nexus-form-input:focus {
    background-color: #1b1b29;
    color: #f5f8fa;
    border-color: #3699FF;
    box-shadow: none;
}

/* Special-case ink: client-secret reveal field on DCW/Create stays
   warning-yellow because the value is the one-time secret. The base
   `.nexus-form-input` provides the surface; the `--secret` modifier
   overrides ink only. */
.nexus-form-input.nexus-form-input--secret {
    color: #FFC700;
    font-weight: 700;
}
[data-bs-theme="dark"] .nexus-form-input.nexus-form-input--secret,
[data-theme="dark"] .nexus-form-input.nexus-form-input--secret {
    color: #FFC700;
}

/* Modal-content display surface. No focus state — modals don't take
   focus themselves; the inputs inside use .nexus-form-input. */
.nexus-modal-surface {
    background-color: #f5f8fa;
    color: #181C32;
    border: 1px solid #E4E6EF;
}
[data-bs-theme="dark"] .nexus-modal-surface,
[data-theme="dark"] .nexus-modal-surface {
    background-color: #1b1b29;
    color: #f5f8fa;
    border-color: #2B2B40;
}

/* Progress-bar track. Previously used the inverted `bg-gray-800` utility
   for the unfilled track — same Metronic dark-mode pathology: --kt-gray-800
   lightens in dark mode so the empty track painted near-white and the
   bg-primary fill was indistinguishable. Explicit per-theme track colour. */
.nexus-progress-track {
    background-color: #E4E6EF;
}
[data-bs-theme="dark"] .nexus-progress-track,
[data-theme="dark"] .nexus-progress-track {
    background-color: #2B2B40;
}

/* Sidebar menu-group-items collapse + item indent + the macOS scroll fix all
   moved to the shared RCL (_content/Fifteen.Web.Shared/css/fifteen-sidebar.css),
   referenced in _Layout. Removed from here so there is no double-definition. */