/* Landing wallpaper: shared by auth pages and product app main column */
:root {
  --h0ckey-shell-chrome-bg: transparent;
  --product-shell-rail-top: 5rem;
  /* Product main column cards; override per-page via inline style on :root/body if needed */
  --h0ckey-product-card-bg: #f1f3f5;
  /* Semi-transparent card surfaces (match assessment matrix cards, ~80% opacity) */
  --h0ckey-product-card-surface: rgba(255, 255, 255, 0.8);
  --h0ckey-product-text-muted: #c5c7c9;
  --h0ckey-landing-bg: url("../img/landing-bg.png");
  --h0ckey-landing-wallpaper:
    linear-gradient(
      160deg,
      rgba(10, 22, 62, 0.82) 0%,
      rgba(10, 30, 72, 0.62) 45%,
      rgba(4, 10, 28, 0.9) 100%
    ),
    var(--h0ckey-landing-bg) center center / cover no-repeat scroll;
}

body[data-theme-version="dark"] {
  --h0ckey-landing-wallpaper:
    linear-gradient(
      160deg,
      rgba(10, 22, 62, 0.874) 0%,
      rgba(10, 30, 72, 0.734) 45%,
      rgba(4, 10, 28, 0.93) 100%
    ),
    var(--h0ckey-landing-bg) center center / cover no-repeat scroll;
}

/* Mobile-first: tight spacing for in-app screens (portrait-friendly) */
.content-body.product-app .container-fluid {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background: var(--h0ckey-landing-wallpaper);
}

/*
 * Skill library, skill edit/create, training plans: same full-column treatment as
 * Sessions (playbook) — wallpaper on .content-body so short pages are not a flat band.
 */
body.product-sidebar-compact .content-body.product-app.skill-lib-page,
body.product-sidebar-compact .content-body.product-app.skill-form-page,
body.product-sidebar-compact .content-body.product-app.plan-form-page {
  background: var(--h0ckey-landing-wallpaper) !important;
  background-size: cover;
  background-position: center center;
}
body.product-sidebar-compact .content-body.product-app.skill-form-page {
  background-attachment: fixed;
}
body.product-sidebar-compact .content-body.product-app.skill-lib-page > .container-fluid,
body.product-sidebar-compact .content-body.product-app.skill-form-page > .container-fluid,
body.product-sidebar-compact .content-body.product-app.plan-form-page > .container-fluid {
  background: transparent !important;
}

/* Wallpaper: any product page opted into stylized cards */
body.product-sidebar-compact .content-body.product-app.product-app--cards-stylized {
  background: var(--h0ckey-landing-wallpaper) !important;
  background-size: cover;
  background-position: center center;
}

body.product-sidebar-compact .content-body.product-app.product-app--cards-stylized > .container-fluid,
body.product-sidebar-compact .content-body.product-app.product-app--cards-stylized > .container-lg {
  background: transparent !important;
}

.content-body.product-app .card {
  margin-bottom: 0.5rem;
  /* Theme .card uses height: calc(100% - 30px), which clips or misaligns footers (e.g. upload CTA). */
  height: auto;
  min-height: 0;
  --bs-card-bg: var(--h0ckey-product-card-surface);
  background-color: var(--h0ckey-product-card-surface);
}

.content-body.product-app .card > .card-header,
.content-body.product-app .card > .card-footer {
  background-color: var(--h0ckey-product-card-surface);
}

/* Coach / LMS top nav tiles: never use product card slab fill */
.content-body.product-app .coach-dashboard-nav-cell.card {
  --bs-card-bg: transparent;
  background-color: transparent !important;
  box-shadow: none !important;
}

.content-body.product-app .card .card-body.bg-white {
  background-color: var(--h0ckey-product-card-surface) !important;
}

.content-body.product-app .card-header {
  padding: 0.5rem 0.75rem;
}

.content-body.product-app .card-body {
  padding: 0.65rem 0.75rem;
}

.content-body.product-app h3 {
  font-size: 1.15rem;
  margin-bottom: 0.35rem;
}

.content-body.product-app h4.card-title {
  font-size: 1rem;
  margin-bottom: 0;
}

.content-body.product-app .row {
  --bs-gutter-x: 0.5rem;
  --bs-gutter-y: 0.5rem;
}

.content-body.product-app .form-label,
.content-body.product-app label.col-form-label {
  color: #495057 !important;
}

.content-body.product-app .text-muted {
  color: var(--h0ckey-product-text-muted, #c5c7c9) !important;
}

.settings-toolbar .btn-icon {
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50rem;
}

.settings-pane-primary label {
  color: rgba(255, 255, 255, 0.92);
}

.settings-pane-primary .helptext,
.settings-pane-primary ul.errorlist {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.8rem;
}

.settings-pane-primary ul.errorlist {
  list-style: none;
  padding-left: 0;
}

/* Standalone auth / landing — shared wallpaper (image + tint); reuse on wrappers so containers carry the bg */
body.product-auth {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  font-family: Poppins, system-ui, sans-serif;
  background: var(--h0ckey-landing-wallpaper);
  color: #fff;
}

.product-auth .auth-shell {
  max-width: 26rem;
  margin: 0 auto;
  padding: 0.75rem;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--h0ckey-landing-wallpaper);
}

.product-auth .auth-card {
  background: transparent;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  border-radius: 0.75rem;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: none;
}

.product-auth .auth-card h1,
.product-auth .auth-card h2,
.product-auth .auth-card .h5 {
  font-size: 1.25rem;
  margin-top: 0;
  color: #fff;
}

.product-auth .auth-card .form-label,
.product-auth .auth-card label {
  color: rgba(255, 255, 255, 0.95);
}

.product-auth .auth-card .text-muted,
.product-auth .auth-card .form-text {
  color: rgba(255, 255, 255, 0.72) !important;
}

.product-auth .auth-card .form-control,
.product-auth .auth-card select.form-select {
  font-size: 1rem;
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}

.product-auth .auth-card .form-control::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.product-auth .auth-card .form-control:focus,
.product-auth .auth-card select.form-select:focus {
  background-color: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.55);
  color: #fff;
  box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.12);
}

.product-auth .auth-card input:-webkit-autofill,
.product-auth .auth-card input:-webkit-autofill:hover,
.product-auth .auth-card input:-webkit-autofill:focus {
  -webkit-text-fill-color: #fff;
  transition: background-color 9999s ease-out;
  box-shadow: 0 0 0 1000px rgba(30, 45, 90, 0.85) inset;
}

.product-auth .auth-card .form-check-input {
  background-color: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.45);
}

.product-auth .auth-card .form-check-input:checked {
  background-color: #1e3fb4;
  border-color: #2a52d0;
}

.product-auth .auth-card .form-check-label {
  color: rgba(255, 255, 255, 0.92);
}

.product-auth .auth-card hr {
  border-color: rgba(255, 255, 255, 0.28);
  opacity: 1;
}

.product-auth .auth-card .text-danger {
  color: #ffb3be !important;
}

.product-auth .auth-card .text-success {
  color: #9ef0c4 !important;
}

.product-auth .auth-card a:not(.btn):not(.btn-google-signin) {
  color: #c8d9ff;
  font-weight: 600;
}

.product-auth .auth-card a:not(.btn):not(.btn-google-signin):hover {
  color: #e8efff;
}

/* Login only: circular card; username above / password below vertical centre */
.product-auth.product-login .auth-shell {
  max-width: min(28rem, 100%);
}

.product-auth .auth-card--login-circle {
  /* ~one line box of .form-label.small (username) for vertical nudge */
  --auth-login-label-lh: calc(0.875rem * 1.45);
  /* Shared touch height: inputs + Login / Google */
  --auth-login-control-height: 2.5rem;
  width: min(26rem, min(92vw, 88dvh));
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  aspect-ratio: 1;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  padding: clamp(0.65rem, 3.2vw, 1.15rem);
  overflow-x: hidden;
  overflow-y: auto;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.32),
    0 0 1rem rgba(130, 175, 255, 0.42),
    0 0 2.25rem rgba(70, 110, 210, 0.38),
    0 0 3.5rem rgba(40, 70, 160, 0.28),
    inset 0 0 0.75rem rgba(255, 255, 255, 0.04);
}

.product-auth .auth-card--login-circle .auth-login-circle-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  flex-shrink: 0;
  line-height: 1.15;
  gap: 0.08rem;
  margin-top: 0;
  /* Net footprint unchanged below title: offset larger “Login” line */
  margin-bottom: calc(0.25rem - (1.5rem * 0.4) * 1.08);
}

.product-auth .auth-login-title-line1 {
  display: block;
}

/* “Login” word: +40% vs prior 1.5rem (tight line-height keeps stack compact) */
.product-auth .auth-card--login-circle .auth-login-title-line1 {
  font-size: calc(1.5rem * 1.4);
  line-height: 1.05;
}

.product-auth .auth-login-title-line2 {
  display: block;
  font-size: clamp(0.82rem, 2.8vw, 0.95rem);
  font-weight: 600;
  opacity: 0.92;
}

.product-auth .auth-card--login-circle .auth-login-circle-alerts {
  flex-shrink: 0;
  text-align: center;
  max-height: 28%;
  overflow-y: auto;
  /* ~40% less “pull up” than full -1lh so fields sit lower */
  margin-top: calc(-0.58 * var(--auth-login-label-lh, 1.27rem));
  margin-bottom: 0.2rem;
}

.product-auth .auth-login-circle-form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  margin-top: calc(-0.58 * var(--auth-login-label-lh, 1.27rem));
}

/* Two equal vertical halves: fields hug the horizontal midline of the circle */
.product-auth .auth-login-fields-stack {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  min-height: clamp(7.25rem, 22dvh, 10.5rem);
  width: 100%;
  /* Move username / password / remember ~40% lower in the circle */
  margin-top: clamp(1rem, 4.2dvh, 2.35rem);
}

/* Equal flex above/below Login+Google so the row sits centred between Remember and Register */
.product-auth .auth-login-actions-gap {
  flex: 1 1 0;
  min-height: 0;
  width: 100%;
}

.product-auth .auth-login-fields-half {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* Top half grows so username stays toward the vertical midline */
.product-auth .auth-login-fields-half--above {
  flex: 1 1 auto;
  justify-content: flex-end;
  padding-bottom: 0.1rem;
  max-height: 48%;
}

/* Password field then Remember row */
.product-auth .auth-login-fields-half--below {
  flex: 0 0 auto;
  justify-content: flex-start;
  padding-top: 0;
  gap: 0.35rem;
}

.product-auth .auth-card--login-circle .auth-login-fields-half--below .auth-login-remember.form-check {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.45rem;
  align-self: stretch;
  max-width: min(18.975rem, 98%);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.05rem;
  margin-bottom: 0;
  box-sizing: border-box;
  text-align: left;
  /* Flush with password label column (Bootstrap .form-check adds start padding + negative input margin) */
  padding: 0;
  padding-left: 0;
  padding-inline-start: 0;
}

.product-auth .auth-card--login-circle .auth-login-fields-half--below .auth-login-remember.form-check .form-check-input {
  float: none;
  position: static;
  flex-shrink: 0;
  margin: 0;
  margin-top: 0.1em;
  margin-left: 0;
  margin-inline-start: 0;
}

.product-auth .auth-card--login-circle .auth-login-fields-half--below .auth-login-remember .form-check-label {
  padding-left: 0;
  margin-bottom: 0;
}

.product-auth .auth-card--login-circle .auth-field-col {
  width: 100%;
  min-width: 0;
}

/* Same width for username + password; +10% vs prior cap */
.product-auth .auth-card--login-circle .auth-field-col--username,
.product-auth .auth-card--login-circle .auth-field-col--password {
  max-width: min(18.975rem, 98%);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.product-auth .auth-card--login-circle .auth-field-col--username .form-control,
.product-auth .auth-card--login-circle .auth-field-col--password .form-control {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  height: var(--auth-login-control-height, 2.5rem);
  min-height: var(--auth-login-control-height, 2.5rem);
  padding: 0 0.85rem;
  border-radius: 9999px;
  /* +10% vs prior clamp */
  font-size: clamp(0.792rem, 2.86vw, 0.9625rem);
  line-height: 1.2;
}

.product-auth .auth-card--login-circle .auth-field-col--username .form-control:-webkit-autofill,
.product-auth .auth-card--login-circle .auth-field-col--password .form-control:-webkit-autofill {
  border-radius: 9999px;
}

.product-auth .auth-card--login-circle .auth-field-col--password .form-control {
  margin-bottom: 0;
}

/* +20% vs prior 0.5em inset for username/password labels */
.product-auth .auth-card--login-circle .auth-field-col .form-label {
  padding-left: calc(0.5em * 1.2);
}

.product-auth .auth-login-circle-footer {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 0;
  padding-top: 0;
}

.product-auth .auth-login-primary-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  width: 85%;
  max-width: 85%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
}

.product-auth .auth-login-primary-row .auth-login-submit-btn,
.product-auth .auth-login-primary-row .btn-google-signin {
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  box-sizing: border-box;
  height: var(--auth-login-control-height, 2.5rem);
  min-height: var(--auth-login-control-height, 2.5rem);
  max-height: var(--auth-login-control-height, 2.5rem);
  border-radius: 9999px;
  line-height: 1.2;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-top: 0;
  padding-bottom: 0;
}

.product-auth .auth-login-primary-row .auth-login-submit-btn {
  font-weight: 700;
  font-size: 0.95rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.product-auth .auth-login-primary-row .btn-google-signin {
  font-size: clamp(0.65rem, 2.2vw, 0.78rem);
  padding-left: 0.55rem;
  padding-right: 0.55rem;
  gap: 0.35rem;
  box-shadow: 0 1px 2px rgba(60, 64, 67, 0.1);
}

.product-auth .auth-login-primary-row .btn-google-signin span:last-child {
  text-align: center;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-auth .auth-login-primary-row .btn-google-signin__icon svg {
  width: 19px;
  height: 19px;
}

.product-auth .auth-login-circle-register-wrap {
  flex-shrink: 0;
  margin-top: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  padding-top: 0.25rem;
  position: relative;
  z-index: 2;
  overflow: visible;
}

.product-auth .auth-register-cluster {
  position: relative;
  display: inline-block;
  width: 4.1rem;
  height: 4.1rem;
  flex-shrink: 0;
}

.product-auth .auth-register-cluster .auth-register-round {
  position: absolute;
  inset: 0;
  margin: 0;
  width: 100%;
  height: 100%;
}

.product-auth .auth-register-hint-details {
  position: absolute;
  top: -0.12rem;
  right: -0.12rem;
  z-index: 5;
  margin: 0;
}

.product-auth .auth-register-hint-trigger {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.38rem;
  height: 1.38rem;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.42);
  background: rgba(40, 40, 48, 0.92);
  color: #fff;
  font-weight: 800;
  font-size: 0.72rem;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  box-shadow: 0 0.1rem 0.35rem rgba(0, 0, 0, 0.25);
}

.product-auth .auth-register-hint-trigger::-webkit-details-marker {
  display: none;
}

.product-auth .auth-register-hint-trigger::marker {
  content: "";
}

.product-auth .auth-register-hint-trigger:hover {
  background: rgba(255, 255, 255, 0.24);
}

.product-auth .auth-register-hint-trigger:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 2px;
}

.product-auth .auth-register-hint-popover {
  position: absolute;
  bottom: calc(100% + 0.35rem);
  top: auto;
  right: 0;
  left: auto;
  width: max-content;
  max-width: min(14.5rem, 72vw);
  padding: 0.45rem 0.55rem;
  font-size: clamp(0.62rem, 2.1vw, 0.72rem);
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.97);
  text-align: left;
  background: rgba(8, 12, 28, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 0.5rem;
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.45);
  z-index: 20;
}

/* Pointer toward the ? trigger (popover opens upward inside the circle) */
.product-auth .auth-register-hint-popover::before {
  content: "";
  position: absolute;
  top: 100%;
  right: 0.5rem;
  border-width: 6px 6px 0 6px;
  border-style: solid;
  border-color: rgba(8, 12, 28, 0.94) transparent transparent transparent;
}

.product-auth .auth-register-round {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4.1rem;
  height: 4.1rem;
  padding: 0.25rem;
  border-radius: 50%;
  border: none;
  background: #e91e8c;
  color: #fff !important;
  font-size: clamp(0.62rem, 2vw, 0.72rem);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 0.2rem 0.55rem rgba(0, 0, 0, 0.35);
}

.product-auth .auth-register-round:hover {
  background: #f04ba3;
  color: #fff !important;
}

.product-auth .auth-register-round:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 3px;
}

.product-auth a {
  color: #1e3fb4;
}

/* Google Sign-In: brand-adjacent styling (white button, coloured G) */
.product-auth .btn-google-signin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  width: 100%;
  background: #fff;
  color: #3c4043;
  border: 1px solid #dadce0;
  border-radius: 0.375rem;
  font-weight: 500;
  font-size: 0.9375rem;
  padding: 0.5rem 0.85rem;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(60, 64, 67, 0.12);
  line-height: 1.25;
}

.product-auth .btn-google-signin:hover {
  background: #f8f9fa;
  color: #202124;
  border-color: #d2d3d4;
  box-shadow: 0 1px 3px rgba(60, 64, 67, 0.18);
}

