/* TSV Venne · central color themes
   Component styles keep layout ownership. This file owns theme tokens and color mapping only. */
:root{
  --theme-page:#fff;--theme-surface:#fff;--theme-surface-raised:#fff;--theme-nav:rgba(255,255,255,.94);
  --theme-input:#fff;--theme-input-text:#101216;--theme-accent-text:#e30613;--theme-hero:linear-gradient(145deg,#fff,#fff 55%,#f6f6f8);
  --theme-band-red:linear-gradient(135deg,#fff3f4,#fff);--theme-card-border:rgba(17,19,23,.07);
  --theme-nav-border:rgba(17,19,23,.08);--theme-nav-shadow:0 18px 50px rgba(17,19,23,.16);--theme-focus:rgba(227,6,19,.28);--theme-weather-bg:#f8f8f8;--theme-weather-border:#e6e6e6;--theme-weather-icon:#fff;--theme-weather-label:#888;--theme-weather-strong:#222;--theme-weather-detail:#666;--theme-weather-source:#999
}
html[data-theme="dark"]{
  --r:#e30613;--rd:#b8000e;--ink:#f7f8fa;--mut:#aeb3bc;--line:#30343c;--soft:#191c21;--rs:#351116;
  --shadow:0 18px 55px rgba(0,0,0,.28);--theme-page:#0d0f12;--theme-surface:#15181d;--theme-surface-raised:#1b1f25;
  --theme-nav:rgba(18,20,24,.94);--theme-input:#101318;--theme-input-text:#f7f8fa;--theme-accent-text:#ff5a63;
  --theme-hero:linear-gradient(145deg,#171a1f,#101318 58%,#1a1012);--theme-band-red:linear-gradient(135deg,#211316,#15181d);
  --theme-card-border:rgba(255,255,255,.08);--theme-nav-border:rgba(255,255,255,.09);--theme-nav-shadow:0 18px 50px rgba(0,0,0,.40);--theme-focus:rgba(227,6,19,.34);--theme-weather-bg:#1b1f25;--theme-weather-border:#30343c;--theme-weather-icon:#15181d;--theme-weather-label:#aeb3bc;--theme-weather-strong:#f7f8fa;--theme-weather-detail:#aeb3bc;--theme-weather-source:#9096a0
}

/* The existing central theme controls which TSV crest is visible in the header. */
.brand>.brandCrestDark{display:none}
html[data-theme="dark"] .brand>img:not(.brandCrestDark){display:none}
html[data-theme="dark"] .brand>.brandCrestDark{display:block}

/* App shell and shared surfaces. Standard deliberately keeps the established appearance. */
html[data-theme="dark"]{background:var(--theme-page)}
html[data-theme="dark"] body{background:var(--theme-page);color:var(--ink)}
html[data-theme="dark"] .top{background:var(--theme-nav);border-bottom-color:var(--theme-nav-border)}
html[data-theme="dark"] .bottom{background:var(--theme-nav);border-color:var(--theme-nav-border);box-shadow:var(--theme-nav-shadow)}
html[data-theme="dark"] .poweredBy{color:var(--mut)}
html[data-theme="dark"] .poweredBy strong{color:var(--ink)}
html[data-theme="dark"] .back{background:var(--theme-surface)!important;border-color:var(--line)!important;color:var(--ink)!important}
html[data-theme="dark"] .card,
html[data-theme="dark"] .white,
html[data-theme="dark"] .empty,
html[data-theme="dark"] .install,
html[data-theme="dark"] .pushStatus,
html[data-theme="dark"] .pushCat,
html[data-theme="dark"] .comingCard,
html[data-theme="dark"] .mcCalendarControls,
html[data-theme="dark"] .mcFilterPanel,
html[data-theme="dark"] .socialHint,
html[data-theme="dark"] .volleyEmpty{background:var(--theme-surface);color:var(--ink);border-color:var(--theme-card-border)}
html[data-theme="dark"] .soft,
html[data-theme="dark"] .volleySection,
html[data-theme="dark"] .socialFoot,
html[data-theme="dark"] .mutedCard,
html[data-theme="dark"] .editorForm,
html[data-theme="dark"] .marketMeta span,
html[data-theme="dark"] .marketContactBox,
html[data-theme="dark"] .marketConsent{background:var(--soft);color:var(--ink)}
html[data-theme="dark"] .redsoft{background:var(--theme-band-red)}
html[data-theme="dark"] .hero{background:var(--theme-hero);border-color:var(--theme-card-border);box-shadow:var(--shadow)}
html[data-theme="dark"] .hero:after{background:radial-gradient(circle,rgba(227,6,19,.16),transparent 68%)}
html[data-theme="dark"] .eye{color:var(--theme-accent-text)}

/* Readable accent text is distinct from brand-red button fills in the dark theme. */
html[data-theme="dark"] .head a,html[data-theme="dark"] .gDate b,html[data-theme="dark"] .news time,
html[data-theme="dark"] .news em,html[data-theme="dark"] .wp a,html[data-theme="dark"] .bottom a.on,
html[data-theme="dark"] .messageItem>a,html[data-theme="dark"] .phoneLink,html[data-theme="dark"] .textButton,
html[data-theme="dark"] .mcTeamGroups label b,html[data-theme="dark"] .mcAgendaDate span,html[data-theme="dark"] .mcTeamCode,
html[data-theme="dark"] .mcCalendarFoot a,html[data-theme="dark"] .socialDept,html[data-theme="dark"] .communityVacancy strong,
html[data-theme="dark"] .communitySyncNote a,html[data-theme="dark"] .communityFallback a,html[data-theme="dark"] .communityHint a,
html[data-theme="dark"] .communityConsent a,html[data-theme="dark"] .collectionImageFallback span,html[data-theme="dark"] .collectionProductLabel b,
html[data-theme="dark"] .serviceFormExternal,html[data-theme="dark"] .mcReferenceCard a{color:var(--theme-accent-text)!important}

/* Buttons, filters and form controls. */
html[data-theme="dark"] .btnW,
html[data-theme="dark"] .filters button,
html[data-theme="dark"] .tabs button,
html[data-theme="dark"] .mcPresets button,
html[data-theme="dark"] .mcTeamPickerHead button,
html[data-theme="dark"] .mcScopeFilters label,
html[data-theme="dark"] .marketFilter,
html[data-theme="dark"] .socialFilter,
html[data-theme="dark"] .monthPicker button{background:var(--theme-surface);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .filters button.on,html[data-theme="dark"] .marketFilter.on,html[data-theme="dark"] .socialFilter.on,
html[data-theme="dark"] .monthPicker button.on{background:var(--r);border-color:var(--r);color:#fff}
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:var(--theme-input);color:var(--theme-input-text);border-color:var(--line)}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#737983}
html[data-theme="dark"] .communityField input[readonly]{background:var(--soft);color:var(--mut)}
html[data-theme="dark"] .formStack label,html[data-theme="dark"] .fieldTitle{color:var(--ink)}

/* Theme mappings for feature-owned surfaces. */
html[data-theme="dark"] .serviceFormToolbar{background:var(--theme-nav);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .formFallback{background:var(--soft)}
html[data-theme="dark"] .collectionProduct,html[data-theme="dark"] .collectionGraphic{background:var(--theme-surface)}
html[data-theme="dark"] .collectionImageWrap,html[data-theme="dark"] .collectionProduct .collectionImageWrap img{background:var(--soft)}
html[data-theme="dark"] .collectionImageFallback{background:var(--soft);color:var(--mut)}
html[data-theme="dark"] .collectionImageFallback b,html[data-theme="dark"] .collectionProductLabel{color:var(--ink)!important}
html[data-theme="dark"] .homeTerminClickable::after{background:var(--theme-surface)!important;color:var(--theme-accent-text)!important}
html[data-theme="dark"] .homeAllOffers{background:var(--theme-surface);color:var(--theme-accent-text);border-color:var(--line)}
html[data-theme="dark"] .installStep,html[data-theme="dark"] .installGuideClose,html[data-theme="dark"] .installGlyph{background:var(--theme-surface);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .installStep>b{background:var(--rs);color:var(--theme-accent-text)}
html[data-theme="dark"] .mcPersonalSaveBar{background:var(--soft);border-color:var(--line)}
html[data-theme="dark"] .mcPersonalSaveMark,html[data-theme="dark"] .mcPersonalSaveStatus,html[data-theme="dark"] .mcPersonalSaveActions button,html[data-theme="dark"] .mcPersonalSaveActions a{color:var(--mut)}
html[data-theme="dark"] .mcPersonalSaveActions button{background:var(--theme-surface);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .mcSetupNotice{background:#241518;border-color:#533037}
html[data-theme="dark"] .mcSetupNotice strong{color:#ffadb3}
html[data-theme="dark"] .mcSetupNotice span{color:#cdaeb1}
html[data-theme="dark"] .mcFilterToggle{background:var(--soft);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .mcFilterToggle>span{background:var(--theme-surface);color:var(--theme-accent-text)}
html[data-theme="dark"] .mcFilterSwitches label,html[data-theme="dark"] .mcTeamGroups section{background:var(--soft);color:var(--ink)}
html[data-theme="dark"] .mcAgendaBadge{background:var(--soft);color:var(--mut)!important}
html[data-theme="dark"] .mcAgendaBadge.home{background:#351116;color:#ff9ca4!important}
html[data-theme="dark"] .mcAgendaBadge.away,html[data-theme="dark"] .mcAgendaBadge.training{background:#22262c;color:#bec3cb!important}
html[data-theme="dark"] .mcReferenceCard{background:var(--soft)!important;border-color:var(--line)!important;color:var(--mut)!important}
html[data-theme="dark"] .mcReferenceCard strong{color:var(--ink)!important}
html[data-theme="dark"] .socialIntro{background:var(--theme-hero);border-color:var(--line)}
html[data-theme="dark"] .socialFilter{color:var(--ink)}
html[data-theme="dark"] .socialFoot strong{color:var(--ink)}
html[data-theme="dark"] .marketInfoIcon,html[data-theme="dark"] .marketTag{background:var(--soft);color:var(--ink)}
html[data-theme="dark"] .marketCard h3,html[data-theme="dark"] .marketAdminHead h3{color:var(--ink)}
html[data-theme="dark"] .marketField label,html[data-theme="dark"] .marketConsent,html[data-theme="dark"] .marketAdminLink a{color:var(--mut)}
html[data-theme="dark"] .marketPrimary:not(.marketIntro .marketPrimary){background:var(--r)!important;color:#fff!important;border-color:var(--r)!important}
html[data-theme="dark"] .messageActions .open{background:var(--r);color:#fff}
html[data-theme="dark"] .messageActions .link{background:var(--soft);color:var(--ink)}
html[data-theme="dark"] .archivePushHint,html[data-theme="dark"] .archivePushHint a,
html[data-theme="dark"] .legalLinks .editorialFooterLogin{color:var(--mut)}
html[data-theme="dark"] .deleteMessageBtn{color:var(--theme-accent-text)}
html[data-theme="dark"] .deleteMessageBtn:hover{background:var(--soft)}
html[data-theme="dark"] .wp{color:var(--ink)}
html[data-theme="dark"] .wp h1,html[data-theme="dark"] .wp h2,html[data-theme="dark"] .wp h3{color:var(--ink)}
html[data-theme="dark"] .wp table,html[data-theme="dark"] .wp td,html[data-theme="dark"] .wp th{border-color:var(--line)}

/* Mobile contact and calendar controls retain their component behavior while adopting the palette. */
html[data-theme="dark"] .appDirectMessageHint{background:var(--rs);border-color:#5a2930}
html[data-theme="dark"] .appDirectMessageHintIcon{background:var(--theme-surface);color:var(--theme-accent-text)}
html[data-theme="dark"] .appDirectMessageHint strong,
html[data-theme="dark"] .appDirectMessageLink{color:var(--theme-accent-text)!important}
@media(max-width:760px){
  html[data-theme="dark"] .wp table.contactTable tr{background:var(--theme-surface);border-color:var(--line)}
  html[data-theme="dark"] .mobileContactActions a{background:var(--soft);border-color:var(--line);color:var(--ink)!important}
  html[data-theme="dark"] .mobileContactActions a[data-app-message]{background:var(--rs);border-color:#5a2930;color:var(--theme-accent-text)!important}
}

/* Device personalization is rendered from personalization-core.js but uses the central theme palette. */
html[data-theme="dark"] .myAppSection{background:var(--theme-surface);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .myAppSectionHead p,
html[data-theme="dark"] .myAppSourceRow small,
html[data-theme="dark"] .myAppFootballRow span,
html[data-theme="dark"] .myAppQuickPick small,
html[data-theme="dark"] .myAppDeviceNote,
html[data-theme="dark"] .myAppSettingsCopy span{color:var(--mut)}
html[data-theme="dark"] .myAppSourceRow,html[data-theme="dark"] .myAppQuickPick{background:var(--soft);border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .myAppSourceRow.active,html[data-theme="dark"] .myAppQuickPick.selected{background:#281316;border-color:#653039}
html[data-theme="dark"] .myAppSourceState,html[data-theme="dark"] .myAppSourceRow.active .myAppSourceState,
html[data-theme="dark"] .myAppLink,html[data-theme="dark"] .myAppReset,html[data-theme="dark"] .personalHomeEmpty a{color:var(--theme-accent-text)}
html[data-theme="dark"] .myAppFootballRow,html[data-theme="dark"] .myAppSettingsRow{background:var(--soft)}
html[data-theme="dark"] .myAppQuickPick .qCheck{background:var(--theme-surface);border-color:var(--line)}
html[data-theme="dark"] .myAppQuickPick.selected .qCheck{background:var(--r);border-color:var(--r);color:#fff}
html[data-theme="dark"] .myAppQuickStatus{color:var(--mut)}
html[data-theme="dark"] .personalHomeEmpty p{color:var(--mut)}
html[data-theme="dark"] .homeArchiveShortcut{color:var(--mut)!important}
html[data-theme="dark"] .hero .actions .homePushCta{background:transparent;border-color:var(--line);color:var(--ink)}

/* External services keep their own light canvas; only the surrounding app shell is themed. */
html[data-theme="dark"] .embed{background:var(--theme-surface);border-color:var(--line)}
html[data-theme="dark"] .embedTop{border-color:var(--line)}
html[data-theme="dark"] .embed iframe,html[data-theme="dark"] .shopGrid iframe,html[data-theme="dark"] .serviceFormShell>.embed iframe{background:#fff;color:#111}

/* Theme selector in Meine App. */
.myAppThemePicker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.myAppThemeChoice{appearance:none;min-height:104px;padding:12px;border:1px solid var(--line);border-radius:15px;background:var(--theme-surface);color:var(--ink);display:grid;grid-template-rows:auto 1fr auto;gap:9px;text-align:left;cursor:pointer;transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease}
.myAppThemeChoice:hover{transform:translateY(-1px)}.myAppThemeChoice.active{border-color:var(--r);box-shadow:0 0 0 2px var(--theme-focus)}
.myAppThemePreview{height:34px;border-radius:10px;border:1px solid rgba(127,127,127,.18);display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}.myAppThemePreview span{display:block}
.myAppThemeChoice[data-theme-choice="standard"] .myAppThemePreview span:nth-child(1){background:#fff}.myAppThemeChoice[data-theme-choice="standard"] .myAppThemePreview span:nth-child(2){background:#f5f6f8}.myAppThemeChoice[data-theme-choice="standard"] .myAppThemePreview span:nth-child(3){background:#e30613}
.myAppThemeChoice[data-theme-choice="dark"] .myAppThemePreview span:nth-child(1){background:#0d0f12}.myAppThemeChoice[data-theme-choice="dark"] .myAppThemePreview span:nth-child(2){background:#1b1f25}.myAppThemeChoice[data-theme-choice="dark"] .myAppThemePreview span:nth-child(3){background:#e30613}
.myAppThemeChoice strong{display:block;font-size:13px}.myAppThemeChoice small{display:block;margin-top:3px;color:var(--mut);font-size:10px;line-height:1.35}.myAppThemeState{font-size:9px;font-weight:900;letter-spacing:.08em;color:var(--mut)}.myAppThemeChoice.active .myAppThemeState{color:var(--r)}
html[data-theme="dark"] .myAppThemeChoice.active .myAppThemeState{color:var(--theme-accent-text)}

@media(max-width:760px){
  .myAppThemePicker{grid-template-columns:1fr}.myAppThemeChoice{min-height:0;grid-template-columns:86px minmax(0,1fr) auto;grid-template-rows:auto;align-items:center}.myAppThemePreview{height:42px}
  html[data-theme="dark"] #main .hero{background:var(--theme-hero)}
  html[data-theme="dark"] .poweredBy{background:rgba(255,255,255,.06);border-color:var(--line)}
}