/* =========================================================
   EVENTS PLAYER CORE — GLOBAL THEME + UTILITIES  (FINAL CONSOLIDATED)
   ========================================================= */

/* -------------------------------
   ROOT VARIABLES (Default: Light)
--------------------------------*/
:root {
    color-scheme: light;

    /* Base Palette */
    --color-bg: #ffffff;
    --color-surface: #f5f6f8;
    --color-text: #171923;

    /* Brand / Accents */
    --color-accent: #3b82f6;
    --color-accent-hover: #60a5fa; /* Lighter blue for hovers */
    --color-success: #2b8a3e;
    --color-warning: #c49c0b;
    --color-error: #b23a48;

    /* Structure / Neutrals */
    --color-border: rgba(0, 0, 0, 0.1);
    --color-stroke: rgba(0, 115, 170, 0.22);
    --color-stroke-double: rgba(0, 115, 170, 0.45);

    /* Typography + Layout */
    --font-body: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 14px;
    --shadow-soft: 0 6px 16px rgba(15, 23, 42, 0.15);
    --transition-fast: 0.2s ease;

    /* Light-mode card surfaces */
    --bg-elev: #ffffff;
    --bg-elev-alt: #f5f6f8;

    /* =========================================================
    EPCORE — SHARED SCORECARD TOKENS (SAFE MERGE)
    These tokens are reused by Scorecard, Games, Leaderboard, Reports
    ========================================================= */

    --eps-site-green: #4D969B;
    --eps-dark-bg:    #1B222C;
    --eps-light-bg:   #B5C7DB;

    /* Row-level identity colors */
    --color-par: var(--eps-site-green);
    --color-hcp: #3B73B3;
}

/* =========================================================
   THEME MODES — LIGHT / DARK / AUTO
   ========================================================= */

[data-theme="light"] { color-scheme: light; }
[data-theme="dark"]  { color-scheme: dark; }
[data-theme="auto"]  { color-scheme: light; }

/* Explicit light */
:root[data-theme="light"],
html.theme-light {
    color-scheme: light;
}

/* Dark theme */
html.theme-dark,
body.theme-dark,
:root[data-theme="dark"] {
    color-scheme: dark;

    --color-bg: #0f172a;
    --color-surface: #111827;
    --color-text: #e5e7eb;
    --color-accent: #3b82f6;
    --color-accent-hover: #93c5fd; /* Even lighter blue for dark theme contrast */
    --color-success: #22c55e;
    --color-warning: #facc15;
    --color-error: #fb7185;

    --color-border: rgba(148,163,184,0.35);
    --color-stroke: rgba(56,189,248,0.35);
    --color-stroke-double: rgba(56,189,248,0.6);

    --bg-elev: #111827;
    --bg-elev-alt: #020617;
}

/* Auto follows system preference */
@media (prefers-color-scheme: dark) {
    :root[data-theme="auto"] {
        color-scheme: dark;

        --color-bg: #020617;
        --color-surface: #020617;
        --color-text: #e5e7eb;
        --color-border: rgba(148,163,184,0.35);

        --bg-elev: #0b1120;
        --bg-elev-alt: #020617;
    }
}

/* =========================================================
   GLOBAL BASE + TRANSITIONS
   ========================================================= */

/* Global base links - ensure no purple */
a,
a:visited {
    color: var(--color-accent) !important;
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover,
a:focus {
    color: var(--color-accent-hover) !important;
}

/* Red button border normalization */
button,
.tribe-events-c-top-bar__today-button,
.tribe-events-c-view-selector__button,
.epgm-add-game-btn,
.epgm-save-game-btn,
.epgm-cancel-game-btn,
.epgm-delete-game-btn,
.tribe-events-c-nav__prev,
.tribe-events-c-nav__next {
    border: 1px solid var(--color-border) !important;
    outline: none !important;
    box-shadow: none !important;
}

body {
    font-family: var(--font-body);
    background: var(--color-bg) !important;
    color: var(--color-text) !important;
    transition:
            background-color var(--transition-fast),
            color var(--transition-fast),
            border-color var(--transition-fast),
            fill var(--transition-fast),
            stroke var(--transition-fast);
}

/* =========================================================
   FORMS — Theme-aware inputs (Formidable, Elementor, native)
   Ensures My Account fields flip properly in Dark/Light
   ========================================================= */

/* Base inputs adopt tokens */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
select,
textarea,
.elementor-field-textual,
.frm_forms input,
.frm_forms select,
.frm_forms textarea {
    background: var(--bg-elev);
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

/* Placeholder color */
input::placeholder,
textarea::placeholder,
.elementor-field-textual::placeholder {
    color: color-mix(in srgb, var(--color-text) 55%, transparent);
}

/* Focus ring uses accent */
input:focus,
select:focus,
textarea:focus,
.elementor-field-textual:focus,
.frm_forms input:focus,
.frm_forms select:focus,
.frm_forms textarea:focus {
    outline: none;
    border-color: var(--color-stroke);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-stroke) 35%, transparent);
    transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
}

/* =========================================================
   ELEMENTOR HEADER/FOOTER THEME ADAPTATION
   Ensure Elementor templates inherit our theme tokens so
   site header/footer follow Light / Dark / Auto modes.
   ========================================================= */

/* Common wrappers used by Elementor Header & Footer */
:root .elementor-element.elementor-location-header,
:root [data-elementor-type="header"],
:root header.site-header,
:root .elementor-element.elementor-location-footer,
:root [data-elementor-type="footer"],
:root footer.site-footer {
    background-color: var(--bg-elev) !important;
    color: var(--color-text) !important;
    border-bottom: 1px solid var(--color-border);
}

/* Inner containers inside Elementor header/footer that often carry background */
:root .elementor-element.elementor-location-header .elementor-section,
:root .elementor-element.elementor-location-header .elementor-container,
:root .elementor-element.elementor-location-header .e-con,
:root [data-elementor-type="header"] .elementor-section,
:root [data-elementor-type="header"] .elementor-container,
:root [data-elementor-type="header"] .e-con,
:root header.site-header .elementor-section,
:root header.site-header .elementor-container,
:root header.site-header .e-con,
:root .elementor-element.elementor-location-footer .elementor-section,
:root .elementor-element.elementor-location-footer .elementor-container,
:root .elementor-element.elementor-location-footer .e-con,
:root [data-elementor-type="footer"] .elementor-section,
:root [data-elementor-type="footer"] .elementor-container,
:root [data-elementor-type="footer"] .e-con,
:root footer.site-footer .elementor-section,
:root footer.site-footer .elementor-container,
:root footer.site-footer .e-con {
    background-color: var(--bg-elev) !important;
    color: var(--color-text) !important;
}

/* Links inside headers/footers */
:root .elementor-element.elementor-location-header a,
:root [data-elementor-type="header"] a,
:root header.site-header a,
:root .elementor-element.elementor-location-footer a,
:root [data-elementor-type="footer"] a,
:root footer.site-footer a {
    color: var(--color-text);
    transition: color var(--transition-fast);
}

:root .elementor-element.elementor-location-header a:hover,
:root [data-elementor-type="header"] a:hover,
:root header.site-header a:hover,
:root .elementor-element.elementor-location-footer a:hover,
:root [data-elementor-type="footer"] a:hover,
:root footer.site-footer a:hover {
    color: var(--color-accent-hover) !important;
}

/* Icons/SVGs inside headers/footers adapt to text color */
:root .elementor-element.elementor-location-header svg,
:root [data-elementor-type="header"] svg,
:root header.site-header svg,
:root .elementor-element.elementor-location-footer svg,
:root [data-elementor-type="footer"] svg,
:root footer.site-footer svg {
    color: var(--color-text);
    fill: currentColor;
}

