/*
 * Ham Radio Contest Calendar
 * Canonical public contest status presentation.
 *
 * The accepted List/start-page colour system is authoritative.
 * List, Month and Week use these same semantic colours.
 */


/* =========================================================
   RUNNING
   ========================================================= */

.start2-row.running,
.mContest.mStatus-running {
  background:
    color-mix(
      in srgb,
      var(--green) 14%,
      var(--surface)
    );

  border-color:
    color-mix(
      in srgb,
      var(--green) 52%,
      var(--line)
    );

  border-left:
    4px solid #22c55e;
}

.w2Event.status-running {
  --event-bg:
    color-mix(
      in srgb,
      var(--green) 14%,
      var(--surface)
    );

  --event-line:
    color-mix(
      in srgb,
      var(--green) 52%,
      var(--line)
    );

  --event-accent:#22c55e;
}

.w2Event:not(.compact).status-running {
  border-left:
    4px solid #22c55e;
}


/* =========================================================
   STARTING WITHIN 24 HOURS
   ========================================================= */

.start2-row.upcoming.soon,
.mContest.mStatus-soon {
  background:
    color-mix(
      in srgb,
      var(--orange) 13%,
      var(--surface)
    );

  border-color:
    color-mix(
      in srgb,
      var(--orange) 50%,
      var(--line)
    );

  border-left:
    4px solid #f59e0b;
}

.w2Event.status-soon {
  --event-bg:
    color-mix(
      in srgb,
      var(--orange) 13%,
      var(--surface)
    );

  --event-line:
    color-mix(
      in srgb,
      var(--orange) 50%,
      var(--line)
    );

  --event-accent:#f59e0b;
}

.w2Event:not(.compact).status-soon {
  border-left:
    4px solid #f59e0b;
}


/* =========================================================
   OPERATING BREAK
   ========================================================= */

.mContest.mStatus-break {
  background:
    color-mix(
      in srgb,
      var(--break) 13%,
      var(--surface)
    );

  border-color:
    color-mix(
      in srgb,
      var(--break) 50%,
      var(--line)
    );

  border-left:
    4px solid var(--break);
}

.w2Event.status-break {
  --event-bg:
    color-mix(
      in srgb,
      var(--break) 13%,
      var(--surface)
    );

  --event-line:
    color-mix(
      in srgb,
      var(--break) 50%,
      var(--line)
    );

  --event-accent:
    var(--break);
}

.w2Event:not(.compact).status-break {
  border-left:
    4px solid var(--break);
}


/* =========================================================
   LATER / FINISHED / CANCELLED
   ========================================================= */

.start2-row.upcoming.future,
.mContest.mStatus-later,
.mContest.mStatus-finished,
.mContest.mStatus-cancelled {
  background:
    var(--surface);

  border-color:
    var(--line);

  opacity:1;
}

.w2Event.status-later,
.w2Event.status-finished,
.w2Event.status-cancelled {
  --event-bg:
    var(--surface);

  --event-line:
    var(--line);

  --event-accent:
    #64748b;
}


/* =========================================================
   SELECTED — STATUS COLOUR REMAINS AUTHORITATIVE
   ========================================================= */

.start2-row.running.selected,
.mContest.mSelectedContest.mStatus-running {
  border:
    2px solid #08752f;

  border-left:
    4px solid #08752f;

  box-shadow:
    inset 4px 0 #08752f,
    0 0 0 2px
      color-mix(
        in srgb,
        #08752f 20%,
        transparent
      );
}

.start2-row.upcoming.soon.selected,
.mContest.mSelectedContest.mStatus-soon {
  border:
    2px solid #c66a00;

  border-left:
    4px solid #c66a00;

  box-shadow:
    inset 4px 0 #c66a00,
    0 0 0 2px
      color-mix(
        in srgb,
        #c66a00 18%,
        transparent
      );
}

.mContest.mSelectedContest.mStatus-break {
  border:
    2px solid #145fd7;

  border-left:
    4px solid #145fd7;

  box-shadow:
    inset 4px 0 #145fd7,
    0 0 0 2px
      color-mix(
        in srgb,
        #145fd7 18%,
        transparent
      );
}

.start2-row.upcoming.future.selected,
.start2-row.past.selected,
.mContest.mSelectedContest.mStatus-later,
.mContest.mSelectedContest.mStatus-finished,
.mContest.mSelectedContest.mStatus-cancelled {
  border:
    2px solid #64748b;

  border-left:
    4px solid #64748b;

  box-shadow:
    inset 4px 0 #64748b;
}


/* Week uses the same selected status accents. */

.w2Event:not(.compact).status-running.selectedContest {
  border:
    2px solid #08752f;

  border-left:
    4px solid #08752f;

  box-shadow:
    inset 4px 0 #08752f,
    0 0 0 2px
      color-mix(
        in srgb,
        #08752f 20%,
        transparent
      );
}

