:root {
  --brand-color: #DC143C; /* crimson */
  --brand-color-dark: #B01034;
}

/* Override common class names that used 'crimson' */
.text-crimson { color: var(--brand-color) !important; }
.bg-crimson, .background-crimson { background: var(--brand-color) !important; }
.border-crimson { border-color: var(--brand-color) !important; }
.btn-crimson { background: var(--brand-color) !important; border-color: var(--brand-color) !important; color: #fff !important; }
.hover\:text-crimson:hover { color: var(--brand-color) !important; }

/* Match inline style attributes that contain 'crimson' and replace the text color only (don't change background) */
[style*="crimson"] { color: var(--brand-color) !important; border-color: var(--brand-color) !important; }

/* Override inline SVG fills that still point to the old hex */
svg [fill="#E73B37"], [fill="#E73B37"] { fill: var(--brand-color) !important; }

/* Generic helpers to visually replace remaining red tokens */
.text-brand { color: var(--brand-color) !important; }
.btn-brand { background: var(--brand-color); color: #fff; border: 1px solid var(--brand-color); }

/* Fullscreen button style tweak for video controls */
.vc-controls { display:flex; align-items:center; gap:10px; }
.vc-button { background:transparent; border:0; color:var(--brand-color); cursor:pointer; padding:6px; }
.vc-button svg { width:18px; height:18px; vertical-align:middle; }