/* Explicit light-mode safety: ensure truly light header/footer in light mode */
html.theme-light .elementor-element.elementor-location-header,
html.theme-light [data-elementor-type="header"],
html.theme-light header.site-header,
html.theme-light .elementor-element.elementor-location-footer,
html.theme-light [data-elementor-type="footer"],
html.theme-light footer.site-footer,
html.theme-light .elementor-element.elementor-location-header .elementor-section,
html.theme-light .elementor-element.elementor-location-header .elementor-container,
html.theme-light .elementor-element.elementor-location-header .e-con,
html.theme-light [data-elementor-type="header"] .elementor-section,
html.theme-light [data-elementor-type="header"] .elementor-container,
html.theme-light [data-elementor-type="header"] .e-con,
html.theme-light header.site-header .elementor-section,
html.theme-light header.site-header .elementor-container,
html.theme-light header.site-header .e-con,
html.theme-light .elementor-element.elementor-location-footer .elementor-section,
html.theme-light .elementor-element.elementor-location-footer .elementor-container,
html.theme-light .elementor-element.elementor-location-footer .e-con,
html.theme-light [data-elementor-type="footer"] .elementor-section,
html.theme-light [data-elementor-type="footer"] .elementor-container,
html.theme-light [data-elementor-type="footer"] .e-con,
html.theme-light footer.site-footer .elementor-section,
html.theme-light footer.site-footer .elementor-container,
html.theme-light footer.site-footer .e-con {
    background-color: #ffffff !important;
    color: #171923 !important;
}

/* Optional subtle glow for light logos on dark backgrounds */
.ep-logo-glow-dark {
    /* soft outline so white logos remain visible on dark */
    filter: drop-shadow(0 0 1px rgba(255,255,255,0.25)) drop-shadow(0 0 6px rgba(0,0,0,0.55));
}


/* Utilities */
.bg-surface   { background: var(--color-surface); }
.text-accent  { color: var(--color-accent); }
.text-success { color: var(--color-success); }
.text-warning { color: var(--color-warning); }
.text-error   { color: var(--color-error); }
.border       { border: 1px solid var(--color-border); }
.rounded      { border-radius: var(--radius-md); }
.shadow-soft  { box-shadow: var(--shadow-soft); }

/* =========================================================
   BASE THEME VARIABLE BRIDGE (ensures visible icons in LIGHT mode)
   - Some pages that render the toolbar do not load our wizard styles,
     so core CSS variables may be missing. Provide safe defaults here
     so SVG icons inherit a real color in both light and dark modes.
   ========================================================= */
