/* ============================================================
   Admin - open day settings (/admin/open-day-settings)
   The three-tab HOST over AdminOpenDayDates, AdminOpenDayStats and
   AdminOpenDayWizard. Only the host's own chrome lives here: the header, the
   tab strip and the panel wrapper. Every rule inside a panel belongs to its
   child's page root and stays in admin-open-day.css, whose spec
   (tests/adminOpenDayMobileCss.spec.ts) requires every selector in that file
   to start with .odd-page, .reg-page, .ods-page or .odw-page.

   Borrows the house pill kit .course-filter-tabs / .course-filter-tab from
   admin.css and never redefines it - same call as .pay-tabs and .stg-tabs.

   DIRECTION: only the header and the strip are RTL islands, deliberately NOT
   .odst-page itself. The wizard child is English and inherits .admin-main's
   LTR from its own root; an RTL page root here would flip it, and the other
   two children already re-establish RTL from .odd-page / .ods-page.
   ============================================================ */

.odst-head,
.odst-tabs {
  direction: rtl;
  text-align: right;
}

/* .course-filter-tabs is inline-flex with no wrap of its own, and these Hebrew
   labels would otherwise force a page-wide horizontal scrollbar. */
.odst-tabs {
  flex-wrap: wrap;
  max-width: 100%;
  margin-bottom: 1.5rem;
}

/* TWO LEVELS OF TABS, and they must not look alike. The statistics screen owns
   a strip of its own (סקירה / הפניות / משפך, `.stats-tabs`) which now sits
   INSIDE this one, and it wears the same shared pill kit. Left identical, the
   reader gets two rows of grey pills with no way to tell which is the screen
   and which is the section within it.

   So the outer strip is scaled up and its selected pill is filled solid, while
   the inner strips keep the quiet default. Every rule is scoped under
   `.odst-tabs`, never on the kit itself - five other admin screens share it. */
.odst-tabs .course-filter-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 1.1rem;
  font-size: 0.95rem;
}

.odst-tabs .course-filter-tab i {
  font-size: 0.85em;
  opacity: 0.75;
}

/* Solid, not the brand gradient: the gradient only reads cleanly through light
   letterforms, and these labels are weight 500. */
.odst-tabs .course-filter-tab.is-active {
  background: var(--primary-color);
  color: #fff;
  box-shadow: none;
}

.odst-tabs .course-filter-tab.is-active i {
  opacity: 1;
}

.odst-tabs .course-filter-tab:not(.is-active):hover {
  background: var(--fsp-hover-bg);
  color: var(--primary-color);
}

/* The children each open with their own .admin-page-header, whose <h1> the
   host suppresses. That header is justify-content: space-between, so a lone
   toolbar would jump to the start of the line - the side the title used to
   occupy. Pin it to the end, which is where it sits on all three screens
   today, in both directions. */
.odst-panel .admin-page-header {
  justify-content: flex-end;
}

@media (max-width: 767px) {
  /* Touch floor, per host, exactly as .stg-page / .pay-page / .cur-page do -
     the shared kit deliberately carries no responsive rules of its own. */
  .odst-tabs .course-filter-tab {
    min-height: 44px;
  }
}