.product-auth .btn-google-signin:focus-visible {
  outline: 2px solid #4285f4;
  outline-offset: 2px;
}

.product-auth .btn-google-signin__icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
}

/* Dashboard FullCalendar chrome: see EOF (loads after product-layout + theme). */

.product-auth .text-on-gradient {
  text-align: center;
  margin-bottom: 0.75rem;
  position: relative;
  z-index: 6;
  opacity: 0.8;
}

.product-auth .text-on-gradient a {
  color: #fff;
  font-weight: 600;
  position: relative;
  z-index: 7;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
}

.product-auth.product-login .auth-home-nav {
  margin-bottom: 0.65rem;
  opacity: 1;
}

.product-auth.product-login .auth-home-icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 50%;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.28);
  text-decoration: none !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
  box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.25);
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.product-auth.product-login .auth-home-icon-link:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.42);
}

.product-auth.product-login .auth-home-icon-link:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 3px;
}

/* Full-screen landing: hockey balls, one-active credit (background shared with body.product-auth) */
body.product-auth.product-landing {
  min-height: 100vh;
  min-height: 100dvh;
}

.product-landing .landing-page {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  position: relative;
  background: var(--h0ckey-landing-wallpaper);
}

.product-landing .landing-credit {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: min(11rem, 42vw);
  max-width: calc(100vw - 2rem);
  padding: 0;
  pointer-events: none;
  text-align: center;
}

/* Pull logo up by one line height; text stacks on top (z-index) and sits over image top */
.product-landing .landing-credit-text {
  position: relative;
  z-index: 1;
  margin: 0 0 -1.2em;
  width: 100%;
  text-align: center;
  font-size: clamp(0.55rem, 2.5vw, 0.72rem);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: lowercase;
  color: #bdbdbd;
  text-shadow: 0 0.06em 0.28em rgba(0, 0, 0, 0.5);
  line-height: 1.2;
  white-space: nowrap;
}

.product-landing .landing-credit-logo {
  position: relative;
  z-index: 0;
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0.15rem;
  /* Match .landing-brand-title #bdbdbd + shadow (raster → flat tint) */
  filter: brightness(0) invert(74.12%)
    drop-shadow(0 0.06em 0.28em rgba(0, 0, 0, 0.5));
}

/* Bottom-right wordmark: Saira Stencil One (single/Google weight; tightened for condensed look) */
.product-landing .landing-brand-title {
  position: absolute;
  right: calc(0.75rem + 50px);
  bottom: calc(0.75rem + 50px);
  margin: 0;
  z-index: 5;
  font-family: "Saira Stencil One", system-ui, sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: clamp(3rem, 11vw, 6.25rem);
  line-height: 0.95;
  letter-spacing: -0.06em;
  color: #bdbdbd;
  text-shadow: 0 0.06em 0.28em rgba(0, 0, 0, 0.5);
  pointer-events: none;
  user-select: none;
}

.product-landing .landing-main {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 1rem;
}

.product-landing .landing-ball-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.product-landing .landing-ball-top {
  align-self: center;
  z-index: 2;
  margin-bottom: -0.825rem;
}

.product-landing .landing-ball-bottom-row {
  display: flex;
  gap: 0;
  align-items: flex-start;
  position: relative;
  z-index: 1;
  justify-content: center;
}

.product-landing .landing-ball-btn {
  width: 6.5rem;
  height: 6.5rem;
  border-radius: 50%;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.2s ease;
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.55), 0 0.15rem 0.4rem rgba(0, 0, 0, 0.4);
}

.product-landing .landing-ball-btn:hover {
  transform: translateY(-2px);
}

.product-landing .landing-ball-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 3px;
}

/* Landing balls: same dimple photo for all three; veil color tints (no separate colored source art). */
.product-landing {
  --landing-player-ball-veil-opacity: 0.62;
  --landing-coach-ball-veil-opacity: 0.74;
  --landing-register-ball-veil-opacity: 0.74;
}

.product-landing .landing-ball-core {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.48);
  background-image:
    radial-gradient(circle at 18% 20%, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.12) 28%, rgba(255, 255, 255, 0) 38%),
    radial-gradient(circle at 30% 32%, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 14%),
    radial-gradient(circle at 24% 47%, rgba(4, 8, 24, 0.38) 0%, rgba(4, 8, 24, 0.14) 14%, rgba(4, 8, 24, 0) 22%),
    radial-gradient(circle at 21% 44%, rgba(255, 255, 255, 0.52) 0%, rgba(255, 255, 255, 0.12) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 49% 27%, rgba(4, 8, 24, 0.38) 0%, rgba(4, 8, 24, 0.14) 13%, rgba(4, 8, 24, 0) 21%),
    radial-gradient(circle at 46% 24%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.12) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 68% 41%, rgba(4, 8, 24, 0.38) 0%, rgba(4, 8, 24, 0.14) 14%, rgba(4, 8, 24, 0) 22%),
    radial-gradient(circle at 65% 38%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.12) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 36% 71%, rgba(4, 8, 24, 0.36) 0%, rgba(4, 8, 24, 0.12) 14%, rgba(4, 8, 24, 0) 22%),
    radial-gradient(circle at 33% 68%, rgba(255, 255, 255, 0.48) 0%, rgba(255, 255, 255, 0.1) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 75% 72%, rgba(4, 8, 24, 0.38) 0%, rgba(4, 8, 24, 0.14) 14%, rgba(4, 8, 24, 0) 22%),
    radial-gradient(circle at 72% 69%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.12) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 55% 57%, rgba(4, 8, 24, 0.34) 0%, rgba(4, 8, 24, 0.12) 13%, rgba(4, 8, 24, 0) 21%),
    radial-gradient(circle at 52% 54%, rgba(255, 255, 255, 0.46) 0%, rgba(255, 255, 255, 0.1) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 50% 82%, rgba(4, 8, 24, 0.32) 0%, rgba(4, 8, 24, 0.1) 13%, rgba(4, 8, 24, 0) 21%),
    radial-gradient(circle at 47% 79%, rgba(255, 255, 255, 0.44) 0%, rgba(255, 255, 255, 0.09) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 82% 55%, rgba(4, 8, 24, 0.34) 0%, rgba(4, 8, 24, 0.1) 13%, rgba(4, 8, 24, 0) 21%),
    radial-gradient(circle at 79% 52%, rgba(255, 255, 255, 0.44) 0%, rgba(255, 255, 255, 0.09) 7%, rgba(255, 255, 255, 0) 13%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 52%);
  box-shadow:
    inset 0 0.5rem 0.85rem rgba(255, 255, 255, 0.55),
    inset 0 -0.65rem 1.1rem rgba(0, 0, 0, 0.26),
    inset 0 0.18rem 0.25rem rgba(255, 255, 255, 0.32),
    inset 0 0 0 1.5px rgba(255, 255, 255, 0.36);
}

.product-landing .landing-ball-ring-text {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.product-landing .landing-ball-ring-label {
  fill: #000000;
  opacity: 0.95;
  font-size: 15.625px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-shadow: none;
}

/* Strip fake dimple gradients; photo + tinted veil below. */
.product-landing .landing-ball-player .landing-ball-core,
.product-landing .landing-ball-coach .landing-ball-core,
.product-landing .landing-ball-register .landing-ball-core {
  background: none;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
}

.product-landing .landing-ball-player .landing-ball-core {
  border-color: rgba(255, 255, 255, 0.48);
}

.product-landing .landing-ball-coach .landing-ball-core {
  border-color: rgba(200, 150, 40, 0.5);
}

.product-landing .landing-ball-register .landing-ball-core {
  border-color: rgba(200, 70, 130, 0.45);
}

.product-landing .landing-ball-player .landing-ball-core::before,
.product-landing .landing-ball-coach .landing-ball-core::before,
.product-landing .landing-ball-register .landing-ball-core::before {
  content: "";
  position: absolute;
  inset: -3%;
  border-radius: 50%;
  z-index: 0;
  background: url("../img/hockey-ball-dimples.png") center / cover no-repeat;
}

.product-landing .landing-ball-player .landing-ball-core::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.48);
  background-color: rgba(255, 255, 255, var(--landing-player-ball-veil-opacity, 0.62));
  box-shadow:
    inset 0 0.5rem 0.85rem rgba(255, 255, 255, 0.55),
    inset 0 -0.65rem 1.1rem rgba(0, 0, 0, 0.26),
    inset 0 0.18rem 0.25rem rgba(255, 255, 255, 0.32),
    inset 0 0 0 1.5px rgba(255, 255, 255, 0.36);
}

.product-landing .landing-ball-coach .landing-ball-core::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(210, 160, 45, 0.55);
  background-color: rgb(255 216 77 / var(--landing-coach-ball-veil-opacity, 0.74));
  box-shadow:
    inset 0 0.5rem 0.85rem rgba(255, 248, 210, 0.5),
    inset 0 -0.65rem 1.1rem rgba(120, 85, 10, 0.22),
    inset 0 0.18rem 0.25rem rgba(255, 255, 230, 0.35),
    inset 0 0 0 1.5px rgba(255, 235, 160, 0.45);
}

.product-landing .landing-ball-register .landing-ball-core::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(210, 90, 150, 0.5);
  background-color: rgb(255 120 194 / var(--landing-register-ball-veil-opacity, 0.74));
  box-shadow:
    inset 0 0.5rem 0.85rem rgba(255, 235, 250, 0.48),
    inset 0 -0.65rem 1.1rem rgba(120, 30, 70, 0.2),
    inset 0 0.18rem 0.25rem rgba(255, 220, 240, 0.38),
    inset 0 0 0 1.5px rgba(255, 190, 225, 0.42);
}

@media (max-width: 576px) {
  .product-landing .landing-main {
    padding: 0.75rem;
  }

  .product-landing .landing-ball-btn {
    width: 5.5rem;
    height: 5.5rem;
  }

  .product-landing .landing-ball-top {
    margin-bottom: -0.725rem;
  }

  .product-landing .landing-ball-ring-label {
    font-size: 13.125px;
    letter-spacing: 1.5px;
  }
}

/* Portrait phones: drop the +50px right inset so the wordmark hugs the margin, away from the balls */
@media (max-width: 576px) and (orientation: portrait) {
  .product-landing .landing-brand-title {
    right: max(0.5rem, env(safe-area-inset-right, 0px));
    bottom: max(0.65rem, env(safe-area-inset-bottom, 0px));
  }
}

/* Selector compile toolbar: one chevron, no double-arrow glitch */
.selector-compile-toolbar .form-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.65rem center;
  background-size: 14px 12px;
  padding-right: 2.25rem;
}

/*
 * Product <select> styling: match Sessions → Search & filter → Type (`PlaybookSessionFilterForm`):
 * use `form-control form-control-sm` on native selects for consistent chrome (same as filter row).
 * Prefer that over blanket `form-select` overrides here — selector-compile-toolbar keeps its own fix.
 */

/* Coach dashboard / LMS nav matrix: cells + wrapper — same translucent surface as cards */
.content-body.product-app .table-responsive.border.rounded.bg-white {
  background-color: var(--h0ckey-product-card-surface) !important;
}

.content-body.product-app .coach-dashboard-nav-table thead.table-light th,
.content-body.product-app .coach-dashboard-nav-table tbody th.table-light {
  background-color: rgba(248, 249, 250, 0.8) !important;
}