/* Light (defaults) */
:root,
html[data-theme="light"],
body[data-theme="light"],
body.light,
body.theme-light{
  --eps-site-blue: #3b82f6;
  --eps-site-green: #4d969b;
  --eps-site-red:  #b23a48;
  --color-success: #16a34a;
  --bg-elev: #ffffff;
  --bg-elev-alt: #f7f7f7;
  --color-text: #111827;
  --color-border: rgba(0,0,0,0.14);
  --color-accent: var(--eps-site-blue, #3b82f6);
  --color-error: var(--eps-site-red, #b23a48);
  --color-surface: #ffffff;
}
/* Dark overrides — support many toggles */
:is([data-theme="dark"],
   html[data-theme="dark"],
   body[data-theme="dark"],
   body.dark,
   html.dark,
   body.theme-dark,
   html.theme-dark,
   body.dark-mode,
   html.dark-mode,
   body.is-dark-theme,
   html.is-dark-theme,
   [data-bs-theme="dark"],
   html[data-bs-theme="dark"]) {
  --eps-site-blue: #3b82f6;
  --eps-site-green: #4d969b;
  --eps-site-red:  #ef4444;
  --color-success: #22c55e;
  --bg-elev: #111827;
  --bg-elev-alt: #0f172a;
  --color-text: #e5e7eb;
  --color-border: rgba(148,163,184,0.35);
  --color-accent: var(--eps-site-blue, #3b82f6);
  --color-error: var(--eps-site-red, #ef4444);
  --color-surface: #111827;
}

/* Toolbar-specific color overrides removed per request */

/* =========================================================
   TOAST NOTIFICATIONS
   ========================================================= */
.epg-toast {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    background: var(--color-success);
    color: #fff;
    padding: .75rem 1rem;
    border-radius: .5rem;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .3s, transform .3s;
    z-index: 9999;
}
.epg-toast.show   { opacity: 1; transform: translateY(0); }
.epg-toast.error  { background: var(--color-error); }
.epg-toast.info   { background: var(--color-accent); }
.epg-toast.success{ background: var(--color-success); }

/* =========================================================
   TOP TOOLBAR — removed per request. Leaving a tiny neutral reset so
   toolbar, when rendered, behaves like normal inline content.
   ========================================================= */

#epcore-toolbar { all: unset; }
.epcore-toolbar { all: unset; }
.ep-toolbar-inner { all: unset; }
.epcore-lefticons { all: unset; }
.ep-icon-btn { all: unset; }

/* Toolbar (inline) — polished segmented control look (light + dark) */
.epcore-toolbar.is-inline .epcore-lefticons,
#epcore-toolbar[data-inline="1"] .epcore-lefticons{
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  gap: 2px;
  padding: 4px;
  border-radius: 12px;
  border: 1px solid var(--color-border, rgba(0,0,0,0.14));
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent);
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

/* Keep internal wrappers from affecting layout */
.epcore-lefticons .ep-admin-tools{ display: inline-flex; align-items: center; gap: 2px; }
.epcore-lefticons .ep-icon-popwrap{ display: inline-flex; align-items: center; }

.ep-icon-btn{
  width: 36px !important;
  height: 36px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-text, #0f172a) !important;
  line-height: 1;
  cursor: pointer;
  transition: background-color .15s ease, transform .15s ease, color .15s ease;
}
.ep-icon-btn:hover{
  background: color-mix(in srgb, var(--color-accent, #3b82f6) 14%, var(--bg-elev, #fff)) !important;
  transform: translateY(-1px);
}
.ep-icon-btn.is-active,
.ep-icon-btn[aria-current="page"],
.ep-icon-btn[aria-pressed="true"]{
  background: var(--color-accent, #3b82f6) !important;
  color: #fff !important;
}
.ep-icon-btn:active{ transform: translateY(0); }
.ep-icon-btn:focus-visible{
  outline: 2px solid color-mix(in srgb, var(--color-accent, #3b82f6) 60%, transparent);
  outline-offset: 2px;
}
/* Right spacer no longer used */
.epcore-rightspacer { display: none; }

/* Inline layout — center the toolbar row without any fixed positioning or fade */
.epcore-toolbar.is-inline,
#epcore-toolbar[data-inline="1"]{
  display: block;
  max-width: var(--ep-content-max, 1200px);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 8px;
  text-align: center;
}

/* =========================================================
   THE EVENTS CALENDAR (TEC) LINK STYLING
   Match active links to ept-grp-hdr colors
   Light mode: darker blue for better readability
   ========================================================= */
.tribe-events a,
.tribe-events-nav a,
.tribe-events-sub-nav a,
.tribe-events-content a,
.single-tribe_events a:not(.elementor-button):not(.ep-pill):not(.ep-pill-primary) {
  color: #5c7fe3;
  text-decoration: none;
}
.tribe-events a:hover,
.tribe-events-nav a:hover,
.tribe-events-sub-nav a:hover,
.tribe-events-content a:hover,
.single-tribe_events a:not(.elementor-button):not(.ep-pill):not(.ep-pill-primary):hover {
  color: var(--color-accent-hover);
  text-decoration: underline;
}
.tribe-events a:active,
.tribe-events-nav a:active,
.tribe-events-sub-nav a:active,
.tribe-events-content a:active,
.single-tribe_events a:not(.elementor-button):not(.ep-pill):not(.ep-pill-primary):active {
  color: #5c7fe3;
}

/* Dark mode TEC links */
@media (prefers-color-scheme: dark) {
  .tribe-events a,
  .tribe-events-nav a,
  .tribe-events-sub-nav a,
  .tribe-events-content a,
  .single-tribe_events a:not(.elementor-button):not(.ep-pill):not(.ep-pill-primary) {
    color: #5c7fe3;
  }
  .tribe-events a:hover,
  .tribe-events-nav a:hover,
  .tribe-events-sub-nav a:hover,
  .tribe-events-content a:hover,
  .single-tribe_events a:not(.elementor-button):not(.ep-pill):not(.ep-pill-primary):hover {
    color: var(--color-accent-hover);
  }
  .tribe-events a:active,
  .tribe-events-nav a:active,
  .tribe-events-sub-nav a:active,
  .tribe-events-content a:active,
  .single-tribe_events a:not(.elementor-button):not(.ep-pill):not(.ep-pill-primary):active {
    color: #bfdbfe;
  }
}
.epcore-toolbar.is-inline .ep-toolbar-inner,
#epcore-toolbar[data-inline="1"] .ep-toolbar-inner{
  display: block;
}
/* (replaced above with segmented styling) */

/* Mobile-specific toolbar safety removed */

/* Popover under the Theme icon — removed per request */
.ep-icon-popwrap { position: relative; display: inline-block; }
/* Minimal popover styling for vertical differentiation (no animations, no fades) */
.ep-pop {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--bg-elev, #fff) !important;
  color: var(--color-text, #111827) !important;
  border: 1px solid var(--color-border, rgba(0,0,0,0.14)) !important;
  border-radius: 10px;
  padding: 6px;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  z-index: 10000;
}
.ep-pop[hidden]{ display:none !important; }
.ep-theme-pop{ display: inline-flex; gap: 6px; }
.ep-theme-pop .ep-theme-btn{ display: inline-flex; }
/* Ensure theme popover buttons always render glyphs and inherit color */
.ep-theme-btn{ display:inline-flex; align-items:center; justify-content:center; padding:6px; border-radius:8px; border:1px solid var(--color-border); background: var(--bg-elev); color: var(--color-text); cursor: pointer; }
.ep-theme-btn:hover{ background: color-mix(in srgb, var(--color-accent) 12%, var(--bg-elev)); color:#fff; border-color: color-mix(in srgb, var(--color-accent) 60%, var(--color-border)); }
.ep-theme-btn svg{ display:block !important; width:18px !important; height:18px !important; overflow:visible !important; opacity:1 !important; visibility:visible !important; pointer-events:none; }
.ep-theme-btn svg *, .ep-theme-btn .ep-ico *, .ep-theme-btn .ep-ico{ fill: currentColor !important; stroke: currentColor !important; opacity:1 !important; visibility:visible !important; }

/* Inline SVG icons — reliable across OS/fonts */
.ep-ico { display: block !important; width: 18px; height: 18px; fill: currentColor !important; stroke: currentColor !important; }
/* Guard against aggressive resets that hide or zero-out SVGs */
.ep-icon-btn svg { display: block !important; width: 26px !important; height: 26px !important; overflow: visible !important; opacity: 1 !important; visibility: visible !important; }

/* IMPORTANT: our global SVG reset forces `fill: currentColor`, which makes outline icons turn into solid blocks.
   Re-assert `fill: none` for outline glyphs that explicitly declare it. */
.ep-icon-btn svg [fill="none"],
.ep-icon-btn svg g[fill="none"],
.ep-icon-btn svg g[fill="none"] *{
  fill: none !important;
}

/* Elementor Nested Tabs (Dash/Scores/Event/Individual) — force persistent active styling */
.e-n-tabs-heading{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.e-n-tabs-heading .e-n-tab-title{
  border-radius: 999px;
  border: 1px solid var(--color-border, rgba(0,0,0,0.14));
  background: var(--bg-elev, #fff);
  color: var(--color-text, #111827);
  padding: 6px 14px;
  font-weight: 600;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.e-n-tabs-heading .e-n-tab-title:hover{
  background: color-mix(in srgb, var(--color-accent, #3b82f6) 8%, var(--bg-elev, #fff));
}
.e-n-tabs-heading .e-n-tab-title[aria-selected="true"]{
  background: var(--color-accent, #3b82f6);
  color: #fff;
  border-color: var(--color-accent, #3b82f6);
}
.e-n-tabs-heading .e-n-tab-title[aria-selected="true"]:focus,
.e-n-tabs-heading .e-n-tab-title[aria-selected="true"]:focus-visible{
  outline: none;
}
/* (Removed duplicate legacy `.ep-icon-btn` block that overrode sizing/hover behavior.) */

/* DARK MODE — harden contrast for icon buttons to ensure visible glyphs */
:is(html.theme-dark, body.theme-dark, html[data-theme="dark"], :root[data-theme="dark"], body.dark, html.dark) .ep-icon-btn{
  background: var(--color-surface, #111827) !important;
  color: var(--color-text, #e5e7eb) !important;
  -webkit-text-fill-color: currentColor !important;
  border-color: rgba(148,163,184,0.35) !important;
}
:is(html.theme-dark, body.theme-dark, html[data-theme="dark"], :root[data-theme="dark"], body.dark, html.dark) .ep-icon-btn:hover{
  background: color-mix(in srgb, var(--color-accent, #3b82f6) 10%, var(--color-surface, #111827)) !important;
}

/* LIGHT MODE — harden contrast for icon buttons and theme popover */
:is(html.theme-light, body.theme-light, html[data-theme="light"], :root[data-theme="light"], body.light) .ep-icon-btn{
  background: #ffffff !important;
  color: #0f172a !important; /* near-slate-900 */
  border-color: rgba(0,0,0,0.14) !important;
}

/* =========================================================
   TITLE + VENUE SHORTCODE (EP Core)
   Mirrors the alignment styles previously in the theme so
   users can drop [ep_event_venue_link] without theme deps.
   ========================================================= */
.ep-align-centerline{
  max-width: var(--ep-content-max, 1200px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 8px;
  padding-right: 8px;
}
.ep-title-venue{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: .25rem;
}
.ep-titleline{
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  /* Fixed title weight */
  font-weight: 600;
  line-height: 1.1;
  color: var(--color-text, #111827);
  text-align: center;
  margin: 0; /* eliminate any top margin introduced by heading resets */
}
.ep-venue-link{
  color: var(--color-accent, #3b82f6);
  text-decoration: none;
  font-size: 1rem;
  line-height: 1.2;
}
.ep-venue-link:hover{ text-decoration: underline; }
:is(html.theme-dark, body.theme-dark, html[data-theme="dark"], :root[data-theme="dark"], body.dark, html.dark) .ep-venue-link{
  color: var(--color-accent, #3b82f6);
}
:is(html.theme-light, body.theme-light, html[data-theme="light"], :root[data-theme="light"], body.light) .ep-icon-btn:hover{
  background: color-mix(in srgb, var(--color-accent, #3b82f6) 12%, #ffffff) !important;
}
:is(html.theme-light, body.theme-light, html[data-theme="light"], :root[data-theme="light"], body.light) .ep-pop{
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(0,0,0,0.14) !important;
}
:is(html.theme-light, body.theme-light, html[data-theme="light"], :root[data-theme="light"], body.light) .ep-theme-btn{
  background: #ffffff !important; color: #0f172a !important; border-color: rgba(0,0,0,0.14) !important;
}
:is(html.theme-light, body.theme-light, html[data-theme="light"], :root[data-theme="light"], body.light) .ep-theme-btn:hover{
  background: var(--color-accent, #3b82f6) !important; color: #fff !important; border-color: var(--color-accent, #3b82f6) !important;
}

/* =========================================================
   TEC spacer cleanup on single Event pages
   - Remove unwanted vertical space above the Title/Venue block
   - Scoped to single event templates only
   ========================================================= */
.single-tribe_events .tribe-events-pg-template{
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.single-tribe_events .tribe-events-pg-template .tec-spacer,
.single-tribe_events .tribe-events-pg-template .var-tec-spacer,
.single-tribe_events .tribe-events .tec-spacer{
  display: none !important;
}
/* Ensure our first centered block starts flush */
.single-tribe_events .ep-align-centerline:first-child{ margin-top: 0 !important; }
/* Keep the venue line snug under a heavier title weight */
.ep-title-venue{ margin-top: .2rem; }

.ep-btn {
    background: var(--color-accent); color: #fff;
    padding: .6rem 1.2rem; border-radius: 999px;
    font-size: .9rem; font-weight: 600;
    transition: background .2s, transform .2s; cursor: pointer;
}
.ep-btn:hover { background: color-mix(in srgb,var(--color-accent)85%,#000); transform: translateY(-1px); }
.ep-btn:active { transform: translateY(0); }

#tribe-events-pg-template, .tribe-events-pg-template {
    padding: 0 !important; /* Adjust the value as needed */
}

/* Theme toggle button styles removed */

/* Mobile-specific toolbar rules removed */

/* =========================================================
   SCORECARD WRAPPER + ALL-18 SCROLL
   ========================================================= */

.eps-scorecard-wrapper {
    width: auto; max-width: none;
    margin: 1.5rem auto;
    overflow-x: auto;
}

/* Card container */
.eps-scorecard-container {
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    padding: 1.25rem 1rem 1.5rem;
    overflow-x: auto;
}

/* Scrollbar */
.eps-scorecard-container::-webkit-scrollbar {
    height: 8px;
}
.eps-scorecard-container::-webkit-scrollbar-thumb {
    background: rgba(148,163,184,0.7);
    border-radius: 999px;
}
/* FORCE SHOW THE MODE ICON EMOJI/SVG */
.ep-theme-btn img.emoji {
    display: inline-block !important;
    width: 18px;
    height: 18px;
    object-fit: contain;
    pointer-events: none;
}

/* PREVENT COLOR-INHERIT OVERRIDES */
.ep-theme-btn img.emoji {
    filter: none !important;
    opacity: 1 !important;
}

/* 5. Prevent Elementor reset injecting button backgrounds */
button,
input[type="button"],
input[type="submit"] {
    background: var(--color-surface) !important;
    color: var(--color-text) !important;
    border-radius: var(--radius-md) !important;
    /* border: 1px solid var(--color-border) !important; */
}

/* Hover */
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background: var(--color-accent) !important;
    color: #fff !important;
}

.ep-theme-btn img.emoji {
    color: transparent !important; /* prevents forcing an invalid text color on SVG */
}

/* =========================================================
   LOADING SPINNER OVERLAY - Event/Tournament Loading
   ========================================================= */
.epc-loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-bg, #0f172a);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 1;
    transition: opacity 0.3s ease-out;
}

.epc-loading-overlay.epc-loading-fade-out {
    opacity: 0;
    pointer-events: none;
}

.epc-loading-spinner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.epc-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid var(--color-border, rgba(255,255,255,0.1));
    border-top-color: var(--color-accent, #3b82f6);
    border-radius: 50%;
    animation: epc-spin 1s linear infinite;
}

@keyframes epc-spin {
    to { transform: rotate(360deg); }
}

.epc-loading-text {
    color: var(--color-text-muted, #94a3b8);
    font-size: 1rem;
    font-weight: 500;
}

/* Light theme support */
:is(html.theme-light, body.theme-light, html[data-theme="light"], :root[data-theme="light"]) .epc-loading-overlay {
    background: var(--color-bg, #f8fafc);
}

/* =========================================================
   THE EVENTS CALENDAR — DARK MODE OVERRIDES (FINAL FIXES)
   ========================================================= */

/* 1. VIEW SELECTOR (Upcoming) & TODAY BUTTON */
html.theme-dark .tribe-events-c-view-selector__button,
html.theme-dark .tribe-events-c-top-bar__today-button {
    background-color: transparent !important; /* Match background */
    color: #f1f5f9 !important; /* Slate-100 */
    border: none !important;
    line-height: 1.2 !important;
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    margin: 0 !important;
}

/* Today Button */
html.theme-dark .tribe-events-c-top-bar__today-button {
    font-size: 14px !important;
    padding: 8px 20px !important;
}

/* Upcoming (View Selector) - Smaller Font, More Padding */
html.theme-dark .tribe-events-c-view-selector__button {
    font-size: 13px !important;
    padding: 10px 24px !important; /* Increased padding */
}

/* Force inner text (especially h3) to respect size */
html.theme-dark .tribe-events-c-view-selector__button *,
html.theme-dark .tribe-events-c-view-selector__button .tribe-events-c-view-selector__text,
html.theme-dark .tribe-events-c-view-selector__button h3 {
    font-size: 13px !important; /* Explicitly force 13px on children */
    font-weight: 500 !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
}

/* Hover States */
html.theme-dark .tribe-events-c-view-selector__button:hover,
html.theme-dark .tribe-events-c-top-bar__today-button:hover {
    background-color: var(--color-accent-hover) !important;
    color: #ffffff !important;
    border: none !important;
}

/* 2. NAVIGATION BUTTONS (< >) - FORCE VISIBILITY */
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-common-c-btn-icon {
    background-color: transparent !important;
    border: none !important;
    color: #f1f5f9 !important; /* Ensure light color */
    opacity: 1 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
    border-radius: var(--radius-md) !important;
    cursor: pointer !important;
}

html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev:hover,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next:hover,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-common-c-btn-icon:hover {
    color: #ffffff !important;
    background-color: var(--color-accent-hover) !important;
    border: none !important;
}

html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev:focus-visible,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next:focus-visible {
    outline: none;
}

/* Force SVGs to use high-contrast color (Fill & Stroke) */
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev svg,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next svg,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-common-c-svgicon {
    fill: #f1f5f9 !important; 
    stroke: #f1f5f9 !important;
    color: #f1f5f9 !important;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    opacity: 1 !important;
    display: block !important;
}
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev svg path,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next svg path {
    fill: #f1f5f9 !important;
    stroke: none !important; /* Usually paths are fills */
    color: #f1f5f9 !important;
}

/* Hover state for icons */
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev:hover svg,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next:hover svg,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-common-c-btn-icon:hover svg,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__prev:hover svg path,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-events-c-nav__next:hover svg path,
html.theme-dark .tribe-events-c-top-bar__nav .tribe-common-c-btn-icon:hover svg path {
    fill: #ffffff !important;
    stroke: #ffffff !important;
    color: #ffffff !important;
}

/* Tighten spacing so the nav buttons visually match Today/View controls */
html.theme-dark .tribe-events-c-top-bar__nav {
    gap: 8px !important;
}

/* 2d. MONTH VIEW TOP BAR TITLE / DATEPICKER BUTTON (prevent overlap, normalize sizing) */
html.theme-dark .tribe-events-c-top-bar,
html.theme-dark .tribe-events-c-top-bar__container {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap;
    min-height: 50px;
}

/* Ensure children also use flex alignment */
html.theme-dark .tribe-events-c-top-bar__nav,
html.theme-dark .tribe-events-c-top-bar__views,
html.theme-dark .tribe-events-c-top-bar__actions,
html.theme-dark .tribe-events-c-top-bar__datepicker {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

html.theme-dark .tribe-events-c-top-bar__nav,
html.theme-dark .tribe-events-c-top-bar__today-button {
    flex-shrink: 0;
}

html.theme-dark .tribe-events-c-top-bar__datepicker {
    flex: 1 1 auto;
    min-width: 220px;
}

html.theme-dark .tribe-events-c-top-bar__datepicker-button {
    background-color: transparent !important;
    color: #f1f5f9 !important;
    border: none !important;
    border-radius: var(--radius-md) !important;
    min-height: 40px !important;
    padding: 8px 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    white-space: nowrap;
}

html.theme-dark .tribe-events-c-top-bar__datepicker-button:hover {
    background-color: var(--color-accent-hover) !important;
    color: #ffffff !important;
}

html.theme-dark .tribe-events-c-top-bar__datepicker-button:focus-visible {
    outline: 2px solid rgba(56,189,248,0.70);
    outline-offset: 2px;
}

html.theme-dark .tribe-events-c-top-bar__datepicker-button svg,
html.theme-dark .tribe-events-c-top-bar__datepicker-button .tribe-common-c-svgicon {
    fill: currentColor !important;
    stroke: currentColor !important;
    opacity: 1 !important;
}

/* 2e. VIEW SELECTOR ICON/TEXT VISIBILITY (fix “empty box” look) */
html.theme-dark .tribe-events-c-view-selector__button {
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-md) !important;
    transition: none !important;
}

html.theme-dark .tribe-events-c-view-selector__button::after {
    display: none !important;
}

/* Hide the "Month/List/Day" text label next to the icon for a cleaner look */
html.theme-dark .tribe-events-c-view-selector__button-text,
html.theme-dark .tribe-events-c-view-selector__text {
    display: none !important;
}

html.theme-dark .tribe-events-c-view-selector__button:hover {
    background-color: transparent !important;
    color: #ffffff !important;
}

html.theme-dark .tribe-events-c-view-selector__button svg,
html.theme-dark .tribe-events-c-view-selector__button .tribe-common-c-svgicon {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    opacity: 1 !important;
    background-color: transparent !important;
    width: 28px !important;
    height: 28px !important;
}

/* Ensure no inner elements have backgrounds that create "rectangles" */
html.theme-dark .tribe-events-c-view-selector__button-icon,
html.theme-dark .tribe-events-c-view-selector__button-icon svg {
    background-color: transparent !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: var(--radius-md) !important;
    position: relative !important;
    overflow: visible !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html.theme-dark .tribe-events-c-view-selector__button-icon::before,
html.theme-dark .tribe-events-c-view-selector__button-icon::after,
html.theme-dark .tribe-events-c-view-selector__button-icon span::before,
html.theme-dark .tribe-events-c-view-selector__button-icon span::after {
    display: none !important;
    content: none !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* The actual hover highlight should be on the icon container in the view selector to match our inline styles */
html.theme-dark .tribe-events-c-view-selector__button:hover .tribe-events-c-view-selector__button-icon {
    background-color: var(--color-accent) !important;
    color: #ffffff !important;
}

/* 2f. VIEW SELECTOR DROPDOWN (Ensure clear contrast and spacing) */
html.theme-dark .tribe-events-c-view-selector__content {
    background-color: #1a202c !important; /* Slightly darker than grid */
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
    margin-top: 4px !important; /* Reduced from 10px to be closer to the button */
    padding: 6px !important;
    overflow: hidden !important;
    z-index: 1000 !important;
}

html.theme-dark .tribe-events-c-view-selector__list-item-link {
    color: #e5e7eb !important;
    padding: 12px 18px !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Ensure icons inside dropdown items are also visible and properly colored */
html.theme-dark .tribe-events-c-view-selector__list-item-link svg,
html.theme-dark .tribe-events-c-view-selector__list-item-link .tribe-common-c-svgicon {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    width: 20px !important;
    height: 20px !important;
}

html.theme-dark .tribe-events-c-view-selector__list-item-link:hover {
    background-color: var(--color-accent) !important;
    color: #ffffff !important;
    --tec-color-text-view-selector-list-item: #ffffff !important;
}

html.theme-dark .tribe-events-c-view-selector__list-item-link:hover .tribe-events-c-view-selector__list-item-text {
    color: #ffffff !important;
}

html.theme-dark .tribe-events-c-view-selector__list-item-link:hover svg,
html.theme-dark .tribe-events-c-view-selector__list-item-link:hover .tribe-common-c-svgicon {
    stroke: #ffffff !important;
}

/* Active item in dropdown */
html.theme-dark .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link {
    background-color: rgba(255,255,255,0.1) !important;
    --tec-color-text-view-selector-list-item: #60a5fa !important;
    color: var(--tec-color-text-view-selector-list-item) !important; /* Lighter blue for better contrast in dark mode */
}

/* 2c. BOTTOM PREV/NEXT NAV (List/Day/Month footer) */
html.theme-dark .tribe-events-c-nav {
    margin-top: 18px;
}

html.theme-dark .tribe-events-c-nav__list {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    gap: 14px;
}

html.theme-dark .tribe-events-c-nav__list-item {
    display: flex;
    align-items: center;
}

/* Prev sticks left, Next sticks right; Today stays in between */
html.theme-dark .tribe-events-c-nav__list-item--prev {
    margin-right: auto;
}
html.theme-dark .tribe-events-c-nav__list-item--next {
    margin-left: auto;
}

/* Style the actual controls in TEC markup: prev is <a>, next is <button>, today is <a> */
html.theme-dark a.tribe-events-c-nav__prev,
html.theme-dark button.tribe-events-c-nav__next,
html.theme-dark a.tribe-events-c-nav__today {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: none !important;
    border-radius: var(--radius-md);
    background: rgba(255,255,255,0.02);
    color: #f1f5f9 !important;
    text-decoration: none;
    box-sizing: border-box;
    min-height: 40px;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

html.theme-dark button.tribe-events-c-nav__next {
    appearance: none;
    -webkit-appearance: none;
    border: none !important;
    background: rgba(255,255,255,0.02);
    font: inherit;
    cursor: pointer;
}

html.theme-dark button.tribe-events-c-nav__next:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

html.theme-dark a.tribe-events-c-nav__prev:hover,
html.theme-dark a.tribe-events-c-nav__today:hover,
html.theme-dark button.tribe-events-c-nav__next:not(:disabled):hover {
    background: var(--color-accent-hover) !important;
    color: #ffffff !important;
    border: none !important;
}

html.theme-dark a.tribe-events-c-nav__prev:focus-visible,
html.theme-dark a.tribe-events-c-nav__today:focus-visible,
html.theme-dark button.tribe-events-c-nav__next:focus-visible {
    outline: none;
}

html.theme-dark a.tribe-events-c-nav__prev *,
html.theme-dark a.tribe-events-c-nav__today *,
html.theme-dark button.tribe-events-c-nav__next * {
    color: inherit !important;
}

html.theme-dark a.tribe-events-c-nav__prev .tribe-common-c-svgicon,
html.theme-dark button.tribe-events-c-nav__next .tribe-common-c-svgicon {
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    fill: currentColor;
    stroke: currentColor;
}

/* Align contents: prev icon-left, next icon-right */
html.theme-dark a.tribe-events-c-nav__prev {
    justify-content: flex-start;
}
html.theme-dark button.tribe-events-c-nav__next {
    justify-content: flex-end;
}

@media (max-width: 600px) {
    html.theme-dark .tribe-events-c-nav__list {
        flex-wrap: wrap;
    }
}

/* 2b. SUBSCRIBE DROPDOWN (button consistency) */
html.theme-dark .tribe-events-c-subscribe-dropdown__button {
    background-color: transparent !important;
    color: #f1f5f9 !important;
    border: none !important;
    border-radius: var(--radius-md) !important;
    min-height: 40px !important;
    padding: 8px 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
}
html.theme-dark .tribe-events-c-subscribe-dropdown__button:hover {
    background-color: var(--color-accent-hover) !important;
    color: #ffffff !important;
    border: none !important;
}
html.theme-dark .tribe-events-c-subscribe-dropdown__button:focus-visible {
    outline: 2px solid rgba(56,189,248,0.70);
    outline-offset: 2px;
}
html.theme-dark .tribe-events-c-subscribe-dropdown__icon {
    opacity: 0.9;
}

/* =========================================================
   THE EVENTS CALENDAR — MONTH VIEW POLISH (DARK MODE)
   ========================================================= */

/* Header row (Mon/Tue/...) */
html.theme-dark .tribe-events-calendar-month__header-column,
html.theme-dark .tribe-events-calendar-month__week-day {
    color: rgba(241,245,249,0.75) !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 11px !important;
}

/* Fix "underline" on view selector button - often caused by specific TEC selectors */
html.theme-dark .tribe-events-c-view-selector__button,
html.theme-dark .tribe-events-c-view-selector__button:focus,
html.theme-dark .tribe-events-c-view-selector__button:active {
    border-bottom: none !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

/* Calendar grid + day cells */
html.theme-dark .tribe-events-calendar-month__calendar-container,
html.theme-dark .tribe-events-calendar-month__calendar-grid {
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: var(--radius-lg, 14px) !important;
    overflow: hidden;
    background: rgba(255,255,255,0.01);
}

html.theme-dark .tribe-events-calendar-month__day,
html.theme-dark .tribe-events-calendar-month__day-cell,
html.theme-dark .tribe-events-calendar-month__day-date {
    border-color: rgba(255,255,255,0.12) !important;
}

html.theme-dark .tribe-events-calendar-month__day,
html.theme-dark .tribe-events-calendar-month__day-cell {
    background: transparent !important;
}

/* Day number */
html.theme-dark .tribe-events-calendar-month__day-date-daynum,
html.theme-dark .tribe-events-calendar-month__day-date-link,
html.theme-dark .tribe-events-calendar-month__day-number {
    color: rgba(241,245,249,0.85) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
}

/* Outside-month days */
html.theme-dark .tribe-events-calendar-month__day--outside-month,
html.theme-dark .tribe-events-calendar-month__day-cell--outside-month {
    opacity: 0.45;
}

/* Today highlight */
html.theme-dark .tribe-events-calendar-month__day--today,
html.theme-dark .tribe-events-calendar-month__day-cell--today {
    background: rgba(56,189,248,0.08) !important;
    box-shadow: inset 0 0 0 1px rgba(56,189,248,0.35);
}

/* Event “chips” inside a day cell */
html.theme-dark .tribe-events-calendar-month__calendar-event,
html.theme-dark .tribe-events-calendar-month__multiday-event,
html.theme-dark .tribe-events-calendar-month__single-event {
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 8px;
    padding: 6px 10px;
    margin: 4px;
}

html.theme-dark .tribe-events-calendar-month__calendar-event a,
html.theme-dark .tribe-events-calendar-month__calendar-event-title,
html.theme-dark .tribe-events-calendar-month__calendar-event-title-link {
    color: #60a5fa !important;
    font-weight: 600;
    text-decoration: none;
    line-height: 1.3;
}

html.theme-dark .tribe-events-calendar-month__calendar-event a:hover,
html.theme-dark .tribe-events-calendar-month__calendar-event-title-link:hover {
    color: #bfdbfe !important;
    text-decoration: underline;
}

html.theme-dark .tribe-events-calendar-month__calendar-event a:focus-visible,
html.theme-dark .tribe-events-calendar-month__calendar-event-title-link:focus-visible {
    outline: 2px solid rgba(56,189,248,0.70);
    outline-offset: 2px;
    border-radius: 8px;
}

/* TEC V2 Tooltip (Balloons) Dark Mode */
.tribe-common.tribe-events.tribe-events-view html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip,
.tribe-common.tribe-events.tribe-events-view html.theme-dark .tribe-common-c-tooltip,
.tribe-common.tribe-events.tribe-events-view html.theme-dark .tribe-events-tooltip,
html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip,
html.theme-dark .tribe-common-c-tooltip,
html.theme-dark .tribe-events-tooltip,
html.theme-dark .tribe-events-calendar-month__multiday-event-bar-inner--hover,
html.theme-dark .tribe-events-tooltip,
html.theme-dark .tribe-events-c-tooltip,
html.theme-dark .tribe-events-c-tooltip__content,
html.theme-dark .tribe-common-c-tooltip__content {
    background-color: #1a202c !important;
    border: 1px solid #60a5fa !important;
    color: #f1f5f9 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
    padding: 0 !important;
}

/* Ensure the background applies even if TEC uses different nested classes, but remove inner borders and add padding */
html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip > div,
html.theme-dark .tribe-common-c-tooltip > div,
html.theme-dark .tribe-events-tooltip > div,
html.theme-dark .tribe-events-c-tooltip > div {
    background-color: #1a202c !important;
    border: none !important;
    padding: 12px !important;
}

html.theme-dark [class*="tribe-events-"][class*="-tooltip"] {
    background-color: #1a202c !important;
}

html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip-title,
html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip-title-link,
html.theme-dark .tribe-events-c-tooltip__title,
html.theme-dark .tribe-events-c-tooltip__title-link {
    color: #60a5fa !important;
}

html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip-description,
html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip-datetime,
html.theme-dark .tribe-events-c-tooltip__description,
html.theme-dark .tribe-events-c-tooltip__datetime {
    color: rgba(241,245,249,0.8) !important;
}

/* Tooltip Arrow */
html.theme-dark .tribe-events-calendar-month__calendar-event-tooltip::after,
html.theme-dark .tribe-common-c-tooltip::after,
html.theme-dark .tribe-events-c-tooltip::after {
    border-top-color: #1a202c !important;
}

html.theme-dark .tribe-events-calendar-month__calendar-event-datetime,
html.theme-dark .tribe-events-calendar-month__calendar-event-time {
    color: rgba(148,163,184,0.95) !important;
    font-size: 11px;
}

/* 3. LIST VIEW DATE MARKERS (WED 21, etc) */
html.theme-dark .tribe-events-calendar-list__event-date-tag-weekday,
html.theme-dark .tribe-events-calendar-list__event-date-tag-daynum {
    color: var(--color-text) !important;
    opacity: 1 !important;
    text-shadow: 0 0 1px rgba(0,0,0,0.5); /* Slight pop */
}
/* Ensure the parent tag container is visible */
html.theme-dark .tribe-events-calendar-list__event-date-tag {
    background: transparent !important;
    opacity: 1 !important;
    margin-right: 15px !important;
}

/* 3. LIST VIEW TITLES & META (Contrast Fix) */
/* Force lighter blue in dark mode for titles */
html.theme-dark .tribe-events-calendar-list__event-title-link,
html.theme-dark .tribe-events-calendar-list__event-title-link:link,
html.theme-dark .tribe-events-calendar-list__event-title-link:visited {
    color: #60a5fa !important; 
    text-decoration: none;
}
html.theme-dark .tribe-events-calendar-list__event-title-link:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

/* FIX: Event Info / Venue / Description Visibility */
html.theme-dark .tribe-events-calendar-list__event-datetime-wrapper,
html.theme-dark .tribe-events-calendar-list__event-datetime,
html.theme-dark .tribe-events-calendar-list__event-venue,
html.theme-dark .tribe-events-calendar-list__event-venue-address,
html.theme-dark .tribe-events-calendar-list__event-description,
html.theme-dark .tribe-events-calendar-list__event-description p {
    color: var(--color-text) !important; /* Force readable text */
    opacity: 0.9;
}
html.theme-dark .tribe-events-calendar-list__event-venue-title {
    color: var(--color-text) !important;
    font-weight: 600;
}
/* Address muted */
html.theme-dark .tribe-events-calendar-list__event-venue-address {
    opacity: 0.75;
}


/* 5. DATEPICKER - SLEEK & DARK MODE (Robust Selectors) */
/* Safety: Hide the "Add Event" pill on single event pages */
.single-tribe_events #ep-calendar-actions-container {
    display: none !important;
}

#ep-calendar-actions-container {
    display: flex;
    align-items: center;
    margin: 0 0 1rem 0;
}
.ep-add-event-pill {
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    padding: 8px 16px !important;
    border-radius: 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
.ep-add-event-pill:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.datepicker {
    background-color: var(--color-surface) !important;
    color: var(--color-text) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
    padding: 12px !important;
    font-family: var(--font-body) !important;
}
/* Header */
.datepicker thead tr:first-child th {
    background-color: transparent !important;
    color: var(--color-text) !important;
    border-radius: 6px;
}
.datepicker thead tr:first-child th:hover {
    background-color: var(--color-accent-hover) !important;
    color: #ffffff !important;
}
/* Arrows */
.datepicker .prev, .datepicker .next {
    color: var(--color-accent) !important;
    font-size: 1.2em;
    font-weight: bold;
    visibility: visible !important; /* Ensure visible */
}
.datepicker .prev:hover, .datepicker .next:hover {
    background-color: var(--color-accent-hover) !important;
    color: #ffffff !important;
}
/* Day Names */
.datepicker .dow {
    color: var(--color-text-muted, #9ca3af) !important;
    font-size: 0.85em;
    padding-bottom: 6px;
    font-weight: 600;
}
/* Days Grid - Force visibility on all cells */
.datepicker tbody tr > td,
.datepicker tbody tr > td.day {
    color: var(--color-text) !important; /* Force visible text color */
    background: transparent;
    border-radius: 6px;
    font-weight: 500;
}
.datepicker tbody tr > td:hover,
.datepicker tbody tr > td.day:hover {
    background: var(--color-accent-hover) !important;
    color: #ffffff !important;
    cursor: pointer;
}
/* Active Day */
.datepicker tbody tr > td.active,
.datepicker tbody tr > td.active:hover,
.datepicker tbody tr > td.day.active,
.datepicker tbody tr > td.day.active:hover {
    background: var(--color-accent) !important;
    color: #fff !important;
    font-weight: bold;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}
/* Muted Days (Old/New) */
.datepicker table tr td.old,
.datepicker table tr td.new {
    color: var(--color-text-muted, #6b7280) !important;
    opacity: 0.4;
}

/* 6. MOBILE & LIST VIEW REFINEMENTS */
@media (max-width: 768px) {
    /* Compact Top Bar - Reduce extra space */
    .tribe-events-header {
        padding-top: 0 !important;
        margin-top: 0 !important;
        padding-bottom: 0 !important;
    }
    .tribe-events-c-top-bar { 
        margin-bottom: 0 !important; 
        padding: 0 !important;
        min-height: 0 !important;
    }
    .tribe-events-c-top-bar__container { 
        display: flex !important;
        flex-direction: row-reverse !important; 
        flex-wrap: nowrap !important;
        align-items: center !important; 
        justify-content: flex-end !important;
        gap: 0.5rem !important; 
        width: 100% !important;
        padding: 0.5rem 0 !important;
    }

    /* Move Upcoming label left of view selector */
    .tribe-events-c-top-bar__container > *:first-child {
        order: 2 !important; /* View selector usually first in DOM */
    }
    .tribe-events-c-top-bar__container > *:last-child {
        order: 1 !important; /* Upcoming/Search usually last */
    }
    
    /* Hide search icon/button to use the "Upcoming" label as the primary interaction area if needed, or just keep it simple */
    .tribe-events-c-events-bar__search-button {
        display: none !important;
    }
    
    .tribe-events-c-events-bar__search-container {
        flex: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }
    
    /* "Upcoming" label (Search label in TEC) */
    .tribe-events-c-search__input-control {
        display: flex !important;
        align-items: center !important;
        width: auto !important;
    }
    
    .tribe-events-c-search__input {
        padding: 0 !important;
        background: transparent !important;
        border: none !important;
        font-weight: 700 !important;
        font-size: 1.15rem !important;
        color: #f1f5f9 !important;
        width: auto !important;
    }

    /* Target the container of the view selector and search to ensure they are on one line */
    .tribe-events-c-top-bar__container {
        display: flex !important;
        flex-direction: row !important; /* Switch back to row for label-first if preferred, or row-reverse for icon-first */
        justify-content: space-between !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .tribe-events-c-view-selector {
        order: 2 !important;
    }
    .tribe-events-c-events-bar__search-container {
        order: 1 !important;
    }
    
    /* Compact Events Bar (Search/Filters) */
    .tribe-events-c-events-bar {
        margin-top: 0 !important;
        margin-bottom: 0.25rem !important;
        padding: 0 !important;
    }
    
    /* Compact Nav List - Prevent line returns */
    .tribe-events-c-nav__list {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        gap: 4px !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    .tribe-events-c-nav__list-item {
        flex: 1 1 auto !important;
        margin: 0 !important;
        min-width: 0 !important; /* Allow shrinking */
    }

    .tribe-events-c-nav__link {
        padding: 6px 8px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    /* Compact buttons on mobile */
    .tribe-events-c-top-bar__today-button,
    .tribe-events-c-view-selector__button,
    .tribe-events-c-events-bar__search-button {
        width: auto !important;
        flex: 0 0 auto !important;
        justify-content: center !important;
        padding: 0.4rem 0.6rem !important;
        min-height: 32px !important;
    }

    /* Event Cards - Tighten spacing and fix layout */
    .tribe-events-calendar-list__event,
    .tribe-events-calendar-day__event {
        padding-top: 0.5rem !important; 
        padding-bottom: 0.5rem !important;
        margin-bottom: 1.5rem !important;
        display: flex !important;
        flex-direction: column !important;
        border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    }
    
    /* Remove dead space on left for List and Day views */
    .tribe-events-view--list .tribe-events-header,
    .tribe-events-view--list .tribe-events-c-top-bar__container,
    .tribe-events-view--list .tribe-events-c-events-bar,
    .tribe-events-view--day .tribe-events-header,
    .tribe-events-view--day .tribe-events-c-top-bar__container,
    .tribe-events-view--day .tribe-events-c-events-bar,
    .tribe-events-view--list .tribe-events-calendar-list,
    .tribe-events-view--day .tribe-events-calendar-day {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .tribe-events-calendar-list__event-row,
    .tribe-events-calendar-day__event-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        display: block !important;
        width: 100% !important;
    }

    .tribe-events-calendar-list__event-details,
    .tribe-events-calendar-day__event-details {
        width: 100% !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
        order: 2;
    }

    .tribe-events-calendar-list__event-date-tag,
    .tribe-events-calendar-day__event-date-tag {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    /* Image sizing - Sleek landscape aspect */
    .tribe-events-calendar-list__event-featured-image-wrapper {
        margin-bottom: 1rem !important;
        margin-top: 0 !important;
        width: calc(100% - 2px) !important;
        max-width: calc(100% - 2px) !important;
        aspect-ratio: 16 / 9;
        overflow: hidden !important;
        border-radius: 8px !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        order: 1;
        box-sizing: border-box !important;
    }
    .tribe-events-calendar-list__event-featured-image,
    .tribe-events-calendar-list__event-featured-image-wrapper img {
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        display: block;
    }
    
    /* Compact Typography */
    .tribe-events-calendar-list__event-title,
    .tribe-events-calendar-day__event-title {
        font-size: 1.25rem !important;
        line-height: 1.2;
        margin-bottom: 0.4rem !important;
        font-weight: 700 !important;
    }
    .tribe-events-calendar-list__event-datetime-wrapper,
    .tribe-events-calendar-day__event-datetime-wrapper {
        font-size: 0.85rem !important;
        margin-bottom: 0.25rem !important;
    }
    .tribe-events-calendar-list__event-venue-details,
    .tribe-events-calendar-day__event-venue-details {
        font-size: 0.85rem !important;
        line-height: 1.3;
        margin-bottom: 0.5rem !important;
    }
    
    /* Fix slight horizontal float (overflow issues) */
    .tribe-events,
    .tribe-common,
    #tribe-events-content,
    .tribe-events-calendar-list,
    .tribe-events-calendar-day {
        max-width: 100vw !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    
    .tribe-common *, .tribe-common *:before, .tribe-common *:after {
        box-sizing: border-box !important;
    }
    
    /* Ensure title containers don't overflow */
    .tribe-events-calendar-list__event-title,
    .tribe-events-calendar-day__event-title,
    .tribe-events-calendar-list__event-title-link,
    .tribe-events-calendar-day__event-title-link {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
        display: block !important;
    }

    .tribe-events-calendar-list__event-description {
        font-size: 0.95rem !important;
        line-height: 1.5;
    }
}

/* =========================================================
   EVENTS LIST PAGE - FEATURED IMAGE STABILITY
   Reserve landscape space on the calendar list page so portrait source
   dimensions do not shove the card horizontally before CSS settles.
   ========================================================= */

@media (min-width: 769px) {
    .tribe-events-calendar-list__event-featured-image-wrapper,
    body.post-type-archive-tribe_events .tribe-events-calendar-list__event-featured-image-wrapper,
    .tribe-events .tribe-events-calendar-list__event-featured-image-wrapper,
    .tribe-events-view--list .tribe-events-calendar-list__event-featured-image-wrapper {
        width: 360px !important;
        max-width: 360px !important;
        height: 180px !important;
        max-height: 180px !important;
        display: block !important;
        flex: 0 0 auto !important;
        overflow: hidden !important;
        border-radius: 10px !important;
        margin-top: 0 !important;
        margin-bottom: 1rem !important;
        float: right !important;
        margin-left: auto !important;
    }

    .tribe-events-calendar-list__event-featured-image,
    .tribe-events-calendar-list__event-featured-image-wrapper img,
    body.post-type-archive-tribe_events .tribe-events-calendar-list__event-featured-image,
    body.post-type-archive-tribe_events .tribe-events-calendar-list__event-featured-image-wrapper img,
    .tribe-events .tribe-events-calendar-list__event-featured-image,
    .tribe-events .tribe-events-calendar-list__event-featured-image-wrapper img,
    .tribe-events-view--list .tribe-events-calendar-list__event-featured-image,
    .tribe-events-view--list .tribe-events-calendar-list__event-featured-image-wrapper img {
        width: 100% !important;
        max-width: 360px !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block !important;
        border-radius: 10px !important;
    }
}

/* =========================================================
   SINGLE EVENT PAGE - EMBEDDED EVENTS VIEW
   Force uniform image sizes and border radius
   ========================================================= */

/* Target feature images in embedded lists/views on Single Event pages */
.single-tribe_events .tribe-events-calendar-list__event-featured-image-wrapper,
.single-tribe_events .tribe-events-pro-photo__event-featured-image-wrapper,
.single-tribe_events .tribe-events-event-image {
    width: 100% !important;
    max-width: 100% !important;
    height: 200px !important;
    max-height: 200px !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.single-tribe_events .tribe-events-calendar-list__event-featured-image-wrapper img,
.single-tribe_events .tribe-events-pro-photo__event-featured-image-wrapper img,
.single-tribe_events .tribe-events-event-image img,
/* Explicitly target the class user reported */
.single-tribe_events img.tribe-events-calendar-list__event-featured-image {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 10px !important;
    display: block !important;
}

/* Specific fix for Elementor embedded widgets if they use different classes */
.single-tribe_events .elementor-widget-theme-post-featured-image img {
    border-radius: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 200px !important;
    object-fit: cover !important;
    display: block !important;
}

/* =========================================================
   ORGANIZER CARD — DARK MODE CONTRAST FIX
   ========================================================= */
html.theme-dark .tribe-events-meta-group-organizer dt,
html.theme-dark .tribe-events-meta-group-organizer .tribe-events-meta-label,
html.theme-dark .tribe-events-organizer-meta dt,
html.theme-dark .tribe-events-organizer-meta .tribe-events-meta-label,
html.theme-dark .tribe-events-meta-group-organizer strong,
html.theme-dark .tribe-events-organizer-meta strong,
/* Elementor Widget specific classes */
html.theme-dark .tec-events-elementor-event-widget__organizer-header,
html.theme-dark .tec-events-elementor-event-widget__organizer-phone-header,
html.theme-dark .tec-events-elementor-event-widget__organizer-website-header,
html.theme-dark .tec-events-elementor-event-widget__organizer-email-header {
    color: var(--color-text-muted, #94a3b8) !important;
    opacity: 0.9;
}
html.theme-dark .tribe-events-meta-group-organizer dd,
html.theme-dark .tribe-events-organizer-meta dd,
html.theme-dark .tribe-events-meta-group-organizer .tribe-events-meta-value,
html.theme-dark .tribe-events-organizer-meta .tribe-events-meta-value,
/* Elementor Widget content values */
html.theme-dark .tec-events-elementor-event-widget__organizer-phone,
html.theme-dark .tec-events-elementor-event-widget__organizer-website,
html.theme-dark .tec-events-elementor-event-widget__organizer-email,
html.theme-dark .tec-events-elementor-event-widget__organizer-name {
    color: var(--color-text) !important;
}


/* =========================================================
   INDIVIDUAL CONTESTS (SKINS/PINS) - MOBILE STACKING
   Prevents overflow ("pushing off canvas") in Lightbox/Mobile
   ========================================================= */
@media (max-width: 768px) {
    .epcg-results-root,
    .epcg-toolbar {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        flex-wrap: nowrap !important;
    }
    .epcg-results-root > *,
    .epcg-toolbar > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important; /* Allow flex shrink */
        flex: 1 1 auto !important;
        margin-bottom: 1rem !important;
    }
}



/* Drag and Drop Highlights */
.drag-over {
    background: #f0f7ff !important;
    border-color: #3b82f6 !important;
}
.drag-over-bench {
    background: #fffbeb !important;
    border-color: #f59e0b !important;
}
html[data-theme="dark"] .drag-over,
body.theme-dark .drag-over,
body.is-dark-theme .drag-over,
.wp-admin.theme-dark .drag-over {
    background: rgba(59, 130, 246, 0.2) !important;
    border-color: #3b82f6 !important;
}
html[data-theme="dark"] .drag-over-bench,
body.theme-dark .drag-over-bench,
body.is-dark-theme .drag-over-bench,
.wp-admin.theme-dark .drag-over-bench {
    background: rgba(245, 158, 11, 0.2) !important;
    border-color: #f59e0b !important;
}