/* =============================================================================
   Accessibility fixes from the 2026-09-26 UI audit (WCAG 2.2 AA).
   Loaded last on both portals. Each rule cites the axe finding it resolves.
   ============================================================================= */

/* color-contrast: saffron (#EB7A1C) as SMALL text on white = 2.86:1. Use the
   darker saffron for text; keep the bright one for backgrounds/accents. */
.iv2-eyebrow, .iv-eyebrow, .cs-card-eyebrow, .cs-eyebrow, .cv-eyebrow, .ll-eyebrow,
.topbar .heading .eyebrow, .is-hero-kicker, .hc-label, .cs-crumb-home, .auth-role .sd-hindi,
.side-brand .eyebrow, [class$="-eyebrow"], [class*="-eyebrow "] {
  color: #B8500E !important;                       /* 5.4:1 on white, 4.9:1 on #FFF4E6 */
}
/* Dark sidebar keeps the bright tint (on #062A20 the contrast is 5.1:1). */
aside.sidebar .side-brand .eyebrow, .is-side .side-brand .eyebrow, .is-side [class*="eyebrow"] { color: #FF9A3D !important; }

/* color-contrast: white on saffron chips (2.86:1) → darker chip background. */
.iv2-hc-now, .cs-period-chip, .cs-now, .iv-chip-saffron, .ll-chip.ev, .ac-src.pin, .ac-src.maps {
  background: #C2410C !important; color: #fff !important; border-color: #C2410C !important;
}
.ll-chip.ev { color: #fff !important; }

/* color-contrast: financial-year heat strip (team calendar / client file).
   Month cells with load used white on #4F8E73 (3.85:1) and #CADDD5 on the same
   green (2.71:1); light cells used #3F6356 on #A9CDB9 (3.87:1). */
.iv2-hc-y { color: #1B3A2F !important; }
.iv2-hc-m { color: #0B2A20 !important; }
.iv2-hc.is-loaded, .iv2-hc.load, .iv2-hc[data-load="3"], .iv2-hc[data-load="4"] { background: #2E6B50 !important; }
.iv2-hc.is-loaded .iv2-hc-y, .iv2-hc.load .iv2-hc-y, .iv2-hc.is-loaded .iv2-hc-m, .iv2-hc.load .iv2-hc-m,
.iv2-hc[data-load="3"] .iv2-hc-y, .iv2-hc[data-load="4"] .iv2-hc-y, .iv2-hc[data-load="3"] .iv2-hc-m, .iv2-hc[data-load="4"] .iv2-hc-m { color: #fff !important; }

/* color-contrast: placeholder-weight helper text (#93A09B → #6B7773 done globally);
   floating labels on the sign-in forms (#7B8783 = 3.9:1). */
.fld label { color: #5B6763 !important; }
.fld input:focus + label, .fld input:not(:placeholder-shown) + label { color: #B8500E !important; }
.fld input:not(:focus):not(:placeholder-shown) + label { color: #5B6763 !important; }

/* page-has-heading-one: the client titlebar now renders an <h1>; keep the
   original compact look. */
.cs-page-t h1 { font: inherit; font-weight: 700; color: var(--cs-ink, #12352B); margin: 0; }

/* Mobile: the client header user menu / drawer must never widen the page. */
@media (max-width: 768px) {
  html, body { overflow-x: hidden; max-width: 100vw; }
  .cs-user-pop { position: fixed !important; left: 12px !important; right: 12px !important; width: auto !important; top: 64px !important; }
}

/* focus-visible: guarantee a visible ring on every interactive control. */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible, [tabindex="0"]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid #1F4FA8 !important; outline-offset: 2px !important;
}

/* color-contrast: FY heat strip load levels (.iv2-h2 light / .iv2-h3 mid / .iv2-h4 dark). */
.iv2-h2 .iv2-hc-m, .iv2-h2 .iv2-hc-y, .is-now .iv2-hc-y, .iv2-hc-y { color: #0B2A20 !important; }
.iv2-h3, .iv2-legend i.iv2-h3 { background: #2E6B50 !important; }
.iv2-h3 .iv2-hc-m, .iv2-h3 .iv2-hc-y, .iv2-h4 .iv2-hc-m, .iv2-h4 .iv2-hc-y { color: #fff !important; }

/* color-contrast: cancelled invoice rows are dimmed with opacity, which drags
   the status-pill text below 4.5:1. Dim everything except the pills. */
.iv-inv-cancelled { opacity: 1 !important; background: #F3F6F5 !important; }
.iv-inv-cancelled .iv-inv-num, .iv-inv-cancelled .iv-inv-client { text-decoration: line-through; text-decoration-color: #B9C6C1; }

/* color-contrast: the heat-strip year label was lightened with opacity; and
   the client entity-switcher avatar (white initials on bright saffron). */
.iv2-hc-y, .iv2-hc-m { opacity: 1 !important; }
html body .entity-switcher > span:first-child, html body .cs-bar .entity-switcher > span:first-child { background: #C2410C !important; color: #fff !important; }