/* Seasonal component coverage. Loaded by the shared page middleware.
   Scope both the theme and the medium: Light, Dark Gray, print snapshots,
   story artwork and floor-plan drawings keep their existing appearance. */
@media screen {
  html.nexus-seasonal {
    --hw-bg: #120f18;
    --hw-surface: #1e1828;
    --hw-stripe: #251d30;
    --hw-raised: #292034;
    --hw-hover: #352640;
    --hw-line: #594762;
    --hw-text: #fff3e6;
    --hw-muted: #cabbcf;
    --hw-orange: #ff983f;
    --hw-orange-ink: #251307;
    --hw-purple: #c4a0f6;
  }

  /* SVG color alone cannot override the fixed stroke/fill on legacy icons.
     Keep outline and solid glyphs separate; never filter content images. */
  html.nexus-seasonal body :is(.site-global-nav, .site-shared-compact-bar,
    .site-shared-compact-drawer, .site-notes-compact-nav, .site-notes-nav-drawer,
    .compact-nav-menu) :is(.site-shared-nav-icon, .site-nav-account-chevron) {
    color: var(--hw-orange) !important;
    opacity: 1 !important;
    filter: none !important;
  }
  html.nexus-seasonal body :is(.site-global-nav, .site-shared-compact-bar,
    .site-shared-compact-drawer, .site-notes-compact-nav, .site-notes-nav-drawer,
    .compact-nav-menu) :is(.site-shared-nav-icon-outline, .site-nav-account-chevron),
  html.nexus-seasonal body :is(.site-global-nav, .site-shared-compact-bar,
    .site-shared-compact-drawer, .site-notes-compact-nav, .site-notes-nav-drawer,
    .compact-nav-menu) :is(.site-shared-nav-icon-outline, .site-nav-account-chevron) * {
    fill: none !important;
    stroke: var(--hw-orange) !important;
  }
  html.nexus-seasonal body :is(.site-global-nav, .site-shared-compact-bar,
    .site-shared-compact-drawer, .site-notes-compact-nav, .site-notes-nav-drawer,
    .compact-nav-menu) .site-shared-nav-icon-filled,
  html.nexus-seasonal body :is(.site-global-nav, .site-shared-compact-bar,
    .site-shared-compact-drawer, .site-notes-compact-nav, .site-notes-nav-drawer,
    .compact-nav-menu) .site-shared-nav-icon-filled * {
    fill: var(--hw-orange) !important;
    stroke: none !important;
  }
  html.nexus-seasonal body :is(.site-shared-compact-search, .site-notes-search-shortcut,
    .site-compact-search, .compact-header-shoe-icon, .nexus-theme-toggle,
    .nexus-theme-choice-icon) svg,
  html.nexus-seasonal body :is(.site-shared-compact-search, .site-notes-search-shortcut,
    .site-compact-search, .compact-header-shoe-icon, .nexus-theme-toggle,
    .nexus-theme-choice-icon) svg * {
    color: var(--hw-orange) !important;
    fill: none !important;
    stroke: currentColor !important;
    opacity: 1 !important;
  }
  html.nexus-seasonal body :is(.site-shared-compact-menu, .compact-nav-toggle)
    .compact-nav-toggle-icon i {
    background: var(--hw-orange) !important;
  }
  html.nexus-seasonal body :is(.site-shared-compact-search, .compact-header-shoe-icon) img {
    filter: brightness(0) saturate(100%) invert(70%) sepia(51%) saturate(1589%) hue-rotate(331deg) brightness(105%) contrast(101%) !important;
  }
  html.nexus-seasonal body .compact-nav-store-chevron {
    border-color: var(--hw-orange) !important;
  }
  html.nexus-seasonal body :is(.site-nav-account, .compact-nav-store-account).is-authenticated strong {
    color: var(--hw-text) !important;
  }
  html.nexus-seasonal body :is(#siteSharedAccount, #siteSharedDrawerAccount).is-authenticated > span:first-child {
    background: var(--hw-orange) !important;
    color: var(--hw-orange-ink) !important;
  }
  /* Unread notes stay a red notification with a white envelope. */
  html.nexus-seasonal body .nexus-account-note-alert {
    background: #df0038 !important;
    color: #fff !important;
  }
  html.nexus-seasonal body .nexus-account-note-alert svg,
  html.nexus-seasonal body .nexus-account-note-alert svg * {
    fill: none !important;
    stroke: #fff !important;
  }

  /* Shared action glyphs inherit the button's ink, including dark-on-orange
     primary actions. These classes are icons, not logos or user artwork. */
  html.nexus-seasonal body :is(.output-button-svg, .spark-icon),
  html.nexus-seasonal body :is(.output-button-svg, .spark-icon) * {
    color: inherit !important;
    stroke: currentColor !important;
    fill: none !important;
  }
  html.nexus-seasonal body :is(.power-bi-icon, .workbench-icon),
  html.nexus-seasonal body :is(.power-bi-icon, .workbench-icon) * {
    fill: currentColor !important;
    stroke: none !important;
  }
  html.nexus-seasonal body .tool-card .tool-card-icon svg,
  html.nexus-seasonal body .tool-card .tool-card-icon svg * {
    color: var(--hw-purple) !important;
    stroke: currentColor !important;
    fill: none !important;
  }
  html.nexus-seasonal body .quick-output-actions .quick-output-button .output-icon-label {
    color: var(--hw-text) !important;
  }
  html.nexus-seasonal body .site-page-heading .site-page-eyebrow {
    color: var(--hw-orange) !important;
  }

  /* The standalone Schedule inherited html:not(.nexus-dark-gray) light rules.
     Use the live component ID so those rules and later-loaded page CSS cannot
     turn its canvas white. Print capture cards are deliberately excluded. */
  html.nexus-seasonal body.schedule-page-open,
  html.nexus-seasonal body #scheduleDialog.schedule-page {
    background: var(--hw-bg) !important;
    color: var(--hw-text) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) {
    background: var(--hw-bg) !important;
    color: var(--hw-text) !important;
    border-color: var(--hw-line) !important;
    box-shadow: none !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    :is(.schedule-page-heading, .cloud-dialog-heading) {
    background: transparent !important;
    color: var(--hw-text) !important;
    border-color: var(--hw-line) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    :is(h2, .site-page-title, .schedule-summary-chip strong, .schedule-associate-name) {
    color: var(--hw-text) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .eyebrow {
    color: var(--hw-orange) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    :is(.site-page-meta, .site-page-meta *, .schedule-dialog-subtitle,
    .schedule-week-number, .schedule-summary-chip span, .schedule-job-title,
    .schedule-employment-type, .schedule-hours-note, .schedule-mobile-hint,
    .schedule-empty, .schedule-shift-separator) {
    color: var(--hw-muted) !important;
    border-color: var(--hw-line) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-summary-chip {
    background: var(--hw-surface) !important;
    border: 1px solid var(--hw-line) !important;
    border-radius: 10px;
    box-shadow: none !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-table-wrap {
    background: var(--hw-surface) !important;
    border: 1px solid var(--hw-line) !important;
    border-radius: 12px;
    overflow-x: auto;
    min-width: 0;
    max-width: 100%;
    scrollbar-color: #806188 var(--hw-surface);
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .weekly-schedule-table {
    color: var(--hw-text) !important;
    border-color: var(--hw-line) !important;
    background: var(--hw-surface) !important;
    font-variant-numeric: tabular-nums;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table :is(th, td) {
    color: var(--hw-text) !important;
    border-color: var(--hw-line) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table thead th {
    background: #302036 !important;
    color: #ffd2a7 !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table thead th span {
    color: var(--hw-muted) !important;
  }
  /* Opaque row colors also cover the sticky name column when scrolling. */
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tbody tr { --hw-schedule-row: var(--hw-surface); }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tbody tr:nth-child(even) { --hw-schedule-row: var(--hw-stripe); }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tbody tr:hover { --hw-schedule-row: var(--hw-hover); }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tbody :is(th, td) {
    background: var(--hw-schedule-row) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tfoot :is(th, td) {
    background: #302036 !important;
    color: var(--hw-text) !important;
    border-top-color: var(--hw-orange) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table .schedule-total-column :is(span, strong) {
    color: inherit !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table .schedule-total-column small {
    color: var(--hw-muted) !important;
  }
  /* Shift values are data, not purple button tiles. Preserve their two-line
     time format and all read-only permissions; change only their presentation. */
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-shift-edit-button {
    background: transparent !important;
    color: var(--hw-text) !important;
    border: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    :is(.schedule-shift-text, .schedule-shift-start, .schedule-shift-end, .schedule-shift-end-line) {
    color: var(--hw-text) !important;
    -webkit-text-fill-color: currentColor;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-shift-text {
    font-size: 12px !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    :is(.schedule-other-store, .schedule-shift-off, .schedule-shift-off .schedule-shift-text) {
    color: var(--hw-purple) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-other-store-shift {
    background: #30243d !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .schedule-shift-edit-button:not(:disabled):is(:hover, :focus-visible) {
    background: var(--hw-hover) !important;
    box-shadow: inset 0 0 0 2px var(--hw-orange) !important;
    outline: none !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-shift-edit-button::after {
    background: var(--hw-raised) !important;
    color: var(--hw-orange) !important;
    border-color: var(--hw-orange) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-print-button {
    background: #30213e !important;
    color: var(--hw-text) !important;
    border: 1px solid #816294 !important;
    border-radius: 8px !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .schedule-print-button:not(:disabled):is(:hover, :focus-visible) {
    background: #443051 !important;
    border-color: var(--hw-purple) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-print-button svg,
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .schedule-print-button svg * {
    fill: none !important;
    stroke: currentColor !important;
    color: inherit !important;
  }

  /* Both Schedule's desktop picker and the shared compact picker. */
  html.nexus-seasonal body :is(.calendar-controls, .schedule-page-week-nav)
    :is(.week-picker, .schedule-week-picker, .calendar-step, .today-button) {
    background: var(--hw-raised) !important;
    color: var(--hw-text) !important;
    border-color: #816294 !important;
    border-radius: 8px !important;
  }
  html.nexus-seasonal body :is(#weekPicker, .schedule-week-picker) > span {
    color: var(--hw-muted) !important;
  }
  html.nexus-seasonal body :is(#weekPicker, .schedule-page-week-nav)
    :is(#weekDate, #weekRangeLabel, #scheduleWeekDate, #scheduleWeekRangeLabel) {
    color: var(--hw-text) !important;
    background-color: transparent !important;
    border-color: var(--hw-line) !important;
    color-scheme: dark;
  }
  html.nexus-seasonal body :is(#weekPicker, .schedule-page-week-nav) .week-picker-open {
    background: transparent !important;
    color: var(--hw-orange) !important;
    border-color: transparent !important;
  }
  html.nexus-seasonal body :is(#weekPicker, .schedule-page-week-nav) .week-picker-open svg,
  html.nexus-seasonal body :is(#weekPicker, .schedule-page-week-nav) .week-picker-open svg * {
    stroke: var(--hw-orange) !important;
    fill: none !important;
  }
  html.nexus-seasonal body :is(#weekDate, #scheduleWeekDate)::-webkit-calendar-picker-indicator {
    opacity: 1 !important;
  }

  /* The schedule's roster and shift dialogs must not revert to white panels. */
  html.nexus-seasonal body #rosterDialog :is(.roster-toolbar, .roster-row,
    .roster-add-panel, .roster-year-history, .roster-pin-editor) {
    background: var(--hw-surface) !important;
    color: var(--hw-text) !important;
    border-color: var(--hw-line) !important;
  }
  html.nexus-seasonal body #rosterDialog :is(h2, strong, label, .roster-person) {
    color: var(--hw-text) !important;
  }
  html.nexus-seasonal body #rosterDialog :is(small, .roster-toolbar span,
    .roster-empty, .roster-add-help, .roster-week-context, .roster-login-status),
  html.nexus-seasonal body :is(.shift-dialog, .zone-dialog) :is(h2, label > span, .shift-time-label) {
    color: var(--hw-muted) !important;
  }
  html.nexus-seasonal.nexus-navigation-booting::before { background: var(--hw-bg) !important; }
  html.nexus-seasonal.nexus-navigation-booting::after,
  html.nexus-seasonal body .nexus-schedule-spinner {
    border-color: var(--hw-line) !important;
    border-top-color: var(--hw-orange) !important;
  }
}

@media screen and (min-width: 1000px) and (max-width: 1199px) {
  /* Avoid squeezing the three summaries into the week controls on tablets
     using desktop navigation. Wider desktops keep the original single row. */
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-page-week-nav {
    grid-column: 1 !important;
    grid-row: 3 !important;
    width: 100% !important;
    margin-top: 0 !important;
    justify-self: stretch !important;
  }
}

@media screen and (max-width: 999px) {
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card) .weekly-schedule-table {
    min-width: 820px;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table :is(thead, tfoot) th:first-child,
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tbody th {
    position: sticky;
    left: 0;
    z-index: 3;
    border-right-color: #806188 !important;
    box-shadow: none !important;
  }
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table :is(thead, tfoot) th:first-child::after,
  html.nexus-seasonal body #scheduleDialog .schedule-dialog-card:not(.schedule-print-card)
    .weekly-schedule-table tbody th::after {
    background: #806188 !important;
  }
}