[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table thead.table-light th,
[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table tbody th.table-light {
  background-color: #1a1d21 !important;
  color: #f8f9fa !important;
  border-color: #343a40 !important;
}

.coach-dashboard-nav-table > tbody > tr > td {
  background-color: var(--h0ckey-product-card-surface);
  padding-top: 0.14rem;
  padding-bottom: 0.14rem;
  padding-left: 0.12rem;
  padding-right: 0.12rem;
}

/* Coach player stats “cards” (div panels with bg-white) */
.content-body.product-app .cps-card.bg-white {
  background-color: var(--h0ckey-product-card-surface) !important;
}

.coach-dashboard-nav-table thead th,
.coach-dashboard-nav-table tbody tr.coach-dashboard-nav-label-row th {
  padding: 0.12rem 0.22rem;
  font-size: 1.15rem;
  line-height: 1.12;
  font-weight: 600;
  vertical-align: middle;
}

.coach-dashboard-nav-table tbody tr.coach-dashboard-nav-label-row + tr.coach-dashboard-nav-btn-row td,
.coach-dashboard-nav-table tbody tr.coach-dashboard-nav-btn-row + tr.coach-dashboard-nav-label-row th {
  border-top-width: 1px;
}

/* Coach/LMS top submenu: tight New / Find pairing. */
.coach-dashboard-nav-table .btn.btn-sm {
  padding-top: 0.06rem;
  padding-bottom: 0.06rem;
  padding-left: 0.45rem;
  padding-right: 0.45rem;
  min-width: 0;
  margin: 0;
}

[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table .btn-outline-primary {
  color: #cfe2ff !important;
  border-color: rgba(110, 168, 254, 0.85) !important;
  background: rgba(13, 110, 253, 0.18) !important;
}
[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table .btn-outline-primary:hover,
[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table .btn-outline-primary:focus {
  color: #fff !important;
  background: #0d6efd !important;
  border-color: #0d6efd !important;
}
[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table .btn-outline-secondary {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.9) !important;
  background: rgba(255, 255, 255, 0.06) !important;
}
[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table .btn-outline-secondary:hover,
[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table .btn-outline-secondary:focus {
  color: #fff !important;
  border-color: #fff !important;
  background: rgba(255, 255, 255, 0.14) !important;
}

[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table > tbody > tr > td {
  background-color: #14161a !important;
  border-color: #343a40 !important;
}

/* Collapse panels under top submenu: slightly shorter vertical rhythm. */
.content-body.product-app #coach-find-skills .card-body,
.content-body.product-app #coach-find-plans .card-body {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.content-body.product-app .coach-submenu-cancel {
  position: absolute;
  top: 0.35rem;
  right: 0.45rem;
  z-index: 2;
}

.content-body.product-app .coach-submenu-search-input {
  color: #495057 !important;
}

/* Skills / Sessions / Training plans: full-width controls inside columns */
.content-body.product-app .product-hub-filter-form .form-control,
.content-body.product-app .product-hub-filter-form select {
  width: 100%;
  min-width: 0;
}

/* Keep search + coach + tag/type on one row; horizontal scroll on narrow viewports */
.content-body.product-app .product-hub-filter-one-row.row {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}
@media (min-width: 992px) {
  .content-body.product-app .product-hub-filter-one-row.row {
    flex-wrap: wrap;
    overflow-x: visible;
  }
}

/*
 * Skill / Sessions / Training plans filter row — same box as media catalog toolbar .btn-sm:
 * --mc-control-h = calc(1.5em + 0.5rem + 2px), padding 0.2rem 0.55rem
 */
.skill-lib-filter-btn,
.coach-act-filter-btn,
.tp-hub-filter-btn {
  height: calc(1.5em + 0.5rem + 2px);
  min-height: calc(1.5em + 0.5rem + 2px);
  padding: 0.2rem 0.55rem;
  font-size: 0.875rem;
  line-height: 1.5;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Training plan compose (hub): session-type tag pills match Apply/Reset control height */
.plan-form-page .plan-session-type-pill {
  height: calc(1.5em + 0.5rem + 2px);
  min-height: calc(1.5em + 0.5rem + 2px);
  padding: 0.2rem 0.55rem;
  font-size: 0.875rem;
  line-height: 1.5;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

[data-theme-version="dark"] .plan-form-page .plan-session-type-pill.btn-outline-secondary {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.92) !important;
  background: rgba(255, 255, 255, 0.06);
}
[data-theme-version="dark"] .plan-form-page .plan-session-type-pill.btn-outline-secondary:hover {
  color: #fff !important;
  border-color: #fff !important;
  background: rgba(255, 255, 255, 0.14);
}
[data-theme-version="dark"] .plan-form-page .plan-session-type-pill.active {
  border-color: #fff !important;
}

/*
 * Sessions + Training plans “Search & filter”: keep native <select> height aligned with Apply/Reset.
 * Scoped to .coach-activities-page / .plan-form-page so Skill Library shell layout is untouched.
 */
.coach-activities-page .product-hub-filter-form input.form-control-sm,
.plan-form-page .product-hub-filter-form input.form-control-sm {
  height: calc(1.5em + 0.5rem + 2px);
  min-height: calc(1.5em + 0.5rem + 2px);
  max-height: calc(1.5em + 0.5rem + 2px);
  box-sizing: border-box;
  padding: 0.2rem 0.55rem;
  font-size: 0.875rem;
  line-height: 1.5;
}

.coach-activities-page .product-hub-filter-form select.form-control-sm,
.plan-form-page .product-hub-filter-form select.form-control-sm {
  height: calc(1.5em + 0.5rem + 2px);
  min-height: calc(1.5em + 0.5rem + 2px);
  max-height: calc(1.5em + 0.5rem + 2px);
  box-sizing: border-box;
  padding: 0.2rem 2rem 0.2rem 0.55rem;
  font-size: 0.875rem;
  line-height: 1.5;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10' aria-hidden='true'%3E%3Cpath fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2 3l6 5 6-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.5rem center;
  background-size: 0.65rem 0.4rem;
}

.coach-activities-page .product-hub-filter-form select.form-control-sm::-ms-expand,
.plan-form-page .product-hub-filter-form select.form-control-sm::-ms-expand {
  display: none;
}

/* Skill library filter card header: sizes set in skill_library.html (.skill-lib-filter-header-btn) */

/* Skill library — mobile portrait: stacked search / coach / tag, then Apply+Reset; tag cloud via pill toggle */
@media (max-width: 767.98px) and (orientation: portrait) {
  body.product-sidebar-compact .content-body.product-app.skill-lib-page .skill-lib-filter-form-row.skill-lib-filter-form-portrait.product-hub-filter-one-row {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }

  body.product-sidebar-compact .content-body.product-app.skill-lib-page .skill-lib-filter-form-row > .col:not(.skill-lib-filter-actions-col) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.product-sidebar-compact .content-body.product-app.skill-lib-page .skill-lib-filter-form-row > .skill-lib-filter-actions-col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.product-sidebar-compact .content-body.product-app.skill-lib-page #skill-lib-tag-cloud-panel.skill-lib-tag-cloud--collapsed-mobile {
    display: none !important;
  }

  body.product-sidebar-compact .content-body.product-app.skill-lib-page .skill-lib-tag-cloud-toggle-btn {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.8rem;
  }
}

/* Skill library: compact tiles (~half visual height vs default cards) */
.skill-lib-card-compact {
  max-height: 11.5rem;
  overflow: hidden;
}
.skill-lib-card-compact .card-body {
  min-height: 0;
}

/* Narrow icon-only sidebars (player / coach / assessment) */
body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .deznav.deznav-product {
  width: 4.5rem !important;
  min-width: 4.5rem !important;
  max-width: 4.5rem !important;
  transform: none;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Collapsed: slide strip off-canvas (theme mini mode did nothing — product CSS fixed width always) */
body.product-sidebar-compact #main-wrapper.menu-toggle .deznav.deznav-product {
  transform: translateX(-100%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Theme .menu-toggle .deznav { width: 5rem } fights product rail — force hidden state */
body.product-sidebar-compact[data-layout="vertical"][data-sidebar-style="full"] #main-wrapper.menu-toggle .deznav.deznav-product {
  width: 4.5rem !important;
  min-width: 4.5rem !important;
  max-width: 4.5rem !important;
}

body.product-sidebar-compact {
  /* Top inset for first coach-rail icons (px — avoid nested calc() inside custom props; some builds drop the rule) */
  /* Icon rail first row: nudge below header chrome */
  --product-rail-menu-pad-top: 20px;
  --product-rail-first-row-h: 4rem;
  --product-header-margin-bottom: 0px;
}

body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .content-body {
  margin-left: 4.5rem !important;
}

body.product-sidebar-compact #main-wrapper.menu-toggle .content-body {
  margin-left: 0 !important;
}

/* Side + top chrome: transparent so main canvas wallpaper shows through (GUI hex kept for future tint) */
body.product-sidebar-compact .nav-header,
body.product-sidebar-compact .header,
body.product-sidebar-compact .deznav.deznav-product {
  background-color: transparent !important;
}

/* Desktop: icon rail spans full main-wrapper height (matches tall content); rail top aligns below nav-header */
@media (min-width: 768px) {
  body.product-sidebar-compact #main-wrapper {
    position: relative;
  }

  body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .deznav.deznav-product {
    position: absolute;
    left: 0;
    top: var(--product-shell-rail-top, 5rem);
    bottom: 0;
    height: auto !important;
    max-height: none !important;
  }
}

/* Collapsed rail: toggle lives in header row 2 — no extra left gutter for a rail strip beside the logo. */
body.product-sidebar-compact[data-layout="vertical"] #main-wrapper.menu-toggle .header {
  padding-left: 0.75rem !important;
  width: 100% !important;
}

body.product-sidebar-compact[data-layout="vertical"] #main-wrapper.menu-toggle .nav-header {
  width: 100% !important;
  max-width: 100% !important;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu.product-nav-icons > li {
  width: 100%;
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex;
  justify-content: center;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.52rem 0.22rem !important;
  margin: 0.06rem 0;
  border-radius: 0.35rem;
  border: 2px solid transparent;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  overflow: visible;
  color: #fff !important;
}

body.product-sidebar-compact .deznav.deznav-product .product-nav-svg,
body.product-sidebar-compact .deznav.deznav-product .product-nav-img {
  width: 2.832rem;
  height: 2.832rem;
  flex-shrink: 0;
  object-fit: contain;
  display: block;
}

/* Coach rail: slightly larger Training plans + Teams marks (+10%) */
body.product-sidebar-compact .deznav.deznav-product .product-nav-li--training-plans .product-nav-img,
body.product-sidebar-compact .deznav.deznav-product .product-nav-li--teams .product-nav-img {
  width: 3.1152rem;
  height: 3.1152rem;
}

/* Sidebar img icons → white (raster assets) */
body.product-sidebar-compact .deznav.deznav-product .product-nav-img {
  filter: brightness(0) invert(1);
  overflow: visible;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link .product-nav-svg {
  stroke: #fff !important;
  color: #fff !important;
}

/* Border-only hover */
body.product-sidebar-compact .deznav.deznav-product .metismenu > li:hover > a.product-nav-link,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li:focus > a.product-nav-link,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link:hover,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link:focus {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.65);
}

body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li:hover > a.product-nav-link,
body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li:focus > a.product-nav-link,
body.product-sidebar-compact[data-theme-version="dark"] .menu-toggle .deznav.deznav-product .metismenu > li:hover > a.product-nav-link,
body.product-sidebar-compact[data-theme-version="dark"] .menu-toggle .deznav.deznav-product .metismenu > li:focus > a.product-nav-link {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.65);
}

@media (min-width: 768px) {
  body.product-sidebar-compact[data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li:hover > a.product-nav-link,
  body.product-sidebar-compact[data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li:focus > a.product-nav-link,
  body.product-sidebar-compact[data-theme-version="dark"][data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li:hover > a.product-nav-link,
  body.product-sidebar-compact[data-theme-version="dark"][data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li:focus > a.product-nav-link {
    background: transparent !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.65);
    border-radius: 0.35rem;
    position: unset;
  }
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li:hover > a.product-nav-link .product-nav-svg,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li:focus > a.product-nav-link .product-nav-svg,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link:hover .product-nav-svg {
  stroke: #fff !important;
  color: #fff !important;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li:hover > a.product-nav-link .product-nav-img,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link:hover .product-nav-img {
  filter: brightness(0) invert(1);
  opacity: 1;
}

body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li:hover > a.product-nav-link .product-nav-svg,
body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li:focus > a.product-nav-link .product-nav-svg {
  stroke: #fff !important;
  color: #fff !important;
}

/* Theme mm-active uses a strong ::before bar + tint; soften for icon-only nav */
body.product-sidebar-compact .deznav.deznav-product .metismenu > li > a.product-nav-link:before {
  display: none !important;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #fff !important;
}

body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link,
body.product-sidebar-compact[data-theme-version="dark"] .menu-toggle .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #fff !important;
  border-radius: 0.35rem;
}

@media (min-width: 768px) {
  body.product-sidebar-compact[data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link,
  body.product-sidebar-compact[data-theme-version="dark"][data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #fff !important;
    border-radius: 0.35rem;
  }
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li.mm-active:hover > a.product-nav-link,
body.product-sidebar-compact .deznav.deznav-product .metismenu > li.mm-active:focus > a.product-nav-link {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.65);
}

body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li.mm-active:hover > a.product-nav-link,
body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li.mm-active:focus > a.product-nav-link {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.65);
}

@media (min-width: 768px) {
  body.product-sidebar-compact[data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li.mm-active:hover > a.product-nav-link,
  body.product-sidebar-compact[data-sidebar-style="mini"][data-layout="vertical"] .deznav.deznav-product .metismenu > li.mm-active:focus > a.product-nav-link {
    background: transparent !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.65);
  }
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link .product-nav-svg {
  stroke: #fff !important;
  color: #fff !important;
}

body.product-sidebar-compact .menu-toggle .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link .product-nav-svg {
  stroke: #fff !important;
  color: #fff !important;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu > li.mm-active > a.product-nav-link .product-nav-img {
  filter: brightness(0) invert(1);
}

body.product-sidebar-compact .content-body.coach-player-stats,
body.product-sidebar-compact .content-body.coach-assessments-page {
  min-height: 100vh;
  padding-bottom: 3rem;
}

/* Short pages: keep main column tall so the icon rail can use the full viewport height without clipping. */
body.product-sidebar-compact .content-body.product-app {
  position: relative;
  z-index: 0;
  min-height: 100vh;
  min-height: 100dvh;
  padding-bottom: 2rem;
  box-sizing: border-box;
}

/* ~15% larger than default h3 (1.75rem) */
.coach-dashboard-title {
  font-size: 2.0125rem;
}

body.coach-dashboard-page .header .dashboard_bar {
  color: #1e3fb4;
  font-weight: 600;
  font-size: 1.125rem;
}

body.product-sidebar-compact .header .dashboard_bar {
  color: #fff !important;
}

body.product-sidebar-compact .header-profile > .nav-link .header-info .text-black,
body.product-sidebar-compact .header-profile > .nav-link .header-info strong {
  color: #fff !important;
}

body.product-sidebar-compact .header-profile .text-muted,
body.product-sidebar-compact .header-profile .nav-profile-meta,
body.product-sidebar-compact .header-profile .nav-profile-role {
  color: rgba(255, 255, 255, 0.82) !important;
}

/* Header search: not fixed/sticky — scrolls with page (data-header-position=static on body). */
body.product-sidebar-compact .header .search-area {
  position: static;
}

body.product-sidebar-compact .header .search-area .input-group-text {
  background: #e9ecef !important;
  border-color: transparent !important;
  color: #495057;
  padding-top: calc(0.375rem * 0.81);
  padding-bottom: calc(0.375rem * 0.81);
}

body.product-sidebar-compact .header .search-area .form-control {
  color: #343a40 !important;
  background: #e9ecef !important;
  border-color: transparent !important;
  padding-top: calc(0.375rem * 0.81);
  padding-bottom: calc(0.375rem * 0.81);
  line-height: 1.215;
}

body.product-sidebar-compact .header .search-area .form-control::placeholder {
  color: #6c757d !important;
}

body.product-sidebar-compact .header .search-area .form-control:focus {
  color: #343a40 !important;
  background: #e9ecef !important;
  border-color: #adb5bd !important;
  box-shadow: 0 0 0 0.125rem rgba(73, 80, 87, 0.2);
}

body.product-sidebar-compact .header .search-area .input-group-text i,
body.product-sidebar-compact .header .search-area .input-group-text button {
  color: #495057 !important;
}

.teams-page #teams-player-search-results .list-group-item,
.teams-page #teams-player-search-results .list-group-item-action,
.teams-page .teams-player-search-results .list-group-item,
.teams-page .teams-player-search-results .list-group-item-action {
  color: rgba(255, 255, 255, 0.92);
}

.coach-player-stats .cps-raw-table .cps-raw-rowhead {
  max-width: 14rem;
  white-space: normal;
  font-weight: 500;
}

body.product-sidebar-compact .deznav.deznav-product .copyright,
body.product-sidebar-compact .deznav.deznav-product .add-menu-sidebar {
  display: none !important;
}

/*
 * Icon-only sidebars (e.g. assessment: items below State pin/map): theme uses large
 * padding-top + height:100% on .deznav-scroll, which can clip the last icons or prevent
 * inner scrolling. Bind height to the viewport and let .deznav-scroll flex + scroll.
 */
body.product-sidebar-compact .deznav.deznav-product {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  /* Theme .deznav { padding-top: 120px } — would leave a blank “slot” and push coach below main cards */
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.product-sidebar-compact .deznav.deznav-product .deznav-scroll {
  flex: 1 1 auto;
  min-height: 0;
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

body.product-sidebar-compact .deznav.deznav-product .metismenu.product-nav-icons {
  padding-bottom: 0.75rem;
}

/*
 * Icon rail: pad the menu list (scroll-area padding was a no-op in practice).
 * html + #main-wrapper + attrs beats theme [data-sidebar-style=full] .deznav .metismenu rules.
 * Apply for both expanded and menu-toggle states (theme toggles #main-wrapper.menu-toggle).
 */
html body.product-sidebar-compact[data-sidebar-style="full"][data-layout="vertical"]
  #main-wrapper
  .deznav.deznav-product
  ul.metismenu.product-nav-icons {
  padding-top: calc(var(--product-header-margin-bottom, 0px) + var(--product-rail-menu-pad-top, 10px)) !important;
}

/* Theme full-vertical sidebar adds chevrons / bars on any top-level <a>; icon rail has none */
body.product-sidebar-compact .deznav.deznav-product .metismenu.product-nav-icons > li > a.product-nav-link::after {
  display: none !important;
  content: none !important;
}

@media (max-width: 767.98px) {
  body.product-sidebar-compact #main-wrapper .content-body {
    margin-left: 0 !important;
  }

  /* Icon rail: fixed overlay so it is visible when expanded (theme had no absolute/fixed here). */
  body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .deznav.deznav-product {
    position: fixed !important;
    left: 0 !important;
    top: var(--product-shell-rail-top, 5.25rem) !important;
    bottom: 0 !important;
    height: auto !important;
    max-height: none !important;
    width: 4.5rem !important;
    min-width: 4.5rem !important;
    max-width: 4.5rem !important;
    z-index: 1040 !important;
    transform: translateX(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    box-shadow: 4px 0 22px rgba(0, 0, 0, 0.24);
  }

  body.product-sidebar-compact #main-wrapper.menu-toggle .deznav.deznav-product {
    position: fixed !important;
    left: 0 !important;
    top: var(--product-shell-rail-top, 5.25rem) !important;
    height: calc(100vh - var(--product-shell-rail-top, 5.25rem)) !important;
    max-height: calc(100vh - var(--product-shell-rail-top, 5.25rem)) !important;
    transform: translateX(-110%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.product-sidebar-compact .content-body.product-app {
    padding-bottom: 1.5rem;
  }

  body.product-sidebar-compact[data-layout="vertical"] #main-wrapper.menu-toggle .nav-header,
  body.product-sidebar-compact[data-layout="vertical"] #main-wrapper:not(.menu-toggle) .nav-header {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: visible !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] .nav-header {
    overflow-x: visible !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo {
    overflow: visible !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] #main-wrapper.menu-toggle .header {
    padding-left: 0.75rem !important;
    width: 100% !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] #main-wrapper:not(.menu-toggle) .header {
    padding-left: calc(4.5rem + 0.35rem) !important;
  }
}

/* Phone portrait: logo row + topbar row; coach main + nav matrix full width / tight */
@media (max-width: 767.98px) and (orientation: portrait) {
  body.product-sidebar-compact {
    --product-shell-rail-top: calc(8.2rem - var(--product-chrome-row-pull, 0.22rem));
  }

  body.product-sidebar-compact[data-layout="vertical"] .nav-header {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: var(--product-chrome-row1-h, 2.75rem) !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    padding-bottom: 0 !important;
    text-align: left !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] .nav-header.nav-header--product-stacked {
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo {
    overflow: visible !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding-left: max(0.35rem, env(safe-area-inset-left, 0px)) !important;
    padding-right: 0.75rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }

  body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo .brand-title-text {
    font-size: clamp(1.225rem, 5.95vw, 2.17rem);
  }

  body.product-sidebar-compact .content-body.product-app > .container-fluid {
    max-width: none !important;
    width: 100% !important;
    padding-left: max(0.3rem, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(0.3rem, env(safe-area-inset-right, 0px)) !important;
  }

  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table thead th,
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table tbody tr.coach-dashboard-nav-label-row th {
    padding: 0.06rem 0.12rem;
    font-size: 0.9rem;
    line-height: 1.06;
    font-weight: 600;
  }

  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table > tbody > tr > td {
    padding-top: 0.06rem;
    padding-bottom: 0.06rem;
    padding-left: 0.1rem;
    padding-right: 0.1rem;
  }

  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn.btn-sm {
    padding-top: 0.04rem;
    padding-bottom: 0.04rem;
    padding-left: 0.32rem;
    padding-right: 0.32rem;
    min-width: 0;
    font-size: 0.7rem;
    line-height: 1.12;
  }

  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row,
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table-wrap.table-responsive,
  body.product-sidebar-compact .content-body.product-app .table-responsive.border.rounded.bg-white.mb-1.shadow-sm {
    margin-bottom: 0.2rem !important;
    box-shadow: none !important;
  }

  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn.btn-sm {
    padding-top: 0.04rem;
    padding-bottom: 0.04rem;
    padding-left: 0.32rem;
    padding-right: 0.32rem;
    min-width: 0;
    font-size: 0.7rem;
    line-height: 1.12;
  }
}

/* Coach/LMS top nav cards row — all product pages: no gray slab; compact sidebar rules below can add wallpaper blur */
.content-body.product-app .coach-dashboard-nav-cards-row {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

html:not([data-theme-version="dark"]) .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell {
  background: transparent !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  box-shadow: none !important;
}

html:not([data-theme-version="dark"]) .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell-label {
  color: #212529 !important;
}

html:not([data-theme-version="dark"]) .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary,
html:not([data-theme-version="dark"]) .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary {
  border-radius: 0.2rem !important;
  box-shadow: none !important;
  font-weight: 600;
}

html[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell,
body[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  box-shadow: none !important;
}

html[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell-label,
body[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell-label {
  color: rgba(255, 255, 255, 0.95) !important;
}

/* Coach/LMS top nav: four-column row — frosted cells, light text */
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table-wrap.table-responsive.border.rounded.bg-white,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table-wrap.table-responsive {
  background: transparent !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: none !important;
  box-shadow: none !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 0 12px rgba(120, 185, 255, 0.18),
    0 0 24px rgba(80, 140, 255, 0.1);
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell-label {
  color: rgba(255, 255, 255, 0.96) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn-outline-primary {
  color: #e8f2ff !important;
  border-color: rgba(110, 168, 254, 0.95) !important;
  background: rgba(13, 110, 253, 0.22) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary {
  border-radius: 0.2rem !important;
  box-shadow: none !important;
  font-weight: 600;
  border-width: 1px !important;
  background: transparent !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary {
  color: #cfe2ff !important;
  border-color: rgba(110, 168, 254, 0.55) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary {
  color: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary:hover,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary:focus {
  color: #fff !important;
  background: rgba(13, 110, 253, 0.35) !important;
  border-color: rgba(110, 168, 254, 0.85) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary:hover,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary:focus {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn-outline-primary:hover,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn-outline-primary:focus {
  color: #fff !important;
  background: #0d6efd !important;
  border-color: #0d6efd !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn-outline-secondary {
  color: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn-outline-secondary:hover,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table .btn-outline-secondary:focus {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.85) !important;
  background: rgba(255, 255, 255, 0.16) !important;
}

body.product-sidebar-compact[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-cards-row,
body.product-sidebar-compact[data-theme-version="dark"] .content-body.product-app .coach-dashboard-nav-table-wrap.table-responsive {
  border: none !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table thead.table-light th,
body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table tbody th.table-light {
  background-color: transparent !important;
  color: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-table > tbody > tr > td {
  background-color: transparent !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

/* Player name search (squad assessments, coach player stats, etc.) */
.h0ckey-player-name-search.form-control {
  border-width: 2px;
  border-color: #495057;
}

.h0ckey-player-name-search.form-control:focus {
  border-color: #212529;
  box-shadow: 0 0 0 0.2rem rgba(33, 37, 41, 0.2);
}

/* Player Stats (coach): soften search field + results panel (no heavy “black” chrome) */
.coach-player-stats .h0ckey-player-name-search.form-control {
  border-width: 1px;
  border-color: #ced4da;
}

.coach-player-stats .h0ckey-player-name-search.form-control:focus {
  border-color: #86b7fe;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.coach-player-stats #cps-search-results.list-group {
  border: 1px solid #dee2e6 !important;
  border-radius: 0.375rem;
  box-shadow: 0 0.125rem 0.35rem rgba(0, 0, 0, 0.06);
}

/* Coach player stats / assessment charts / LMS charts: find player + selection */
.coach-player-stats .cps-find-player-label,
.coach-assessment-charts .cps-find-player-label,
.coach-lms-charts .cps-find-player-label {
  color: #495057 !important;
}

.coach-player-stats .h0ckey-player-name-search.form-control,
.coach-assessment-charts .h0ckey-player-name-search.form-control,
.coach-lms-charts .h0ckey-player-name-search.form-control {
  color: #495057 !important;
}

.coach-player-stats .h0ckey-player-name-search.form-control::placeholder,
.coach-assessment-charts .h0ckey-player-name-search.form-control::placeholder,
.coach-lms-charts .h0ckey-player-name-search.form-control::placeholder {
  color: #6c757d;
  opacity: 1;
}

.coach-assessment-charts .h0ckey-player-name-search.form-control {
  border-width: 1px;
  border-color: #ced4da;
}

.coach-assessment-charts .h0ckey-player-name-search.form-control:focus {
  border-color: #86b7fe;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.coach-player-stats .cps-player-selected-summary,
.coach-assessment-charts .cps-player-selected-summary,
.coach-lms-charts .cps-player-selected-summary {
  color: rgba(255, 255, 255, 0.88);
}

.coach-player-stats .cps-player-selected-summary strong,
.coach-assessment-charts .cps-player-selected-summary strong,
.coach-lms-charts .cps-player-selected-summary strong {
  color: rgba(255, 255, 255, 0.95);
}

.coach-player-stats .cps-player-selected-meta,
.coach-assessment-charts .cps-player-selected-meta,
.coach-lms-charts .cps-player-selected-meta {
  color: rgba(255, 255, 255, 0.72);
}

.coach-player-stats .cps-player-selected-clear,
.coach-assessment-charts .cps-player-selected-clear,
.coach-lms-charts .cps-player-selected-clear {
  color: #0d6efd;
}

/* Find-player nav row — no strip background (matches card) */
.coach-player-stats .cps-find-player-nav-row,
.coach-assessment-charts .cps-find-player-nav-row,
.coach-lms-charts .cps-find-player-nav-row {
  padding: 0.15rem 0;
}

/* Squad assessments year filter — same surface family as secondary panels */
.content-body.product-app .cps-assessment-year-toolbar {
  background-color: var(--bs-secondary-bg, #f8f9fa);
  border-color: rgba(0, 0, 0, 0.08);
}

/* RAW table: rubric score digits 0–10 (HNSW score indication schema colours). */
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-0,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-0"] {
  background: #e9ecef !important;
  color: #495057 !important;
  font-weight: 600;
}

.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-1,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-1"] {
  background-color: #e60000 !important;
  color: #fff !important;
  font-weight: 600;
}

.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-2,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-2"] {
  background-color: #fdcb31 !important;
  color: #1a1a1a !important;
  font-weight: 600;
}

.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-3,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-3"] {
  background-color: #f5a3a3 !important;
  color: #1a1a1a !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-4,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-4"] {
  background-color: #e8a887 !important;
  color: #1a1a1a !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-5,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-5"] {
  background-color: #ffb347 !important;
  color: #1a1a1a !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-6,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-6"] {
  background-color: #ff9800 !important;
  color: #1a1a1a !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-7,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-7"] {
  background-color: #8fd37a !important;
  color: #1a1a1a !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-8,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-8"] {
  background-color: #00b050 !important;
  color: #fff !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-9,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-9"] {
  background-color: #fff44f !important;
  color: #1a1a1a !important;
  font-weight: 600;
}
.content-body.product-app .cps-raw-table tbody td.cps-raw-tone-10,
.content-body.product-app .cps-raw-table tbody td[data-cps-tone="cps-raw-tone-10"] {
  background-color: #fff200 !important;
  color: #1a1a1a !important;
  font-weight: 600;
}

/* Assessment graph sheet: main chart + ARL column (dots only shows ARL) */
.content-body.product-app .cps-ag-chart-arl-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7rem, 14%);
  gap: 1rem 1.25rem;
  align-items: start;
}

.content-body.product-app .cps-ag-chart-arl-grid.cps-ag-chart-arl-grid--full {
  grid-template-columns: 1fr;
}

/* Squad trend chart: mirror graph sheet column widths so x-grid lines align with line totals above */
.content-body.product-app .cps-ag-chart-trend-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7rem, 14%);
  gap: 1rem 1.25rem;
  align-items: start;
}

.content-body.product-app .cps-ag-chart-trend-spacer {
  min-height: 1px;
}

@media (max-width: 767.98px) {
  .content-body.product-app .cps-ag-chart-arl-grid {
    grid-template-columns: 1fr;
  }

  .content-body.product-app .cps-ag-chart-trend-grid {
    grid-template-columns: 1fr;
  }

  .content-body.product-app .cps-ag-chart-trend-spacer {
    display: none;
  }
}

.content-body.product-app .cps-ag-arl-aside .cps-assessment-records-list {
  max-width: 100%;
  font-size: 0.6875rem;
  line-height: 1.4;
}

.content-body.product-app .cps-ag-arl-aside .cps-assessment-record-label {
  font-size: 0.6875rem;
  line-height: 1.3;
  color: #212529;
}

.content-body.product-app .cps-ag-arl-aside .cps-assessment-record-toggle-dot {
  width: 1.045rem;
  height: 1.045rem;
}

/* Assessment graph sheet: no extra toolbar strip */
.content-body.product-app .cps-ag-toolbar-rows {
  background: transparent;
}

/* Graph sheet pills use Bootstrap primary/outline — only tame focus chrome */
.content-body.product-app .cps-ag-view-btn:focus,
.content-body.product-app .cps-ag-totals-btn:focus,
.content-body.product-app .cps-ag-section-btn:focus,
.content-body.product-app .cps-ag-bar-btn:focus {
  box-shadow: none;
}

.content-body.product-app .cps-ag-view-btn:focus:not(:focus-visible),
.content-body.product-app .cps-ag-totals-btn:focus:not(:focus-visible),
.content-body.product-app .cps-ag-section-btn:focus:not(:focus-visible),
.content-body.product-app .cps-ag-bar-btn:focus:not(:focus-visible) {
  outline: none;
}

/*
 * Coach stats compact controls: shared pill proportions (Dots/Bar/Line, sections, years, LMS tabs).
 * Class name: cps-pill-btn (coach player stats pill button).
 */
.content-body.product-app .btn.cps-pill-btn {
  padding-top: 0.12rem;
  padding-bottom: 0.12rem;
  padding-left: 0.65rem;
  padding-right: 0.65rem;
  min-width: 4.75rem;
  line-height: 1.35;
  font-size: 0.875rem;
}

.content-body.product-app .cps-subtle-label {
  color: #495057 !important;
}

.content-body.product-app .cps-assessment-trend-heading {
  color: #495057 !important;
  letter-spacing: 0.04em;
}

.content-body.product-app .cps-squad-assessments-label {
  color: #495057 !important;
}

.content-body.product-app .cps-squad-assessments-value {
  color: #343a40;
}

/* Coach Targets card: dark-gray input surfaces */
.coach-player-stats .cps-target-input {
  background-color: #ffffff !important;
  border-color: #ced4da !important;
  color: #495057 !important;
}

.coach-player-stats .cps-target-input::placeholder {
  color: #6c757d;
}

.coach-player-stats .cps-target-input:focus {
  background-color: #ffffff !important;
  border-color: #adb5bd !important;
  color: #495057 !important;
  box-shadow: 0 0 0 0.15rem rgba(108, 117, 125, 0.18);
}

/* Sessions compose: ensure Additional Instructions text remains dark gray. */
.content-body.product-app.coach-activities-page #id_instructions {
  color: #495057 !important;
}

/* Training plans compose: field text matches muted labels (Find sessions, plan fields). */
.content-body.product-app.plan-form-page #plan-session-params-panel .form-control,
.content-body.product-app.plan-form-page #plan-session-finder-search {
  color: var(--h0ckey-product-text-muted, #c5c7c9) !important;
}
.content-body.product-app.plan-form-page #plan-session-finder-search::placeholder {
  color: var(--h0ckey-product-text-muted, #c5c7c9);
  opacity: 0.72;
}

[data-theme-version="dark"] .content-body.product-app.plan-form-page #plan-session-params-panel .form-control,
[data-theme-version="dark"] .content-body.product-app.plan-form-page #plan-session-finder-search {
  color: #9ca3af !important;
}
[data-theme-version="dark"] .content-body.product-app.plan-form-page #plan-session-finder-search::placeholder {
  color: #9ca3af;
  opacity: 0.72;
}

.content-body.product-app .cps-year-no-data {
  opacity: 0.45;
  pointer-events: none;
  cursor: not-allowed;
}

/* ARL beside dot chart (narrow column) */
.content-body.product-app .cps-assessment-records-sidebar .cps-assessment-records-list {
  max-width: 22rem;
  width: 100%;
  font-size: 0.95rem;
  line-height: 1.4;
}

.content-body.product-app .cps-assessment-record-label {
  font-size: 0.91875rem;
  line-height: 1.25;
  color: #212529;
}

/* ARL: color swatch + label only — no pill background */
.content-body.product-app .cps-assessment-record-toggle {
  --cps-rec-color: #3366cc;
  border: none;
  background: transparent;
  padding: 0.12rem 0;
  color: #212529;
  box-shadow: none;
  transition: opacity 0.15s ease, filter 0.15s ease;
}

.content-body.product-app .cps-assessment-record-toggle:hover {
  opacity: 0.92;
}

.content-body.product-app .cps-assessment-record-toggle-off {
  opacity: 0.38;
  filter: grayscale(0.55);
}

.content-body.product-app .cps-assessment-record-toggle-dot {
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 0.2rem;
  background: var(--cps-rec-color);
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.content-body.product-app .cps-assessment-trend-legend {
  color: #212529;
}

/* Shell background: see product-layout.css (landing wallpaper on body). Product app column: */
body.product-sidebar-compact[data-layout="vertical"] .content-body.product-app {
  background: transparent !important;
}

/* Settings white cards (Teams / App Settings): labels + field text = dark gray */
.content-body.product-app .h0ckey-settings-fields .form-label,
.content-body.product-app .h0ckey-settings-fields label:not(.form-check-label) {
  color: #343a40 !important;
}

.content-body.product-app .h0ckey-settings-fields .form-control,
.content-body.product-app .h0ckey-settings-fields .form-select,
.content-body.product-app .h0ckey-settings-fields textarea {
  color: #343a40 !important;
}

.content-body.product-app .h0ckey-settings-fields .form-text,
.content-body.product-app .h0ckey-settings-fields ul.errorlist {
  color: #495057 !important;
}

.content-body.product-app .h0ckey-settings-fields p.small,
.content-body.product-app .h0ckey-settings-fields code {
  color: #495057 !important;
}

.content-body.product-app .h0ckey-settings-fields .form-check-label {
  color: #343a40 !important;
}

body.product-sidebar-compact[data-layout="vertical"] .filter.cm-content-box.box-primary,
body.product-sidebar-compact[data-layout="vertical"] .cm-content-box.box-primary {
  background: #fff !important;
}

/* Help icon: match header SVG blue (~22px path icons → ~2× FA solid default) */
.header .header-help-link,
.header .header-help-link.nav-link {
  color: #0b2a97 !important;
  min-width: 2.75rem;
  min-height: 2.75rem;
}

.header .header-help-icon,
.header .header-help-link .header-help-icon {
  font-size: 2.25rem !important;
  line-height: 1 !important;
  color: #0b2a97 !important;
  opacity: 1 !important;
  vertical-align: middle;
}

body.product-sidebar-compact .header .header-help-link,
body.product-sidebar-compact .header .header-help-link.nav-link,
body.product-sidebar-compact .product-chrome-toolbar-slot .header-help-link,
body.product-sidebar-compact .product-chrome-toolbar-slot .header-help-link.nav-link {
  color: #fff !important;
}

body.product-sidebar-compact .header .header-help-icon,
body.product-sidebar-compact .header .header-help-link .header-help-icon,
body.product-sidebar-compact .product-chrome-toolbar-slot .header-help-icon,
body.product-sidebar-compact .product-chrome-toolbar-slot .header-help-link .header-help-icon {
  color: #fff !important;
}

/*
 * Sidebar toggle: expanded rail → chevron-left; collapsed → hamburger (all viewports).
 * Mobile still uses the same hamburger when collapsed so the control is obvious.
 */
body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .nav-control .product-sidebar-chevron--open {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  color: #fff;
  font-size: 0.8125rem;
}

body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .nav-control .product-sidebar-chevron--closed {
  display: none !important;
}

body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .nav-control .product-mobile-hamburger {
  display: none !important;
}

body.product-sidebar-compact #main-wrapper.menu-toggle .nav-control .product-sidebar-chevron--open {
  display: none !important;
}

/* Collapsed rail (all widths): three-line menu — chevrons stay hidden so the control is always visible on chrome. */
body.product-sidebar-compact #main-wrapper.menu-toggle .nav-control .product-sidebar-chevron--closed {
  display: none !important;
}

body.product-sidebar-compact #main-wrapper.menu-toggle .nav-control .product-mobile-hamburger {
  display: inline-flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
}

body.product-sidebar-compact #main-wrapper.menu-toggle .nav-control .product-mobile-hamburger .line {
  background-color: #fff !important;
  opacity: 1 !important;
  width: 0.95rem !important;
  height: 2px !important;
  margin: 2px 0 !important;
  border-radius: 1px;
}

body.product-sidebar-compact .nav-control .hamburger:not(.product-mobile-hamburger) {
  display: none !important;
}

.nav-header .brand-logo .brand-title-text {
  display: inline-block;
  font-family: "Saira Stencil One", system-ui, sans-serif;
  font-weight: 700;
  font-style: italic;
  color: #fff !important;
  line-height: 0.95;
  letter-spacing: -0.06em;
  text-shadow: 0 0.06em 0.28em rgba(0, 0, 0, 0.5);
  white-space: nowrap;
}

.nav-header .brand-logo .brand-title-text .brand-title-ball {
  display: inline-block;
  width: 0.68em;
  height: 0.68em;
  margin: 0 0.035em;
  border-radius: 50%;
  vertical-align: -0.04em;
  background-color: #fff;
  background-image:
    radial-gradient(circle at 18% 18%, rgba(182, 182, 182, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 31% 14%, rgba(182, 182, 182, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 45% 16%, rgba(184, 184, 184, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 59% 14%, rgba(182, 182, 182, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 72% 18%, rgba(182, 182, 182, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 12% 31%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 25% 29%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 39% 30%, rgba(182, 182, 182, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 53% 29%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 67% 31%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 80% 29%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 16% 44%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 30% 43%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 44% 44%, rgba(182, 182, 182, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 58% 43%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 72% 44%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 84% 43%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 12% 57%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 25% 57%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 39% 58%, rgba(182, 182, 182, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 53% 57%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 67% 58%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 80% 57%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 18% 71%, rgba(180, 180, 180, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 31% 73%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 45% 71%, rgba(182, 182, 182, 0.82) 0.035em, transparent 0.05em),
    radial-gradient(circle at 59% 73%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 72% 71%, rgba(180, 180, 180, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 25% 84%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 39% 84%, rgba(182, 182, 182, 0.82) 0.036em, transparent 0.051em),
    radial-gradient(circle at 53% 84%, rgba(180, 180, 180, 0.82) 0.034em, transparent 0.049em),
    radial-gradient(circle at 67% 84%, rgba(180, 180, 180, 0.82) 0.035em, transparent 0.05em);
  box-shadow:
    inset -0.06em -0.08em 0.16em rgba(0, 0, 0, 0.2),
    inset 0.045em 0.055em 0.09em rgba(255, 255, 255, 0.6),
    0 0.04em 0.12em rgba(0, 0, 0, 0.35);
}

body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo .brand-title-text {
  /* ~30% smaller than prior clamp; sized to sit near 36px profile avatar */
  font-size: clamp(1.575rem, 3.36vw, 2.52rem);
  max-width: 100%;
  line-height: 0.95;
}

/* Expanded sidebar: show long mark only — theme leaves .logo-abbr visible beside .brand-title */
body.product-sidebar-compact[data-sidebar-style="full"][data-layout="vertical"]
  #main-wrapper:not(.menu-toggle)
  .nav-header
  .logo-abbr {
  display: none !important;
}

/* Clip brand inside the header strip so scaled art does not paint over the icon rail below. */
body.product-sidebar-compact[data-layout="vertical"] .nav-header {
  overflow: hidden;
}
body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo {
  position: relative;
  z-index: 2;
  overflow: hidden;
  max-height: 100%;
  align-items: center;
}
body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo img.logo-abbr,
body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo img.logo-compact,
body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo img.brand-title {
  transform: scale(1.15);
  transform-origin: center center;
}

body.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo .brand-title-text {
  transform: none;
  transform-origin: center center;
}

/* Media catalog: no logo scale so the mark stays inside the clipped header and does not read as “sticky” over the rail */
body.h0-media-catalog.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo img.logo-abbr,
body.h0-media-catalog.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo img.logo-compact,
body.h0-media-catalog.product-sidebar-compact[data-layout="vertical"] .nav-header .brand-logo img.brand-title {
  transform: none;
}

/* Theme #main-wrapper { overflow: hidden } can make chrome feel pinned; catalog uses normal document scroll */
body.h0-media-catalog #main-wrapper {
  overflow: visible !important;
}

/* Theme .content-body .container-fluid uses wide side padding; catalog main column should use full width */
body.h0-media-catalog .content-body.product-app > .container-fluid {
  max-width: none !important;
  width: 100% !important;
  padding-left: max(0.75rem, env(safe-area-inset-left, 0px)) !important;
  padding-right: max(0.75rem, env(safe-area-inset-right, 0px)) !important;
  /* Match horizontal inset: space below header strip ≈ space from rail to cards */
  padding-top: max(0.75rem, env(safe-area-inset-top, 0px)) !important;
}

/* Media catalog: avoid inner scroll clipping that can make chrome feel “stuck” */
body.h0-media-catalog.product-sidebar-compact .content-body.product-app {
  overflow: visible !important;
  isolation: isolate;
}

/*
 * Theme ties [data-sidebar-position="fixed"] to position:fixed on .nav-header (logo strip).
 * Product coach/player/assessment layouts use their own rail; nav-header must scroll with #main-wrapper.
 */
body.product-sidebar-compact[data-layout="vertical"] .nav-header {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  min-height: var(--product-chrome-row1-h, 2.75rem);
}

body.product-sidebar-compact[data-layout="vertical"] .product-chrome-r1 .nav-header {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  min-height: 0;
  width: auto;
}

body.product-sidebar-compact[data-layout="vertical"] .nav-control {
  z-index: 10050;
  background: transparent !important;
  box-shadow: none !important;
}

/* Row 1: wordmark left; profile top-right of wrap (header must stay position:static so absolute anchors to wrap). */
body.product-sidebar-compact {
  --product-chrome-v-gap: 0;
  --product-chrome-row-pull: 0.22rem;
}

body.product-sidebar-compact .product-chrome-wrap {
  position: relative;
  z-index: 120;
  width: 100%;
  padding-top: 0;
  margin-top: -0.39rem;
}

/*
 * Modals must stack above product chrome (z-index ~120), sidebar rail (~1040),
 * and vertical-layout .nav-control (~10050); Bootstrap defaults (~1055) lose.
 */
body.product-sidebar-compact .modal-backdrop {
  z-index: 10060 !important;
}
body.product-sidebar-compact .modal {
  z-index: 10070 !important;
}

/* Sponsor stamp: PNGs are white-on-black plates — use luminance mask (not alpha/img). */
body.product-sidebar-compact.product-has-sponsor-wm .h0ckey-sponsor-wm-stamp {
  position: fixed;
  bottom: max(0.65rem, env(safe-area-inset-bottom, 0px));
  --wm-h: min(9.25rem, 24vw);
  width: min(20rem, 52vw);
  height: var(--wm-h);
  max-height: 28vh;
  pointer-events: none;
  z-index: 0;
  background-color: rgba(255, 255, 255, 0.88);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: left bottom;
  mask-position: left bottom;
  -webkit-mask-mode: luminance;
  mask-mode: luminance;
  transform: rotate(-9deg) translate(calc(0.5 * var(--wm-h)), calc(-0.5 * var(--wm-h)));
  filter: drop-shadow(0 0.12rem 0.35rem rgba(0, 0, 0, 0.45));
}
body.product-sidebar-compact.product-has-sponsor-wm .h0ckey-sponsor-wm-stamp--linked {
  pointer-events: auto;
  cursor: pointer;
}
body.product-sidebar-compact.product-has-sponsor-wm #main-wrapper:not(.menu-toggle) .h0ckey-sponsor-wm-stamp {
  left: calc(4.5rem + max(0.45rem, env(safe-area-inset-left, 0px)));
}
body.product-sidebar-compact.product-has-sponsor-wm #main-wrapper.menu-toggle .h0ckey-sponsor-wm-stamp {
  left: max(0.65rem, env(safe-area-inset-left, 0px));
}
@media (max-width: 767.98px) {
  body.product-sidebar-compact.product-has-sponsor-wm .h0ckey-sponsor-wm-stamp {
    --wm-h: min(7.75rem, 34vw);
    left: max(0.65rem, env(safe-area-inset-left, 0px)) !important;
    width: min(17rem, 72vw);
    height: var(--wm-h);
    max-height: 26vh;
    background-color: rgba(255, 255, 255, 0.85);
    filter: drop-shadow(0 0.1rem 0.28rem rgba(0, 0, 0, 0.42));
  }
}
html[data-theme-version="dark"] body.product-sidebar-compact.product-has-sponsor-wm .h0ckey-sponsor-wm-stamp,
body[data-theme-version="dark"].product-sidebar-compact.product-has-sponsor-wm .h0ckey-sponsor-wm-stamp {
  background-color: rgba(255, 255, 255, 0.82);
  filter: drop-shadow(0 0.08rem 0.32rem rgba(0, 0, 0, 0.65));
}
body.product-sidebar-compact .content-body.product-app > .container-fluid,
body.product-sidebar-compact .content-body.product-app > .container-lg {
  position: relative;
  z-index: 1;
}

/* Product chrome: row1 = logo | topbar menu | profile; row2 = hamburger + breadcrumb | assessment icons | (spacer). */
body.product-sidebar-compact .product-chrome-grid {
  display: grid;
  grid-template-rows: auto auto;
  row-gap: var(--product-chrome-v-gap);
  padding-left: max(0.35rem, env(safe-area-inset-left, 0px));
  padding-right: max(0.35rem, env(safe-area-inset-right, 0px));
  padding-top: max(0px, calc(env(safe-area-inset-top, 0px) - 0.68rem));
  box-sizing: border-box;
}

body.product-sidebar-compact .product-chrome-r1 {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 0.5rem;
  min-height: 2.65rem;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: calc(-0.5 * var(--product-chrome-row-pull));
}

body.product-sidebar-compact .product-chrome-r1 .nav-header {
  grid-column: 1;
  justify-self: start;
  align-self: center;
}

body.product-sidebar-compact .product-chrome-r1 .product-chrome-toolbar-slot {
  grid-column: 2;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.product-sidebar-compact .product-chrome-r1 .product-chrome-profile-slot {
  grid-column: 3;
  justify-self: end;
  align-self: center;
  z-index: 2;
}

body.product-sidebar-compact .product-chrome-r2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  column-gap: 0.45rem;
  min-height: 2.35rem;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: calc(-0.5 * var(--product-chrome-row-pull));
}

body.product-sidebar-compact .product-chrome-breadcrumb-slot {
  grid-column: 1;
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

body.product-sidebar-compact .product-chrome-breadcrumb-slot .product-nav-breadcrumb--chrome {
  color: #94a3b8 !important;
}

[data-theme-version="dark"] body.product-sidebar-compact .product-chrome-breadcrumb-slot .product-nav-breadcrumb--chrome {
  color: #cbd5e1 !important;
}

body.product-sidebar-compact .product-chrome-assess-entry-slot {
  grid-column: 2;
  justify-self: center;
  width: max-content;
  max-width: min(100%, calc(100vw - 10rem));
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 5;
}

body.product-sidebar-compact .product-chrome-assess-entry-slot .assessment-entry-strip__list--header-rail {
  pointer-events: auto;
}

body.product-sidebar-compact .product-chrome-assess-entry-slot.product-chrome-assess-entry-slot--empty {
  display: none !important;
}

body.product-sidebar-compact .product-chrome-r2-trailing {
  grid-column: 3;
  min-width: 0;
  pointer-events: none;
}

body.product-sidebar-compact .nav-header.nav-header--product-stacked {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
}

/* Sidebar toggle + breadcrumb: align with inner left edge of product .container-fluid (rail + gutter). */
body.product-sidebar-compact #main-wrapper:not(.menu-toggle) .product-chrome-breadcrumb-slot {
  margin-left: max(0px, calc(4.5rem + 0.5rem - max(0.35rem, env(safe-area-inset-left, 0px))));
}

body.product-sidebar-compact #main-wrapper.menu-toggle .product-chrome-breadcrumb-slot {
  margin-left: max(0px, calc(0.5rem - max(0.35rem, env(safe-area-inset-left, 0px))));
}

body.product-sidebar-compact .product-chrome-toolbar-slot .product-chrome-inline-navbar {
  width: 100%;
  min-width: 0;
}

body.product-sidebar-compact .product-chrome-toolbar-slot .product-chrome-toolbar-ul {
  flex-wrap: nowrap !important;
  justify-content: center !important;
  gap: 0.15rem !important;
}

body.product-sidebar-compact .product-chrome-profile-slot .header-profile {
  margin: 0;
}

body.product-sidebar-compact .product-chrome-profile-slot .header-profile > .nav-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.25rem 0.2rem;
}

body.product-sidebar-compact .product-chrome-profile-slot .header-profile .header-info {
  display: none !important;
}

body.product-sidebar-compact .product-chrome-profile-slot .header-profile img.rounded-circle {
  width: 2.25rem !important;
  height: 2.25rem !important;
  max-height: 2.75rem;
}

body.product-sidebar-compact .product-chrome-wrap > .header {
  position: static !important;
  overflow: visible !important;
  height: auto !important;
  min-height: 3.25rem;
}

body.product-sidebar-compact .product-chrome-wrap > .header.header--product-chrome-toolbar-external {
  min-height: 0 !important;
  height: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.product-sidebar-compact .product-chrome-wrap > .header.header--product-chrome-toolbar-external .header-content {
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
}

body.product-sidebar-compact .product-chrome-wrap > .header .header-content,
body.product-sidebar-compact .product-chrome-wrap > .header .navbar,
body.product-sidebar-compact .product-chrome-wrap > .header .navbar-collapse {
  height: auto !important;
  min-height: 0 !important;
}

body.product-sidebar-compact .product-chrome-toolbar-slot .navbar,
body.product-sidebar-compact .product-chrome-toolbar-slot .navbar-collapse {
  height: auto !important;
  min-height: 0 !important;
}

body.product-sidebar-compact .product-navbar-collapse {
  width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  /* Tighten space after the menu icon so the toolbar doesn’t sit visually too far right */
  gap: 0.2rem 0.35rem !important;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

body.product-sidebar-compact .product-navbar-collapse .header-left {
  flex: 1 1 auto;
  min-width: 0;
  order: 2;
  align-self: center;
}

body.product-sidebar-compact .product-navbar-collapse .header-right {
  flex: 0 0 auto;
  margin-left: auto !important;
  order: 3;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  align-self: center;
}

/* Product toolbar (row 1 center): icons in one horizontal strip — tablet/desktop. */
@media (min-width: 768px) {
  body.product-sidebar-compact .product-chrome-toolbar-slot .product-navbar-collapse--row1 {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    overflow-x: auto;
    gap: 0.15rem !important;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  body.product-sidebar-compact .product-chrome-toolbar-slot .product-navbar-collapse .header-right {
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
  }

  body.product-sidebar-compact .product-chrome-toolbar-slot .product-chrome-toolbar-col--search {
    display: none !important;
  }

  body.product-sidebar-compact .product-chrome-toolbar-slot .product-chrome-toolbar-filler {
    pointer-events: none;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    min-height: 0;
  }
}

@media (max-width: 767.98px) {
  body.product-sidebar-compact .product-chrome-wrap > .header .header-content {
    padding-left: max(0.35rem, env(safe-area-inset-left, 0px)) !important;
    /* Keep clear of scrollbar without pushing toolbar over the icon rail / menu */
    padding-right: max(0.45rem, calc(0.35rem + 8px + env(safe-area-inset-right, 0px))) !important;
  }

  body.product-sidebar-compact .product-chrome-toolbar-slot {
    padding-left: max(0.15rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.15rem, env(safe-area-inset-right, 0px));
  }

  body.product-sidebar-compact .product-navbar-collapse.product-navbar-collapse {
    margin-left: 0 !important;
    padding-left: 0 !important;
    width: 100% !important;
  }

  body.product-sidebar-compact .product-chrome-breadcrumb-slot .product-header-nav-control {
    margin-left: 0 !important;
    flex-shrink: 0;
  }

  body.product-sidebar-compact .product-navbar-collapse .header-left {
    flex-shrink: 1;
  }

  body.product-sidebar-compact .product-navbar-collapse .header-right {
    flex: 0 0 auto;
    flex-shrink: 0;
    margin-left: auto !important;
    justify-content: flex-end;
    order: 3;
    gap: 0.12rem;
  }

  body.product-sidebar-compact .product-chrome-toolbar-slot .header-right .nav-link.header-toolbar-icon-link {
    width: 2rem;
    min-width: 2rem;
    height: 2rem;
  }

  /* New / Find / Review: no pill outline on narrow viewports (row chrome stays frosted). */
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary,
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary {
    border: none !important;
    border-width: 0 !important;
  }

  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary:hover,
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-primary:focus,
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary:hover,
  body.product-sidebar-compact .content-body.product-app .coach-dashboard-nav-cards-row .coach-dashboard-nav-cell .btn-outline-secondary:focus {
    border: none !important;
    border-width: 0 !important;
  }
}

body.product-sidebar-compact .header .product-header-nav-control,
body.product-sidebar-compact .product-chrome-breadcrumb-slot .product-header-nav-control {
  position: relative !important;
  right: auto !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  flex: 0 0 auto;
  order: 1;
  align-self: center;
  flex-shrink: 0;
  margin: 0 !important;
  margin-right: 0.05rem !important;
  padding: 0 !important;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  min-height: 2rem;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

/* Single chrome row: logo + menu under logo | toolbar | profile — align icon rail below it. */
body.product-sidebar-compact[data-layout="vertical"] {
  --product-shell-rail-top: 5.9rem;
  --product-chrome-row1-h: 2.65rem;
}

/* Comms Chat: inbox column + reading pane (split from md up); stacked on small screens */
body.product-sidebar-compact .messages-chat-stack {
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

@media (min-width: 768px) {
  body.product-sidebar-compact .messages-chat-stack {
    flex-direction: row;
    align-items: stretch;
    flex: 1 1 auto;
    min-height: 0;
  }
  body.product-sidebar-compact .messages-chat-list-pane {
    flex: 0 0 38%;
    max-width: 44%;
    border-right: 1px solid #e2e8f0;
  }
  body.product-sidebar-compact .messages-chat-thread-toolbar .messages-chat-back {
    display: none !important;
  }
}

@media (max-width: 767.98px) {
  body.product-sidebar-compact .messages-chat-thread-pane:not(.messages-chat-thread-pane--open) {
    display: none !important;
  }
  body.product-sidebar-compact .messages-chat-thread-pane.messages-chat-thread-pane--open {
    display: flex !important;
    flex-direction: column;
  }
}

@media (min-width: 768px) {
  body.product-sidebar-compact .messages-chat-thread-pane {
    display: flex !important;
    flex-direction: column;
    min-width: 0;
  }
}

/* Comms Notes: list + editor (same split idea as Chat) */
body.product-sidebar-compact .messages-comms-notes-stack {
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

@media (min-width: 768px) {
  body.product-sidebar-compact .messages-comms-notes-stack {
    flex-direction: row;
    align-items: stretch;
    flex: 1 1 auto;
    min-height: 0;
  }
  body.product-sidebar-compact .messages-comms-notes-list {
    flex: 0 0 38%;
    max-width: 44%;
  }
}

body.product-sidebar-compact .messages-comms-notes-editor {
  background: #fff;
}

body.product-sidebar-compact .messages-comms-note-textarea {
  color: #334155 !important;
}

/* Mail list / reading mid-gray for incoming bubbles (see mail-center .mail-list-sub / body tone) */
body.product-sidebar-compact .messages-chat-bubble--other .messages-chat-reading {
  color: #475569 !important;
}
body.product-sidebar-compact .messages-chat-bubble--other .messages-chat-meta {
  color: #64748b !important;
}
body.product-sidebar-compact .messages-chat-bubble--self .messages-chat-reading {
  color: rgba(255, 255, 255, 0.95);
}

/* Full-page Comms thread (same reading tone when product-mobile is loaded) */
.content-body.product-app .messages-chat-bubble--other .messages-chat-reading {
  color: #475569 !important;
}
.content-body.product-app .messages-chat-bubble--other .messages-chat-meta {
  color: #64748b !important;
}

body.product-sidebar-compact .messages-chat-thread-item.active {
  background-color: rgba(13, 110, 253, 0.12);
  border-left: 3px solid #0d6efd;
  padding-left: calc(0.75rem - 3px);
  color: #0f172a !important;
}
body.product-sidebar-compact .messages-chat-thread-item.active .fw-semibold,
body.product-sidebar-compact .messages-chat-thread-item.active .text-truncate {
  color: #0f172a !important;
}
body.product-sidebar-compact .messages-chat-thread-item.active .text-muted,
body.product-sidebar-compact .messages-chat-thread-item.active .small.text-muted {
  color: #475569 !important;
}

/* New message modal: align right edge to viewport; suggest dropdown under search */
body.product-sidebar-compact .messages-new-modal .modal-dialog.messages-new-modal__dialog {
  max-width: min(96vw, 52rem);
  width: auto;
  margin-left: auto;
  margin-right: max(0rem, env(safe-area-inset-right, 0px));
}
body.product-sidebar-compact .messages-new-modal .messages-new-modal__layout {
  min-height: min(70vh, 32rem);
}
body.product-sidebar-compact .messages-new-modal__addressbook {
  max-height: min(70vh, 32rem);
}
body.product-sidebar-compact .messages-address-book-caret {
  color: #0b2a97;
  letter-spacing: 0.08em;
}
body.product-sidebar-compact .messages-address-book-search-wrap .messages-address-book-suggest {
  position: absolute;
  left: 0.5rem;
  right: 0.5rem;
  top: calc(100% + 2px);
  z-index: 25;
  max-height: calc(2.75rem * 5);
  overflow-y: auto;
  background: #fff;
}

/* Chat text inputs: dark gray text */
body.product-sidebar-compact textarea.messages-chat-input,
body.product-sidebar-compact .messages-chat-input.form-control,
.content-body.product-app textarea.messages-chat-input {
  color: #334155 !important;
}
body.product-sidebar-compact textarea.messages-chat-input::placeholder,
.content-body.product-app textarea.messages-chat-input::placeholder {
  color: #94a3b8;
  opacity: 1;
}

/* Send: green hover / press feedback */
body.product-sidebar-compact .btn-primary.messages-send-btn {
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.08s ease;
}
body.product-sidebar-compact .btn-primary.messages-send-btn:hover {
  background-color: #198754 !important;
  border-color: #157347 !important;
  color: #fff !important;
}
body.product-sidebar-compact .btn-primary.messages-send-btn:active {
  background-color: #146c43 !important;
  border-color: #13653f !important;
  transform: scale(0.98);
}

.content-body.product-app .btn-primary.messages-send-btn {
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.08s ease;
}
.content-body.product-app .btn-primary.messages-send-btn:hover {
  background-color: #198754 !important;
  border-color: #157347 !important;
  color: #fff !important;
}
.content-body.product-app .btn-primary.messages-send-btn:active {
  background-color: #146c43 !important;
  transform: scale(0.98);
}

/* Fill viewport column without forcing a tall min-height (was pushing tab content downward) */
body.product-sidebar-compact #headerMessagesOffcanvas .offcanvas-body.app-right-popout__body--comms {
  min-height: 0 !important;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Thread bubbles: align to top of scroll area (no extra top gap) */
body.product-sidebar-compact #headerMessagesOffcanvas .messages-panel-bubbles {
  padding-top: 0 !important;
}
body.product-sidebar-compact #headerMessagesOffcanvas .messages-panel-thread-inner {
  align-items: stretch;
}

/* Comms offcanvas: fill viewport height so Chat / Notes / Alerts panes align to the top (not vertically centered). */
body.product-sidebar-compact #headerMessagesOffcanvas.offcanvas {
  display: flex !important;
  flex-direction: column !important;
  height: 100%;
  max-height: 100vh;
}
body.product-sidebar-compact #headerMessagesOffcanvas .offcanvas-body.app-right-popout__body--comms {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
body.product-sidebar-compact #headerMessagesOffcanvas #messages-pane-notes,
body.product-sidebar-compact #headerMessagesOffcanvas #messages-pane-alerts,
body.product-sidebar-compact #headerMessagesOffcanvas #messages-pane-chat {
  justify-content: flex-start !important;
  align-content: flex-start !important;
  align-items: stretch !important;
}
body.product-sidebar-compact #headerMessagesOffcanvas #messages-pane-alerts > ul {
  flex: 0 1 auto !important;
}

body.product-sidebar-compact #headerMessagesOffcanvas .tab-content {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* Tab panes use d-flex — utility !important overrides Bootstrap’s display:none on inactive panes,
 * so all three panes were sharing height (Notes list clipped, Chat pushed down). Force hide. */
body.product-sidebar-compact #headerMessagesOffcanvas .tab-content > .tab-pane:not(.show) {
  display: none !important;
}
body.product-sidebar-compact #headerMessagesOffcanvas .tab-content > .tab-pane.show {
  display: flex !important;
  flex-direction: column !important;
}

body.product-sidebar-compact #headerMessagesOffcanvas .tab-content > .tab-pane {
  flex: 1 1 auto;
  min-height: 0 !important;
  justify-content: flex-start !important;
}

body.product-sidebar-compact #headerMessagesOffcanvas .messages-comms-notes-stack,
body.product-sidebar-compact #headerMessagesOffcanvas .messages-comms-notes-list,
body.product-sidebar-compact #headerMessagesOffcanvas .messages-chat-list-pane,
body.product-sidebar-compact #headerMessagesOffcanvas .messages-chat-stack {
  min-height: 0 !important;
}

/* Comms header: New button hover / active */
body.product-sidebar-compact .messages-comms-new-btn.btn-light:hover {
  background-color: #198754 !important;
  border-color: #198754 !important;
  color: #fff !important;
}
body.product-sidebar-compact .messages-comms-new-btn.btn-light:active {
  background-color: #146c43 !important;
  transform: scale(0.98);
}
body.product-sidebar-compact .messages-comms-new-btn.btn-outline-light:hover {
  background-color: rgba(255, 255, 255, 0.95) !important;
  color: #198754 !important;
  border-color: rgba(255, 255, 255, 0.95) !important;
}

/* Comms nav icon: numeric badge (threads where last message is from someone else) */
body.product-sidebar-compact .header-messages-trigger .comms-nav-badge {
  position: absolute;
  top: -4px;
  right: -6px;
  min-width: 1.125rem;
  min-height: 1.125rem;
  padding: 0 4px;
  font-size: 0.65rem;
  line-height: 1.125rem;
  text-align: center;
  border-radius: 999px;
  background: #ffc107;
  color: #0f172a;
  font-weight: 700;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.15);
}

/* Widen Comms offcanvas (~90% of viewport minus icon sidebar rail) */
body.product-sidebar-compact .messages-panel-offcanvas.offcanvas-end.messages-panel-offcanvas--expanded {
  width: calc((100vw - 5.5rem) * 0.9) !important;
  max-width: none !important;
}
@media (max-width: 991.98px) {
  body.product-sidebar-compact .messages-panel-offcanvas.offcanvas-end.messages-panel-offcanvas--expanded {
    width: min(94vw, calc((100vw - 1rem) * 0.9)) !important;
  }
}

/* Expand control in Comms offcanvas header (chevron before title) */
body.product-sidebar-compact .messages-panel-expand-toggle--header {
  position: relative;
  width: 1.75rem;
  height: 1.75rem;
  min-height: 0;
  padding: 0;
  border: none;
  border-radius: 0.35rem;
  background: transparent;
  color: rgba(255, 255, 255, 0.92);
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  flex-shrink: 0;
  transition: background 0.15s ease, color 0.15s ease;
}
body.product-sidebar-compact .messages-panel-expand-toggle--header:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}
body.product-sidebar-compact .messages-panel-expand-toggle--header:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.85);
  outline-offset: 2px;
}

/* Timeline date filter (header strip) */
body.product-sidebar-compact .timeline-date-filter-input {
  max-width: 11rem;
  color: #334155 !important;
  background: #fff;
}

/*
 * Right popout (app-right-popout) — chrome borrowed from theme .chatbox (main.css ~13762–13811):
 * panel shadow, #0B2A97 header/tab strip, white uppercase tabs, dark body variant.
 */
/* Comms offcanvas must stay fixed to the right; never in document flow when open/closed */
body.product-sidebar-compact #headerMessagesOffcanvas.offcanvas {
  position: fixed !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto !important;
  z-index: 1045;
}

/* ~30% viewport on desktop (capped), full-width-friendly on small screens */
body.product-sidebar-compact .app-right-popout.offcanvas-end {
  width: min(100vw - 1rem, 28rem) !important;
  max-width: 100%;
  border: none !important;
  box-shadow: 0 0 30px 0 rgba(82, 63, 105, 0.15);
}

@media (min-width: 992px) {
  body.product-sidebar-compact .app-right-popout.offcanvas-end {
    width: min(100vw - 2rem, 30vw, 36rem) !important;
  }
}

body.product-sidebar-compact .app-right-popout .offcanvas-body {
  background: #fff;
}

/* Single content canvas under tabs (meets active tab “sheet”) */
body.product-sidebar-compact #headerMessagesOffcanvas .tab-content {
  background: #fff;
}

body.product-sidebar-compact #headerMessagesOffcanvas .dropdown-menu {
  z-index: 1080;
}

/* Message bubble star colors (Comms + full-page chat) */
.messages-star-c1 {
  color: #eab308 !important;
}
.messages-star-c2 {
  color: #f97316 !important;
}
.messages-star-c3 {
  color: #ef4444 !important;
}
.messages-star-c4 {
  color: #3b82f6 !important;
}
.messages-star-c5 {
  color: #a855f7 !important;
}
.messages-msg-star.messages-star-c1 {
  color: #ca8a04 !important;
}
.messages-msg-star.messages-star-c2 {
  color: #ea580c !important;
}
.messages-msg-star.messages-star-c3 {
  color: #dc2626 !important;
}
.messages-msg-star.messages-star-c4 {
  color: #2563eb !important;
}
.messages-msg-star.messages-star-c5 {
  color: #9333ea !important;
}

.content-body.product-app .messages-chat-actions-root .dropdown-menu {
  z-index: 1060;
}

/* Chevron + menu: top-right inside bubble; white chevron layer 25% larger behind green + white stroke */
.messages-msg-toolbar-dropdown.messages-bubble-corner-dropdown {
  position: absolute;
  top: 0.2rem;
  right: 0.25rem;
  z-index: 3;
}
.messages-chat-bubble--has-menu {
  padding-right: 2rem !important;
  overflow: visible;
}
.messages-bubble-chevron-btn {
  border: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  line-height: 1;
  min-width: 1.35rem;
  min-height: 1.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.messages-bubble-chevron-btn:focus,
.messages-bubble-chevron-btn:active {
  border: none !important;
  box-shadow: none !important;
}
.messages-bubble-chevron-stack {
  position: relative;
  display: block;
  width: 1em;
  height: 1em;
  font-size: 0.95rem;
}
.messages-bubble-chevron-bg {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(1.25);
  font-size: 1em;
  color: #fff;
  z-index: 0;
  line-height: 1;
}
.messages-bubble-chevron-fg {
  position: relative;
  z-index: 1;
  font-size: 1em;
  font-weight: 900;
  color: #00e676;
  line-height: 1;
  -webkit-text-stroke: 1.5px #fff;
  paint-order: stroke fill;
}
.messages-chat-bubble--self .messages-bubble-chevron-bg {
  color: rgba(255, 255, 255, 0.35);
}
.messages-chat-bubble--self .messages-bubble-chevron-fg {
  -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.95);
  color: #b9f6ca;
}
/* Thin column: ~reply icon (1.5rem) + 5px — flyouts open to the left so grids fit */
.messages-bubble-actions-menu.messages-bubble-actions-menu--toolbar.dropdown-menu {
  min-width: calc(1.5rem + 5px) !important;
  max-width: calc(1.5rem + 8px);
  padding: 0.2rem 0.15rem !important;
  overflow: visible !important;
}
.messages-bubble-actions-menu--toolbar > li {
  padding-left: 0.15rem !important;
  padding-right: 0.15rem !important;
  overflow: visible !important;
}
/* Hover bridge: pointer path from primary to left-docked flyout (avoids losing :hover in the gap) */
.messages-bubble-actions-menu--toolbar .messages-menu-emoji-wrap,
.messages-bubble-actions-menu--toolbar .messages-menu-star-wrap {
  position: relative;
  overflow: visible !important;
}
.messages-bubble-actions-menu--toolbar .messages-menu-emoji-wrap::after,
.messages-bubble-actions-menu--toolbar .messages-menu-star-wrap::after {
  content: "";
  position: absolute;
  right: 100%;
  top: 0;
  width: 12px;
  height: 100%;
  min-height: 2.25rem;
  z-index: 1088;
}
.messages-bubble-actions-menu--toolbar .messages-bubble-action-icon {
  font-size: 1.5rem;
  line-height: 1;
  padding-left: 0.15rem !important;
  padding-right: 0.15rem !important;
}
.messages-bubble-actions-menu--toolbar .messages-bubble-action-icon i {
  font-size: 1em;
}
/* Lighter surfaces (~half again vs prior): subtle “thin menu” */
.messages-bubble-actions-menu--toolbar .messages-menu-emoji-primary,
.messages-bubble-actions-menu--toolbar .messages-menu-star-primary {
  min-height: 2.25rem !important;
  padding: 0.1rem 0.15rem !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
  background-color: rgba(248, 249, 250, 0.14) !important;
  border-color: rgba(0, 0, 0, 0.04) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.messages-bubble-actions-menu--toolbar .messages-menu-star-primary i {
  font-size: 1.25rem;
  line-height: 1;
  display: block;
}
.messages-bubble-actions-menu--toolbar .dropdown-item.messages-bubble-action-icon {
  background-color: rgba(248, 249, 250, 0.14) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  border-radius: 0.25rem;
}
.messages-bubble-actions-menu--toolbar .dropdown-item.messages-bubble-action-icon:hover,
.messages-bubble-actions-menu--toolbar .dropdown-item.messages-bubble-action-icon:focus {
  background-color: rgba(13, 110, 253, 0.06) !important;
}
.messages-menu-emoji-flyout.messages-menu-emoji-grid,
.messages-menu-star-flyout.messages-menu-star-grid {
  display: none !important;
  z-index: 1090;
  position: absolute;
  left: auto;
  right: calc(100% + 4px);
  top: 0;
  width: auto;
  min-width: 6.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.3rem;
  padding: 0.4rem !important;
  box-shadow: 0 0.25rem 0.75rem rgba(15, 23, 42, 0.12);
  justify-items: center;
  align-items: center;
}
.messages-bubble-emoji-pick {
  font-size: 1.35rem !important;
  line-height: 1 !important;
  border: none;
  background: rgba(248, 249, 250, 0.18);
  border-radius: 0.3rem;
  padding: 0.25rem 0.15rem;
  cursor: pointer;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
  min-height: 2rem;
  box-sizing: border-box;
}
.messages-bubble-emoji-pick:hover {
  background: rgba(13, 110, 253, 0.08);
}
.messages-bubble-star-pick {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.2rem;
  border: none;
  background: rgba(248, 249, 250, 0.18);
  border-radius: 0.3rem;
  padding: 0.28rem;
  cursor: pointer;
  width: 100%;
  min-height: 2rem;
  box-sizing: border-box;
}
.messages-bubble-star-pick:hover {
  background: rgba(13, 110, 253, 0.06);
}
.messages-bubble-star-pick--clear {
  font-size: 0.8rem !important;
  font-weight: 600;
}
.messages-menu-emoji-wrap:hover .messages-menu-emoji-flyout.messages-menu-emoji-grid,
.messages-menu-emoji-wrap.messages-flyout-open .messages-menu-emoji-flyout.messages-menu-emoji-grid,
.messages-menu-star-wrap:hover .messages-menu-star-flyout.messages-menu-star-grid,
.messages-menu-star-wrap.messages-flyout-open .messages-menu-star-flyout.messages-menu-star-grid {
  display: grid !important;
}

/* Pinned message jump banner (below thread toolbar, above bubbles) */
.messages-thread-pinned-banner {
  background: linear-gradient(90deg, rgba(255, 193, 7, 0.22), rgba(255, 193, 7, 0.06));
  border-color: rgba(245, 158, 11, 0.35) !important;
  cursor: pointer;
}
.messages-thread-pinned-banner:hover {
  background: linear-gradient(90deg, rgba(255, 193, 7, 0.32), rgba(255, 193, 7, 0.12));
}
.messages-thread-pinned-banner__excerpt {
  color: #475569 !important;
}
.messages-msg-row[id^="comms-msg-"] {
  scroll-margin-top: 0.75rem;
}

/* Compose: large default emoji left; hover opens grid (match bubble menu flyouts) */
.messages-compose-emoji-wrap {
  align-self: stretch;
}
.messages-compose-emoji-primary {
  font-size: 1.5rem !important;
  line-height: 1 !important;
  min-width: 2.5rem;
  min-height: 2.5rem;
  padding: 0.25rem 0.35rem !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
.messages-compose-emoji-primary:hover {
  background: rgba(13, 110, 253, 0.08) !important;
}
.messages-compose-emoji-flyout {
  display: none !important;
  position: absolute;
  left: 0;
  bottom: calc(100% - 6px);
  margin-bottom: 0;
  z-index: 1090;
  min-width: 8rem;
  max-width: 12rem;
}
.messages-compose-emoji-wrap:hover .messages-compose-emoji-flyout,
.messages-compose-emoji-wrap.messages-flyout-open .messages-compose-emoji-flyout {
  display: flex !important;
  flex-wrap: wrap;
}
.messages-compose-emoji-flyout .messages-compose-emoji-pick {
  font-size: 1.25rem !important;
  line-height: 1 !important;
}
.messages-msg-cluster .messages-chat-bubble {
  word-break: break-word;
}

body.product-sidebar-compact [data-theme-version="dark"] .app-right-popout.offcanvas {
  background: #1e2746;
}

body.product-sidebar-compact [data-theme-version="dark"] .app-right-popout .offcanvas-body {
  background: #1e2746;
  color: #e8eaed;
}

body.product-sidebar-compact [data-theme-version="dark"] #headerMessagesOffcanvas .tab-content {
  background: #1e2746;
}

body.product-sidebar-compact .app-right-popout__top {
  background: #0b2a97 !important;
  border: none !important;
  color: #fff;
}

/*
 * Inbox header: one full-width row (app-right-popout__tabstrip) with three divs (app-right-popout__tabhead).
 * No Bootstrap .nav / .nav-item — those force equal-width “columns”. Cells are width: auto only.
 */
body.product-sidebar-compact .app-right-popout .app-right-popout__tabstrip {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 0.5rem;
  width: 100%;
  box-sizing: border-box;
  background: #0b2a97;
  padding: 0.5rem 0.85rem 0;
  margin: 0;
}

body.product-sidebar-compact .app-right-popout .app-right-popout__tabhead {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  min-width: 0;
}

body.product-sidebar-compact .app-right-popout .app-right-popout__tab {
  display: block;
  width: auto;
  max-width: 100%;
  margin: 0;
  padding: 0.45rem 0.4rem 0.5rem;
  border: none;
  border-radius: 0;
  border-bottom: 2px solid transparent;
  background: transparent !important;
  color: #fff !important;
  opacity: 0.82;
  text-transform: uppercase;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none !important;
}

body.product-sidebar-compact .app-right-popout .app-right-popout__tab:hover {
  opacity: 1;
  color: #fff !important;
}

/* Selected tab: no white “pill”; larger type (+50%) + underline (not “tab chrome”) */
body.product-sidebar-compact .app-right-popout .app-right-popout__tab.active {
  opacity: 1;
  color: #fff !important;
  background: transparent !important;
  font-size: calc(0.8125rem * 1.5);
  border-bottom-color: rgba(255, 255, 255, 0.95);
  padding-bottom: 0.35rem;
  margin-bottom: -2px;
  position: relative;
  z-index: 1;
}

body.product-sidebar-compact .app-right-popout .app-right-popout__tab:focus-visible {
  outline: none;
  color: #fff !important;
  font-size: calc(0.8125rem * 1.5);
  border-bottom-color: #fff;
  opacity: 1;
}

body.product-sidebar-compact .app-right-popout .app-right-popout__subtitle {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.8125rem;
  line-height: 1.3;
}

body.product-sidebar-compact [data-theme-version="dark"] .app-right-popout--timeline .timeline-panel h6 {
  color: #f1f3f5 !important;
}

body.product-sidebar-compact [data-theme-version="dark"] .app-right-popout--timeline .timeline-panel {
  color: rgba(255, 255, 255, 0.75) !important;
}

/* Header right: theme, notifications, timeline, comms — white icons on transparent top bar */
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link {
  width: 2.5rem;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 !important;
  border-radius: 0.4rem;
  background: rgba(255, 255, 255, 0.12);
  color: #fff !important;
  transition: background 0.15s ease, color 0.15s ease;
  overflow: visible;
}
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link:hover {
  background: rgba(255, 255, 255, 0.22);
  color: #fff !important;
}
body.product-sidebar-compact[data-theme-version="dark"] .header-right .nav-link.header-toolbar-icon-link {
  background: rgba(255, 255, 255, 0.12);
  color: #fff !important;
}
body.product-sidebar-compact[data-theme-version="dark"] .header-right .nav-link.header-toolbar-icon-link:hover {
  background: rgba(255, 255, 255, 0.22);
  color: #fff !important;
}
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link .header-toolbar-fa,
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link i {
  font-size: 1.125rem;
  line-height: 1;
  color: #fff !important;
}
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link .header-toolbar-svg {
  display: block;
  color: #fff !important;
}
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link .header-toolbar-img {
  width: 1.25rem;
  height: 1.25rem;
  min-width: 1.25rem;
  min-height: 1.25rem;
  object-fit: contain;
  object-position: center;
  display: block;
  flex-shrink: 0;
  overflow: visible;
  filter: brightness(0) invert(1);
}
/* Help uses same tile; override earlier larger help-only sizing */
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link.header-help-link {
  min-width: 2.5rem !important;
  min-height: 2.5rem !important;
  color: #fff !important;
}
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon-link .header-help-icon {
  font-size: 1.125rem !important;
  color: #fff !important;
}

/* Bell ring: only on .header-toolbar-icon--alert-ring; theme toggle must never shake */
body.product-sidebar-compact .header-right .nav-link.dz-theme-mode .header-toolbar-img {
  animation: none !important;
  -webkit-animation: none !important;
}
body.product-sidebar-compact .header-right .nav-link.header-toolbar-icon--alert-ring .header-toolbar-img {
  transform-origin: 50% 4px;
}

/*
 * Theme demo chat panel (.chatbox in chatbox.html) — same Notes/Alerts/Chat as old template.
 * custom.js binds .bell-link to .chatbox.active; messages icon no longer uses bell-link.
 * Hide the legacy panel on product layouts so it never stacks behind the real offcanvas.
 */
body.product-sidebar-compact .chatbox {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/*
 * FullCalendar coach/player dashboard embed (#dashboard-calendar).
 * Placed at END of this file so it wins over style.css + product-layout.
 * Scoped with body + .content-body.product-app so theme .fc rules cannot override.
 */
body.product-sidebar-compact .content-body.product-app #dashboard-calendar-wrap {
  margin-top: 0;
}

@media (min-width: 768px) {
  body.product-sidebar-compact .content-body.product-app .dashboard-cal-legend .dashboard-cal-legend-badge {
    min-width: 5.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0.22rem 0.55rem;
    font-size: 0.7rem;
    line-height: 1.15;
    font-weight: 600;
    border-radius: 0.35rem;
    border: 0;
  }
}

@media (max-width: 767.98px) {
  body.product-sidebar-compact .content-body.product-app .dashboard-cal-legend .dashboard-cal-legend-badge {
    min-width: 3.75rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0.1rem 0.35rem;
    font-size: 0.6rem;
    line-height: 1.05;
    font-weight: 600;
    border-radius: 0.22rem;
    border: 0;
  }
}

body.product-sidebar-compact:not(.coach-dashboard-page) .content-body.product-app #dashboard-calendar {
  --fc-today-bg-color: #e8f4fc;
  --fc-page-bg-color: var(--h0ckey-product-card-bg, #fff);
}

/* Coach dashboard calendar: no light gray “paper” inside day cells */
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar {
  --fc-today-bg-color: rgba(255, 255, 255, 0.08);
  --fc-page-bg-color: transparent;
  --fc-neutral-bg-color: rgba(255, 255, 255, 0.06);
  --fc-border-color: rgba(255, 255, 255, 0.22);
}

@media (max-width: 767.98px) {
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app .coach-dashboard-calendar-card--embed,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app .coach-dashboard-calendar-card--embed .card-body {
    background: transparent !important;
    box-shadow: none !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app .coach-dashboard-calendar-card__body {
    color: rgba(255, 255, 255, 0.92) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar {
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: rgba(255, 255, 255, 0.06);
    --fc-border-color: rgba(255, 255, 255, 0.22);
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
    color: rgba(255, 255, 255, 0.95) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.95) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day {
    background-color: transparent !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell-cushion,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell a {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day-number {
    color: rgba(255, 255, 255, 0.92) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact
    .content-body.product-app
    #dashboard-calendar
    .fc-scrollgrid-section-sticky
    > * {
    background: transparent !important;
  }

  body.product-sidebar-compact .content-body.product-app #dashboard-calendar-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: visible !important;
  }

  /* Kill horizontal scroll trap from theme (.app-fullcalendar { overflow: auto }) — week view only. */
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc:has(.fc-dayGridWeek-view) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: visible !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc:has(.fc-dayGridWeek-view) .fc-view-harness {
    width: 100% !important;
    overflow: visible !important;
  }

  /* Week view: keep all 7 day columns in the viewport (FC harness defaults to overflow:hidden). */
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-scroller-harness,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-scroller-harness-liquid {
    overflow: visible !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-scrollgrid-sync-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 100% !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-col-header-cell,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-daygrid-body .fc-daygrid-day {
    width: 14.285714% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-scrollgrid-section-header .fc-scroller,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-scrollgrid-section-body .fc-scroller {
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  /* Optical center: range title between next chevron and week/month (narrow toolbar). */
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) .fc-toolbar-title,
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) h2.fc-toolbar-title {
    padding-right: 0.55rem !important;
  }

  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3) .fc-button {
    padding: 0.18rem 0.38rem !important;
    font-size: 0.62rem !important;
    line-height: 1.15 !important;
    border-radius: 0.28rem !important;
  }
}

@media (min-width: 768px) {
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app .coach-dashboard-calendar-card--embed,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app .coach-dashboard-calendar-card--embed .card-body {
    background: transparent !important;
    box-shadow: none !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app .coach-dashboard-calendar-card__body {
    color: rgba(255, 255, 255, 0.92) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar {
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: rgba(255, 255, 255, 0.06);
    --fc-border-color: rgba(255, 255, 255, 0.22);
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
    color: rgba(255, 255, 255, 0.95) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.95) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day {
    background-color: rgba(0, 0, 0, 0.12) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell-cushion,
  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell a {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day-number {
    color: rgba(255, 255, 255, 0.92) !important;
  }

  body.coach-dashboard-page.product-sidebar-compact
    .content-body.product-app
    #dashboard-calendar
    .fc-scrollgrid-section-sticky
    > * {
    background: transparent !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-scrollgrid-sync-table {
    table-layout: fixed !important;
    width: 100% !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-col-header-cell {
    width: 14.285714% !important;
  }

  body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-daygrid-body .fc-daygrid-day {
    width: 14.285714% !important;
  }
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc {
  gap: 0;
}

/*
 * Week view: inset column dividers. With table-layout:fixed + 14.285% columns, border-collapse can
 * drop a vertical edge between adjacent cells (often seen Tue/Wed); box-shadow is not merged away.
 */
body.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-col-header-cell:not(:last-child),
body.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc .fc-dayGridWeek-view .fc-daygrid-day:not(:last-child) {
  box-shadow: inset -1px 0 0 var(--fc-border-color, rgba(255, 255, 255, 0.22)) !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar.fc-header-toolbar {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: center;
  column-gap: 0.2rem;
  overflow-x: visible;
  min-height: 2.5rem;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(1) {
  grid-column: 1 / 3;
  justify-self: start;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.25rem;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) {
  grid-column: 3 / 5;
  justify-self: stretch;
  align-self: center;
  max-width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) h2.fc-toolbar-title {
  margin: 0;
  text-align: center;
  width: 100%;
  max-width: 100% !important;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3) {
  grid-column: 5 / 8;
  justify-self: end;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.25rem;
  justify-content: flex-end;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar.fc-footer-toolbar {
  margin-top: 0.3rem !important;
  margin-bottom: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: center;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-footer-toolbar > .fc-toolbar-chunk:nth-child(2) {
  grid-column: 4;
  justify-self: center;
}

/* Detach segmented control so each control reads as its own pill (like legend badges) */
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-button-group {
  gap: 0.25rem;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc-direction-ltr .fc-button-group > .fc-button:not(:first-child) {
  margin-left: 0 !important;
  border-top-left-radius: 0.375rem !important;
  border-bottom-left-radius: 0.375rem !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar.fc-direction-ltr .fc-button-group > .fc-button:not(:last-child) {
  border-top-right-radius: 0.375rem !important;
  border-bottom-right-radius: 0.375rem !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
}

/* Match legend badges (Skills / Training / …): same pill size, weight, and solid fills */
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk .fc-button {
  padding: 0.375rem 0.65rem !important;
  font-size: 0.75rem !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  border-radius: 0.375rem !important;
  min-height: 0;
  box-shadow: none !important;
  text-transform: none;
  letter-spacing: normal;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk .fc-button .fc-icon {
  font-size: 0.85rem;
  line-height: 1;
  color: inherit;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-prev-button,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-next-button {
  padding-left: 0.3rem !important;
  padding-right: 0.3rem !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-today-button {
  --fc-button-text-color: #fff !important;
  --fc-button-bg-color: #6c757d !important;
  --fc-button-border-color: transparent !important;
  --fc-button-hover-bg-color: #5c636a !important;
  --fc-button-hover-border-color: transparent !important;
  --fc-button-active-bg-color: #565e64 !important;
  --fc-button-active-border-color: transparent !important;
  background-color: #6c757d !important;
  border-color: transparent !important;
  color: #fff !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-today-button:hover,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-today-button:focus {
  background-color: #5c636a !important;
  border-color: transparent !important;
  color: #fff !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-view-harness {
  margin-top: 0 !important;
  min-height: 18rem;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-body,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-body .fc-scrollgrid-sync-table {
  min-height: 8rem;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-scrollgrid {
  border-top-width: 0;
  margin-top: 0 !important;
}

@media (min-width: 768px) {
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-scrollgrid-section-header .fc-scroller {
    overflow: hidden !important;
  }
}

@media (max-width: 767.98px) {
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-scrollgrid-section-header .fc-scroller {
    overflow-x: visible !important;
  }
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell {
  vertical-align: middle;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell-cushion {
  padding: 1px 3px !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-prev-button.fc-button-primary,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-next-button.fc-button-primary,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-prev-button,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-next-button {
  --fc-button-text-color: #fff !important;
  --fc-button-bg-color: #0d6efd !important;
  --fc-button-border-color: transparent !important;
  --fc-button-hover-bg-color: #0b5ed7 !important;
  --fc-button-hover-border-color: transparent !important;
  --fc-button-active-bg-color: #0a58ca !important;
  --fc-button-active-border-color: transparent !important;
  background-color: #0d6efd !important;
  border-color: transparent !important;
  color: #fff !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-prev-button .fc-icon,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-next-button .fc-icon {
  color: #fff !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #fff;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-prev-button:hover,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-next-button:hover,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-prev-button:focus,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-next-button:focus {
  filter: none;
  background-color: #0b5ed7 !important;
  border-color: transparent !important;
  color: #fff !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-dayGridMonth-view .fc-daygrid-day-number {
  color: #495057 !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridMonth-view
  .fc-daygrid-day-number {
  color: #ced4da !important;
}

body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-left .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-center .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
  color: #212529 !important;
  font-size: 0.78rem;
  font-weight: 700 !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #212529;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: min(52vw, 14rem);
}

@media (max-width: 767.98px) {
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-left .fc-toolbar-title,
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-center .fc-toolbar-title,
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
    font-size: 0.68rem !important;
    max-width: min(46vw, 11rem);
  }

  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) .fc-toolbar-title,
  body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(2) h2.fc-toolbar-title {
    max-width: 100% !important;
  }
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-toolbar-chunk-left
  .fc-toolbar-title,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-toolbar-chunk-center
  .fc-toolbar-title,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-toolbar-title,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  h2.fc-toolbar-title {
  color: #f8f9fa !important;
  -webkit-text-fill-color: #f8f9fa;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridMonth-button:not(.fc-button-active),
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridWeek-button:not(.fc-button-active) {
  --fc-button-text-color: #fff !important;
  --fc-button-bg-color: #6c757d !important;
  --fc-button-border-color: transparent !important;
  --fc-button-hover-bg-color: #5c636a !important;
  --fc-button-hover-border-color: transparent !important;
  background-color: #6c757d !important;
  border-color: transparent !important;
  color: #fff !important;
  opacity: 1 !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridMonth-button.fc-button-active,
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridWeek-button.fc-button-active {
  --fc-button-text-color: #fff !important;
  --fc-button-bg-color: #0d6efd !important;
  --fc-button-border-color: transparent !important;
  --fc-button-hover-bg-color: #0b5ed7 !important;
  --fc-button-hover-border-color: transparent !important;
  background-color: #0d6efd !important;
  border-color: transparent !important;
  color: #fff !important;
  opacity: 1 !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridMonth-button:not(.fc-button-active),
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridWeek-button:not(.fc-button-active) {
  --fc-button-bg-color: #6c757d !important;
  color: #fff !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridMonth-button.fc-button-active,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-dayGridWeek-button.fc-button-active {
  --fc-button-bg-color: #0d6efd !important;
  color: #fff !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell.dashboard-cal-header-today {
  background: #e8f4fc !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell.dashboard-cal-header-today
  .fc-col-header-cell-cushion {
  background: transparent;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day.fc-day-today {
  background-color: var(--fc-today-bg-color, #e8f4fc) !important;
}

/* FullCalendar v5: sticky header + scrollgrid use --fc-page-bg-color (defaults to white) */
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar {
  --fc-page-bg-color: #14161a;
  --fc-neutral-bg-color: #1a1d21;
  --fc-border-color: #343a40;
  --fc-neutral-text-color: #adb5bd;
  --fc-today-bg-color: rgba(13, 110, 253, 0.26);
  --fc-list-event-hover-bg-color: #252830;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-theme-standard
  td,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-theme-standard
  th {
  border-color: #343a40 !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-scrollgrid-section-sticky
  > * {
  background: var(--fc-page-bg-color) !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell {
  background-color: var(--fc-page-bg-color) !important;
  color: #e9ecef;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell-cushion,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell
  a {
  color: #f8f9fa !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell.dashboard-cal-header-today {
  background: rgba(13, 110, 253, 0.32) !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day {
  background-color: var(--fc-page-bg-color) !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day.fc-day-today {
  background-color: var(--fc-today-bg-color) !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridWeek-view
  .fc-daygrid-day-number {
  color: #ced4da !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .dashboard-cal-dayhead,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .dashboard-cal-dayhead
  .fw-semibold {
  color: #f8f9fa !important;
}

[data-theme-version="dark"] .content-body.product-app .coach-dashboard-calendar-card .card-body.text-dark {
  color: #dee2e6 !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar {
  --fc-page-bg-color: #14161a;
  --fc-neutral-bg-color: #1a1d21;
  --fc-border-color: #343a40;
  --fc-neutral-text-color: #adb5bd;
  --fc-today-bg-color: rgba(13, 110, 253, 0.26);
  --fc-list-event-hover-bg-color: #252830;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-theme-standard td,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-theme-standard th,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-scrollgrid-section-sticky > *,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-col-header-cell,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-daygrid-day {
  background-color: var(--fc-page-bg-color) !important;
  border-color: #343a40 !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-col-header-cell-cushion,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-col-header-cell a,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar th {
  color: #f8f9fa !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today {
  background: rgba(13, 110, 253, 0.32) !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-daygrid-day.fc-day-today {
  background-color: var(--fc-today-bg-color) !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-toolbar-title,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/*
 * Coach dashboard: stretch the calendar card so its floor roughly meets the coach icon rail’s
 * last row (9 core icons: 7 standard + 2 enlarged). --coach-dashboard-cal-deck-h ≈ nav hub table + margins.
 */
body.coach-dashboard-page.product-sidebar-compact {
  --coach-rail-icon-rows-h: calc(
    var(--product-rail-menu-pad-top, 20px)
    + (7 * (2.832rem + 1.04rem + 0.12rem + 0.25rem))
    + (2 * (3.1152rem + 1.04rem + 0.12rem + 0.25rem))
    + 0.75rem
  );
  --coach-dashboard-cal-deck-h: 10.5rem;
}

@media (min-width: 768px) {
  body.coach-dashboard-page.product-sidebar-compact #main-wrapper:not(.menu-toggle) .coach-dashboard-calendar-card {
    min-height: max(
      14.875rem,
      calc((var(--coach-rail-icon-rows-h) - var(--coach-dashboard-cal-deck-h, 5.75rem)) * 0.85)
    );
  }
}

/*
 * Product LMS / playbook (body[data-theme-version="dark"]): card surfaces & copy
 * White/near-white → dark card; dark grey body copy → light grey; mid grey stays mid grey.
 */
[data-theme-version="dark"] .content-body.product-app .card {
  background-color: #101012;
  border-color: #2a2f36;
  color: #e9ecef;
}

[data-theme-version="dark"] .content-body.product-app .card-header {
  background-color: #16181c;
  border-bottom-color: #2a2f36;
  color: #f1f3f5;
}

[data-theme-version="dark"] .content-body.product-app .card-body {
  color: #dee2e6;
}

[data-theme-version="dark"] .content-body.product-app .card-title,
[data-theme-version="dark"] .content-body.product-app h3,
[data-theme-version="dark"] .content-body.product-app h4,
[data-theme-version="dark"] .content-body.product-app h5,
[data-theme-version="dark"] .content-body.product-app h6 {
  color: #f8f9fa;
}

[data-theme-version="dark"] .content-body.product-app .text-dark {
  color: #dee2e6 !important;
}

[data-theme-version="dark"] .content-body.product-app .text-muted {
  color: #9ca3af !important;
}

[data-theme-version="dark"] .content-body.product-app .text-black {
  color: #f1f5f9 !important;
}

[data-theme-version="dark"] .content-body.product-app .bg-white,
[data-theme-version="dark"] .content-body.product-app .bg-light,
[data-theme-version="dark"] .content-body.product-app .bg-white.bg-opacity-75,
[data-theme-version="dark"] .content-body.product-app .bg-light.bg-opacity-50 {
  background-color: #14161a !important;
  color: #dee2e6;
}

[data-theme-version="dark"] .content-body.product-app .border,
[data-theme-version="dark"] .content-body.product-app .border-secondary,
[data-theme-version="dark"] .content-body.product-app .border-light {
  border-color: #343a40 !important;
}

[data-theme-version="dark"] .content-body.product-app .list-group-item {
  background-color: #101012;
  border-color: #2a2f36;
  color: #e9ecef;
}

[data-theme-version="dark"] .content-body.product-app .list-group-item.text-muted,
[data-theme-version="dark"] .content-body.product-app .list-group-item .text-muted {
  color: #9ca3af !important;
}

[data-theme-version="dark"] .content-body.product-app .table {
  color: #dee2e6;
  border-color: #343a40;
}

[data-theme-version="dark"] .content-body.product-app .table-bordered > :not(caption) > * > * {
  border-color: #343a40;
}

[data-theme-version="dark"] .content-body.product-app thead.table-light th,
[data-theme-version="dark"] .content-body.product-app .table-light {
  --bs-table-bg: #1a1d21;
  --bs-table-color: #e9ecef;
  color: #e9ecef;
  background-color: #1a1d21 !important;
  border-color: #343a40;
}

[data-theme-version="dark"] .content-body.product-app .table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-accent-bg: rgba(255, 255, 255, 0.03);
}

[data-theme-version="dark"] .content-body.product-app .plan-sessions-table,
[data-theme-version="dark"] .content-body.product-app .plan-sessions-table > :not(caption) > * > *,
[data-theme-version="dark"] .content-body.product-app .plan-sessions-table tbody td,
[data-theme-version="dark"] .content-body.product-app .plan-sessions-table tbody th {
  background-color: #14161a !important;
  color: #e9ecef !important;
  border-color: #343a40 !important;
}

[data-theme-version="dark"] .content-body.product-app .plan-sessions-table thead.table-light th {
  background-color: #1a1d21 !important;
  color: #e9ecef !important;
  border-color: #343a40 !important;
}

[data-theme-version="dark"] .content-body.product-app #plan-sessions-empty {
  background-color: #14161a !important;
  color: #9ca3af !important;
}

[data-theme-version="dark"] .content-body.product-app .form-control,
[data-theme-version="dark"] .content-body.product-app .form-select {
  background-color: #14161a;
  border-color: #495057;
  color: #f8f9fa;
}

[data-theme-version="dark"] .content-body.product-app .form-label {
  color: #ced4da;
}

[data-theme-version="dark"] .content-body.product-app .tp-hub-filter-card .card-header,
[data-theme-version="dark"] .content-body.product-app .coach-act-filter-card .card-header {
  background-color: #16181c;
  color: #f1f3f5;
}

/*
 * Coach/player dashboard calendar: month title + weekday labels + day numerals use accent blue
 * when not the “today” cell (today keeps stronger contrast on tinted background).
 */
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-left .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-center .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
body.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
  color: #0d6efd !important;
  -webkit-text-fill-color: #0d6efd !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .fc-col-header-cell-cushion,
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  a {
  color: #0d6efd !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day:not(.fc-day-today)
  .fc-daygrid-day-number {
  color: #0d6efd !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day.fc-day-today
  .fc-daygrid-day-number {
  color: #0b2a97 !important;
  font-weight: 700;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-toolbar-chunk-left
  .fc-toolbar-title,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-toolbar-chunk-center
  .fc-toolbar-title,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-toolbar-title,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  h2.fc-toolbar-title {
  color: #6ea8fe !important;
  -webkit-text-fill-color: #6ea8fe !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .fc-col-header-cell-cushion,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  a {
  color: #6ea8fe !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day:not(.fc-day-today)
  .fc-daygrid-day-number {
  color: #6ea8fe !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-daygrid-day.fc-day-today
  .fc-daygrid-day-number {
  color: #cfe2ff !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-toolbar-title,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
  color: #6ea8fe !important;
  -webkit-text-fill-color: #6ea8fe !important;
}

body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-col-header-cell-cushion,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar .fc-col-header-cell a,
body[data-theme-version="dark"] .content-body.product-app #dashboard-calendar th {
  color: #6ea8fe !important;
}

body[data-theme-version="dark"]
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell.dashboard-cal-header-today
  .fc-col-header-cell-cushion,
body[data-theme-version="dark"]
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell.dashboard-cal-header-today
  a {
  color: #f8f9fa !important;
}

body[data-theme-version="dark"]
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridWeek-view
  .fc-daygrid-day:not(.fc-day-today)
  .fc-daygrid-day-number {
  color: #6ea8fe !important;
}

/* Beat .card-body.text-dark + FC button chrome: month title, inactive Month/Week toggle, custom week headers. */
body.product-sidebar-compact
  .coach-dashboard-calendar-card.card
  .card-body.text-dark
  #dashboard-calendar
  .fc-toolbar-chunk-center
  .fc-toolbar-title,
body.product-sidebar-compact
  .coach-dashboard-calendar-card.card
  .card-body.text-dark
  #dashboard-calendar
  .fc-toolbar-title,
body.product-sidebar-compact
  .coach-dashboard-calendar-card.card
  .card-body.text-dark
  #dashboard-calendar
  h2.fc-toolbar-title {
  color: #0d6efd !important;
  -webkit-text-fill-color: #0d6efd !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridMonth-button:not(.fc-button-active),
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridWeek-button:not(.fc-button-active) {
  color: #0d6efd !important;
  --fc-button-text-color: #0d6efd !important;
  background-color: rgba(13, 110, 253, 0.12) !important;
  border-color: rgba(13, 110, 253, 0.45) !important;
  opacity: 1 !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridMonth-button.fc-button-active,
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridWeek-button.fc-button-active {
  color: #fff !important;
  --fc-button-text-color: #fff !important;
}

/* FC6 may normalize button class casing — catch inactive view toggles in the right chunk. */
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-button:not(.fc-button-active) {
  color: #0d6efd !important;
  --fc-button-text-color: #0d6efd !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-button.fc-button-active {
  color: #fff !important;
  --fc-button-text-color: #fff !important;
}

body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .dashboard-cal-dayhead,
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .dashboard-cal-dayhead
  .fw-semibold,
body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .dashboard-cal-dayhead-date {
  color: #0d6efd !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridMonth-button:not(.fc-button-active),
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-dayGridWeek-button:not(.fc-button-active) {
  color: #6ea8fe !important;
  --fc-button-text-color: #6ea8fe !important;
  background-color: rgba(110, 168, 254, 0.12) !important;
  border-color: rgba(110, 168, 254, 0.45) !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .dashboard-cal-dayhead,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .dashboard-cal-dayhead
  .fw-semibold,
[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-col-header-cell:not(.dashboard-cal-header-today)
  .dashboard-cal-dayhead-date {
  color: #6ea8fe !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-button:not(.fc-button-active) {
  color: #6ea8fe !important;
  --fc-button-text-color: #6ea8fe !important;
}

[data-theme-version="dark"]
  body.product-sidebar-compact
  .content-body.product-app
  #dashboard-calendar
  .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3)
  .fc-button.fc-button-active {
  color: #fff !important;
  --fc-button-text-color: #fff !important;
}

/* Coach dashboard: calendar sits on wallpaper — wins over accent-blue rules above. */
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-chunk-center .fc-toolbar-title,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
  color: rgba(255, 255, 255, 0.96) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96) !important;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell:not(.dashboard-cal-header-today) .fc-col-header-cell-cushion,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell:not(.dashboard-cal-header-today) a {
  color: rgba(255, 255, 255, 0.9) !important;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day:not(.fc-day-today) .fc-daygrid-day-number {
  color: rgba(255, 255, 255, 0.9) !important;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
  color: #fff !important;
  font-weight: 700;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell:not(.dashboard-cal-header-today) .dashboard-cal-dayhead,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell:not(.dashboard-cal-header-today) .dashboard-cal-dayhead .fw-semibold,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell:not(.dashboard-cal-header-today) .dashboard-cal-dayhead-date {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Today / highlighted column: weekday + date read on bright today header (not white-on-ice). */
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today .dashboard-cal-dayhead .fw-semibold,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today .dashboard-cal-dayhead-date {
  color: #0f1720 !important;
  -webkit-text-fill-color: #0f1720 !important;
  opacity: 1 !important;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today .fc-col-header-cell-cushion,
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today a {
  color: #0f1720 !important;
}

[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today .dashboard-cal-dayhead .fw-semibold,
[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell.dashboard-cal-header-today .dashboard-cal-dayhead-date {
  color: #0f1720 !important;
  -webkit-text-fill-color: #0f1720 !important;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-dayGridMonth-button:not(.fc-button-active),
body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-dayGridWeek-button:not(.fc-button-active) {
  color: rgba(255, 255, 255, 0.92) !important;
  --fc-button-text-color: rgba(255, 255, 255, 0.92) !important;
  background-color: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
}

body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-header-toolbar > .fc-toolbar-chunk:nth-child(3) .fc-button:not(.fc-button-active) {
  color: rgba(255, 255, 255, 0.92) !important;
  --fc-button-text-color: rgba(255, 255, 255, 0.92) !important;
}

[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-toolbar-title,
[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar h2.fc-toolbar-title {
  color: rgba(255, 255, 255, 0.96) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96) !important;
}

[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-col-header-cell:not(.dashboard-cal-header-today) a,
[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar .fc-daygrid-day:not(.fc-day-today) .fc-daygrid-day-number {
  color: rgba(255, 255, 255, 0.9) !important;
}

[data-theme-version="dark"] body.coach-dashboard-page.product-sidebar-compact .content-body.product-app #dashboard-calendar {
  --fc-page-bg-color: transparent !important;
  --fc-neutral-bg-color: rgba(255, 255, 255, 0.08) !important;
}

/* Product chrome: modest inset from viewport scrollbar (portrait phones). */
@media (max-width: 767.98px) and (orientation: portrait) {
  body.product-sidebar-compact .product-chrome-wrap > .header .header-content {
    padding-right: max(0.55rem, calc(0.35rem + 12px + env(safe-area-inset-right, 0px))) !important;
  }

  body.product-sidebar-compact .product-chrome-grid {
    padding-right: max(0.55rem, calc(0.35rem + 12px + env(safe-area-inset-right, 0px))) !important;
  }

  body.product-sidebar-compact .product-navbar-collapse.product-navbar-collapse {
    padding-right: max(0.35rem, calc(0.25rem + 8px)) !important;
  }
}