.w2Event:not(.compact).status-soon.selectedContest {
  border:
    2px solid #c66a00;

  border-left:
    4px solid #c66a00;

  box-shadow:
    inset 4px 0 #c66a00,
    0 0 0 2px
      color-mix(
        in srgb,
        #c66a00 18%,
        transparent
      );
}

.w2Event:not(.compact).status-break.selectedContest {
  border:
    2px solid #145fd7;

  border-left:
    4px solid #145fd7;

  box-shadow:
    inset 4px 0 #145fd7,
    0 0 0 2px
      color-mix(
        in srgb,
        #145fd7 18%,
        transparent
      );
}

.w2Event:not(.compact).status-later.selectedContest,
.w2Event:not(.compact).status-finished.selectedContest,
.w2Event:not(.compact).status-cancelled.selectedContest {
  border:
    2px solid #64748b;

  border-left:
    4px solid #64748b;

  box-shadow:
    inset 4px 0 #64748b;
}


/*
 * Compact Week events keep their exact proportional time width.
 * Selection strengthens only the existing semantic status accent;
 * no artificial full-width duration box is introduced.
 */
.w2Event.compact.selectedContest {
  --event-selected-accent:var(--event-accent);

  border:0;
  background:transparent;
  box-shadow:none;
}

.w2Event.compact.status-running.selectedContest {
  --event-selected-accent:#08752f;
}

.w2Event.compact.status-soon.selectedContest {
  --event-selected-accent:#c66a00;
}

.w2Event.compact.status-break.selectedContest {
  --event-selected-accent:#145fd7;
}

.w2Event.compact.status-later.selectedContest,
.w2Event.compact.status-finished.selectedContest,
.w2Event.compact.status-cancelled.selectedContest {
  --event-selected-accent:#64748b;
}

.w2Event.compact.selectedContest::after {
  height:7px;

  border:
    2px solid
    var(--event-selected-accent);

  background:
    color-mix(
      in srgb,
      var(--event-selected-accent) 62%,
      transparent
    );

  box-shadow:
    0 0 0 2px
      color-mix(
        in srgb,
        var(--event-selected-accent) 28%,
        transparent
      );
}

.w2Event.compact.selectedContest::before {
  width:3px;
  height:11px;

  background:
    var(--event-selected-accent);

  box-shadow:
    0 0 0 2px
      color-mix(
        in srgb,
        var(--event-selected-accent) 24%,
        transparent
      );
}

.w2Event.compact.selectedContest .w2EventLabel {
  color:
    var(--event-selected-accent);
}

.w2Event.compact.selectedContest .w2EventName {
  font-weight:900;
}


/* =========================================================
   A-021 — SELECTED CONTEST CONTRAST IN DARK CALENDAR VIEWS

   No separate blue selection frame.
   Selection is expressed through a brighter version of the
   existing semantic status frame only.

   Compact Week events keep their accepted exact-duration
   geometry and use the same brighter semantic accents below.
   ========================================================= */

