/* ============================================================
   ix-header-v1.0.1.css
   Companion to ix-header-v1.0.1.js

   Canonical styling for the three T-A header rows. Values are the
   APPROVED mockup's, ported verbatim from title-admin-page-design
   v1.4.20 (.std-subtabs) and ta-intake-manager v3.0.8 (.bdl-l1).
   Do not substitute tokens or "improve" contrast here — a darker
   cream was tried and rejected.

   ── TWO CASCADE HAZARDS, both already solved below. Do not
      remove the defences: ──

   1. `section.publisher-wrapper *` (title-admin-page-design)
      forces `background-color: var(--ix-white) !important` on
      EVERY descendant. Any background here needs !important AND
      enough specificity. It also whitewashes the label element
      INSIDE a button, not just the button — hence the trailing
      `*` selectors.

   2. ix-buttons-v1.0.x sets `font-family: DM Sans !important` at
      `button.ix-btn.ix-btn--tab` (0,2,1) and loads AFTER this
      file. Beating it needs 0,3,1 — a 0,2,0 selector loses even
      with !important.

   ── TRANSITIONAL ALIASES ──
   .std-subtabs and .bdl-l1 are aliased to the new rules so tabs
   keep rendering correctly while they're migrated one at a time.
   DELETE the alias selectors once all tabs call IxTabs.
   ============================================================ */


/* ─────────────────────────────────────────────
   ROW 1 — panel header (.ix-hdr)
   Base .ix-hdr / -left / -icon / -sub rules live in
   title-admin-page-design §3. Only the row-gap rule is here so
   the three rows sit flush with no seam.
   ───────────────────────────────────────────── */
.ix-hdr {
  margin-bottom: 0 !important;
}


/* ─────────────────────────────────────────────
   ROW 2 — channel tabs (.ix-tabs-l1)
   ───────────────────────────────────────────── */
.ix-tabs-l1.ix-tabs-l1,
.std-subtabs.std-subtabs {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 0;
  padding: 0 20px;
  margin-bottom: 0;
  border-bottom: 1px solid #ece8dc;
  background-color: #FAF9F5 !important;
  border-radius: 0;
}

.ix-tabs-l1 button.ix-btn.ix-btn--tab,
.ix-tabs-l1 .ix-btn.ix-btn--tab,
.std-subtabs button.ix-btn.ix-btn--tab,
.std-subtabs .ix-btn.ix-btn--tab {
  font-family: var(--ix-font-display) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 18px 20px 16px !important;
  background-color: transparent !important;
  background-image: none !important;
  border-radius: 0 !important;
}

/* label element inside the button — see hazard 1 */
.ix-tabs-l1 button.ix-btn.ix-btn--tab *,
.ix-tabs-l1 .ix-btn.ix-btn--tab *,
.std-subtabs button.ix-btn.ix-btn--tab *,
.std-subtabs .ix-btn.ix-btn--tab * {
  background-color: transparent !important;
  background-image: none !important;
}


/* ─────────────────────────────────────────────
   ROW 3 — pill sub-tabs (.ix-tabs-l2)
   ───────────────────────────────────────────── */
.ix-tabs-l2.ix-tabs-l2,
.bdl-l1.bdl-l1 {
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #FCFBF7 !important;
  border-bottom: 1px solid #f1eee4;
  margin-top: 0;
  margin-bottom: 20px;
  padding: 18px 20px;
}

.ix-tab-pill.ix-tab-pill,
.bdl-l1-tab.bdl-l1-tab {
  font-family: var(--ix-font-mono);
  background-color: #FAF9F5 !important;
  border: 1.5px solid #e6e2d6;
  border-radius: 24px;
  padding: 10px 22px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
  color: #5a5a52;
  transition: all var(--ix-ease, .15s ease);
}

.ix-tab-pill.ix-tab-pill.is-active,
.bdl-l1-tab.bdl-l1-tab.is-active {
  color: #fff !important;
  background-color: #5B7FFF !important;
  border-color: #5B7FFF !important;
}

/* right-pinned slot (refresh button etc.) */
.ix-tabs-l2 .ix-tabs-l2-end,
.bdl-l1 .bdl-refresh-icon {
  margin-left: auto;
}

/* activity dot */
.ix-tab-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #C4A35A;
  margin-left: 6px;
  vertical-align: middle;
}


/* ───────────────────────────────────────────
   CANONICAL REFRESH CONTROL (.ix-refresh-icon)   added v1.0.1
   Emitted by IxHeader.refreshBtn(). One refresh control for every
   data/file surface.

   Specificity note: the class is doubled to reach (0,3,1) so it
   beats ix-buttons' `button.ix-btn.ix-btn--icon { width:28px
   !important }` and `ix-btn--ghost { border:none !important }`,
   both (0,2,1). A (0,2,1) selector here would only tie, and
   ix-buttons may load after this file — ties go to the later
   sheet. Do not reduce the doubling.
   ─────────────────────────────────────────── */
button.ix-btn.ix-refresh-icon.ix-refresh-icon,
.ix-btn.ix-refresh-icon.ix-refresh-icon,
.bdl-l1 button.ix-btn.bdl-refresh-icon {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(196,163,90,.35) !important;
  border-radius: 8px !important;
  font-size: 20px !important;
  line-height: 1 !important;
  color: var(--ix-gold, #C4A35A) !important;
  background-color: transparent !important;
  cursor: pointer;
}
button.ix-btn.ix-refresh-icon.ix-refresh-icon:hover:not(:disabled),
.bdl-l1 button.ix-btn.bdl-refresh-icon:hover:not(:disabled) {
  color: var(--ix-blue, #5B7FFF) !important;
  border-color: var(--ix-blue, #5B7FFF) !important;
}
button.ix-btn.ix-refresh-icon.ix-refresh-icon.is-spinning,
.bdl-refresh-icon.is-spinning {
  pointer-events: none;
  color: var(--ix-blue, #5B7FFF) !important;
  animation: ix-spin 0.8s linear infinite;
}