/* Month */
:root[data-theme="dark"] .start2-row.running.selected,
:root[data-theme="dark"] .mContest.mSelectedContest.mStatus-running {
  border:2px solid #22c55e;
  border-left:4px solid #22c55e;
  box-shadow:
    inset 4px 0 #22c55e,
    0 0 0 1px color-mix(in srgb, #22c55e 20%, transparent);
}

:root[data-theme="dark"] .start2-row.upcoming.soon.selected,
:root[data-theme="dark"] .mContest.mSelectedContest.mStatus-soon {
  border:2px solid #ffb74d;
  border-left:4px solid #ffb74d;
  box-shadow:
    inset 4px 0 #ffb74d,
    0 0 0 1px color-mix(in srgb, #ffb74d 24%, transparent);
}

:root[data-theme="dark"] .mContest.mSelectedContest.mStatus-break {
  border:2px solid #60a5fa;
  border-left:4px solid #60a5fa;
  box-shadow:
    inset 4px 0 #60a5fa,
    0 0 0 1px color-mix(in srgb, #60a5fa 22%, transparent);
}

:root[data-theme="dark"] .start2-row.upcoming.future.selected,
:root[data-theme="dark"] .start2-row.past.selected,
:root[data-theme="dark"] .mContest.mSelectedContest.mStatus-later,
:root[data-theme="dark"] .mContest.mSelectedContest.mStatus-finished,
:root[data-theme="dark"] .mContest.mSelectedContest.mStatus-cancelled {
  border:2px solid #cbd5e1;
  border-left:4px solid #cbd5e1;
  box-shadow:
    inset 4px 0 #cbd5e1,
    0 0 0 1px color-mix(in srgb, #cbd5e1 18%, transparent);
}

/* Week */
:root[data-theme="dark"] .w2Event:not(.compact).status-running.selectedContest {
  border:2px solid #22c55e;
  border-left:4px solid #22c55e;
  box-shadow:
    inset 4px 0 #22c55e,
    0 0 0 1px color-mix(in srgb, #22c55e 20%, transparent);
}

:root[data-theme="dark"] .w2Event:not(.compact).status-soon.selectedContest {
  border:2px solid #ffb74d;
  border-left:4px solid #ffb74d;
  box-shadow:
    inset 4px 0 #ffb74d,
    0 0 0 1px color-mix(in srgb, #ffb74d 24%, transparent);
}

:root[data-theme="dark"] .w2Event:not(.compact).status-break.selectedContest {
  border:2px solid #60a5fa;
  border-left:4px solid #60a5fa;
  box-shadow:
    inset 4px 0 #60a5fa,
    0 0 0 1px color-mix(in srgb, #60a5fa 22%, transparent);
}

:root[data-theme="dark"] .w2Event:not(.compact).status-later.selectedContest,
:root[data-theme="dark"] .w2Event:not(.compact).status-finished.selectedContest,
:root[data-theme="dark"] .w2Event:not(.compact).status-cancelled.selectedContest {
  border:2px solid #cbd5e1;
  border-left:4px solid #cbd5e1;
  box-shadow:
    inset 4px 0 #cbd5e1,
    0 0 0 1px color-mix(in srgb, #cbd5e1 18%, transparent);
}

:root[data-theme="dark"] .w2Event.compact.status-running.selectedContest {
  --event-selected-accent:#22c55e;
}

:root[data-theme="dark"] .w2Event.compact.status-soon.selectedContest {
  --event-selected-accent:#ffb74d;
}

:root[data-theme="dark"] .w2Event.compact.status-break.selectedContest {
  --event-selected-accent:#60a5fa;
}

:root[data-theme="dark"] .w2Event.compact.status-later.selectedContest,
:root[data-theme="dark"] .w2Event.compact.status-finished.selectedContest,
:root[data-theme="dark"] .w2Event.compact.status-cancelled.selectedContest {
  --event-selected-accent:#cbd5e1;
}

/* =========================================================
   A-032 — LOG SUBMISSION WINDOW OPEN

   This is a post-contest state only:
   contest has ended, but the known log submission deadline
   has not yet passed.

   List remains the visual reference:
   violet is deliberately separate from
   green  = running
   orange = starting within 24 hours
   blue   = operating break.
   ========================================================= */

:root {
  --calendar-deadline-accent:#8b5cf6;
  --calendar-deadline-selected:#6d28d9;
}

:root[data-theme="dark"] {
  --calendar-deadline-accent:#a78bfa;
  --calendar-deadline-selected:#c4b5fd;
}


/* Month contest card */

.mContest.mStatus-deadline {
  background:
    color-mix(
      in srgb,
      var(--calendar-deadline-accent) 13%,
      var(--surface)
    );

  border-color:
    color-mix(
      in srgb,
      var(--calendar-deadline-accent) 50%,
      var(--line)
    );

  border-left:
    4px solid
    var(--calendar-deadline-accent);
}


/* Week operating-period event */

.w2Event.status-deadline {
  --event-bg:
    color-mix(
      in srgb,
      var(--calendar-deadline-accent) 13%,
      var(--surface)
    );

  --event-line:
    color-mix(
      in srgb,
      var(--calendar-deadline-accent) 50%,
      var(--line)
    );

  --event-accent:
    var(--calendar-deadline-accent);
}

.w2Event:not(.compact).status-deadline {
  border-left:
    4px solid
    var(--calendar-deadline-accent);
}


/* Month/Week briefing status accents, where present */

.mDot.deadline {
  background:
    var(--calendar-deadline-accent);
}

.mDurationBox.status-deadline {
  border-color:
    var(--calendar-deadline-accent);

  background:
    color-mix(
      in srgb,
      var(--calendar-deadline-accent) 13%,
      transparent
    );
}


/* Selected Month contest keeps the semantic violet */

.mContest.mSelectedContest.mStatus-deadline {
  border:
    2px solid
    var(--calendar-deadline-selected);

  border-left:
    4px solid
    var(--calendar-deadline-selected);

  box-shadow:
    inset 4px 0
      var(--calendar-deadline-selected),
    0 0 0 2px
      color-mix(
        in srgb,
        var(--calendar-deadline-selected) 20%,
        transparent
      );
}


/* Selected normal Week event */

.w2Event:not(.compact).status-deadline.selectedContest {
  border:
    2px solid
    var(--calendar-deadline-selected);

  border-left:
    4px solid
    var(--calendar-deadline-selected);

  box-shadow:
    inset 4px 0
      var(--calendar-deadline-selected),
    0 0 0 2px
      color-mix(
        in srgb,
        var(--calendar-deadline-selected) 20%,
        transparent
      );
}


/* Selected compact Week event */

.w2Event.compact.status-deadline.selectedContest {
  --event-selected-accent:
    var(--calendar-deadline-selected);
}