/* ==========================================================================
   Farbschema „PCC“ (wie das PCC CRM) für das ganze Tool: dunkles Navy, Rosa
   für aktive Navigation, Lila als Akzent, kühles Grau. Gilt mit
   <html class="themePcc"> (immer gesetzt, siehe index.html). Die Akzentfarbe
   eines Events (--ctAccent, Export-Fenster) bleibt erhalten.
   ========================================================================== */
html.themePcc {
  --accent: #5b4e9b;
  --accent-strong: #463b7d;
  --accent-soft: #eeebf7;
  --pink: #f2b9c4;
  --pink-soft: #fbe9ed;
  --lime: #f2b9c4;
  --ink: #22212c;
  --bg: #f6f7f9;
  --text: #22212c;
  --muted: #6b6a7a;
  --line: #e5e5ec;
  --border: #e5e5ec;
  --ring: rgba(91, 78, 155, .22);
  --shadow: 0 1px 0 rgba(34, 33, 44, .03), 0 1px 3px rgba(34, 33, 44, .05);
  --shadow-lg: 0 12px 40px rgba(34, 33, 44, .12), 0 2px 6px rgba(34, 33, 44, .06);
  /* Abstufungen – mit eigenen Club-Farben berechnet BrandTheme (js/brand-theme.js) sie neu */
  --ink-2: #2e2d3a;
  --ink-3: #3b3a48;
  --on-ink-soft: #e9e8f0;
  --on-ink-muted: #b9b8c6;
  --pink-hover: #f6cbd3;
  --on-pink: #22212c;
  --surface: #ededf2;
  --surface-soft: #f6f6f9;
  --surface-hover: #e6e6ec;
}
html.themePcc body,
html.themePcc #cloudShell { background: var(--bg); }

/* ---------- Turnier-App: Kopf in Navy wie die CRM-Seitenleiste ---------- */
html.themePcc .appHeader { background: rgba(255, 255, 255, .92); }
html.themePcc .hdrTop { background: var(--ink); color: #fff; }
html.themePcc .hdrTop .brandMark .sub,
html.themePcc .hdrTop .cloudStatus { color: var(--on-ink-muted); }
html.themePcc .hdrTop .brandMark .dot img { background: var(--ink-2); }
html.themePcc .hdrTop .btn.ghost { color: var(--on-ink-soft); }
html.themePcc .hdrTop .btn.ghost:hover { background: rgba(255, 255, 255, .08); }
html.themePcc .hdrTop .btn.ghost .ic { color: inherit; }
html.themePcc .hdrTop .cEventBtn { background: var(--ink-2); border-color: var(--ink-3); color: #fff; }
html.themePcc .hdrTop .cEventBtn:hover { border-color: var(--pink); }
html.themePcc .hdrTop .exportBtn { background: var(--pink); color: var(--on-pink); box-shadow: none; }
html.themePcc .hdrTop .exportBtn:hover { background: var(--pink-hover); }
html.themePcc .hdrTop .exportBtn .ic { color: var(--on-pink); }
html.themePcc .hdrTournaments { background: var(--surface-soft); }

/* Tabs: rosa Pille wie der aktive Menüpunkt im CRM */
html.themePcc .tabBtn { border-radius: 10px; margin: 6px 0; padding: 8px 12px; }
html.themePcc .tabBtn::after { display: none; }
html.themePcc .tabBtn:hover:not(.active) { background: var(--surface-hover); }
html.themePcc .tabBtn.active { background: var(--pink); color: var(--on-pink); }
html.themePcc .tabBtn .tabNum { background: var(--surface-hover); }
html.themePcc .tabBtn.active .tabNum { background: var(--ink); color: #fff; }

/* Buttons und Flächen */
html.themePcc .btn { box-shadow: 0 1px 0 rgba(255, 255, 255, .14) inset, 0 1px 2px rgba(70, 59, 125, .3); }
html.themePcc .btn:hover:not(.secondary):not(.ghost):not(.danger) { background: var(--accent-strong); border-color: var(--accent-strong); }
html.themePcc .btn.secondary { border-color: #dcdce4; }
html.themePcc .btn.secondary:hover { background: var(--surface-soft); border-color: #c4c3d0; }
html.themePcc .btn.ghost:hover { background: var(--surface); }
html.themePcc .card { border-radius: 20px; }
html.themePcc .menuPop .menuItem:hover { background: var(--surface-soft); }

/* ---------- Übersicht (Events, Serien, Spieler) ---------- */
/* Kopfband über die volle Breite (Inhalt bleibt in der Spalte) */
html.themePcc .cDashHead { background: var(--ink); color: #fff; box-shadow: 0 0 0 100vmax var(--ink); clip-path: inset(0 -100vmax); }
html.themePcc .cDashHead .cBrandSub,
html.themePcc .cDashHead .cUser { color: var(--on-ink-muted); }
html.themePcc .cDashHead .cBrandMark { background: var(--ink-2); }
html.themePcc .cDashHead .cIconBtn { color: var(--on-ink-soft); }
html.themePcc .cDashHead .cIconBtn:hover { background: rgba(255, 255, 255, .08); }
html.themePcc .cDashHead .btn.secondary { background: var(--ink-2); border-color: var(--ink-3); color: #fff; box-shadow: none; }
html.themePcc .cTabs { border-bottom: 0; gap: 6px; margin-top: 16px; }
html.themePcc .cTabs button { border-radius: 10px; border-bottom: 0; margin-bottom: 0; padding: 9px 14px; }
html.themePcc .cTabs button:hover { background: var(--surface); }
html.themePcc .cTabs button.on { background: var(--pink); color: var(--on-pink); }
html.themePcc .cCard { border-radius: 20px; }
html.themePcc .cCard:hover { border-color: #d3d2dd; }
html.themePcc .cChip.live, html.themePcc .cMyRank { background: var(--pink); color: var(--on-pink); }
html.themePcc .cPfSection { border-radius: 20px; }
html.themePcc .cPfAvatar { background: var(--accent-soft); color: var(--accent); }
html.themePcc .cScope { background: var(--surface); }

/* ---------- Anmeldung / Spieler-Bereich ---------- */
html.themePcc .cAuthCard { border-radius: 20px; position: relative; overflow: hidden; }

/* ---------- Kühles Grau statt der warmen Beigetöne ---------- */
html.themePcc .abLogo, html.themePcc .cOrgLogo, html.themePcc .playerList input.playerNameEdit:hover,
html.themePcc button.akToggle, html.themePcc .emptyIcon, html.themePcc .pill, html.themePcc .cChip,
html.themePcc .cGroupLabel span, html.themePcc .cPfBadge.off, html.themePcc .cAuth code { background: var(--surface); }
html.themePcc .note { background: var(--surface-soft); border-left-color: #cfcedb; color: #565566; }
html.themePcc .collapsibleSection .sectionHead:hover, html.themePcc table.standings tbody tr:hover { background: var(--surface-soft); }
html.themePcc .collapsibleSection.subSection, html.themePcc .emptyState, html.themePcc .bulkBox { background: var(--surface-soft); border-color: #dcdce4; }
html.themePcc .match, html.themePcc table.standings td, html.themePcc table.standings th { border-color: #ececf1; }
html.themePcc .statusPill.draft { background: var(--surface); color: var(--muted); }
html.themePcc .pill { color: #6b6a7a; }
html.themePcc .cChip.st-FINISHED { background: var(--accent-soft); color: var(--accent-strong); }
html.themePcc .cChip.st-LIVE { background: #fde8e7; }
html.themePcc .cChip.cur { background: var(--ink); }
html.themePcc .genCard .note { background: none; }
html.themePcc input[type=text], html.themePcc input[type=url], html.themePcc input[type=email], html.themePcc input[type=tel],
html.themePcc input[type=date], html.themePcc input[type=datetime-local], html.themePcc input[type=number], html.themePcc input[type=time],
html.themePcc input[type=password], html.themePcc input[type=search], html.themePcc input[type=color], html.themePcc select, html.themePcc textarea,
html.themePcc .timeStepBtn, html.themePcc .formatChoice label, html.themePcc .manualPickRow { border-color: #dcdce4; }
html.themePcc input:hover:not(:disabled):not(:focus), html.themePcc select:hover:not(:disabled):not(:focus), html.themePcc textarea:hover:not(:focus) { border-color: #c4c3d0; }
html.themePcc input:focus, html.themePcc select:focus, html.themePcc textarea:focus { border-color: var(--accent); }
/* Namensfelder in der Teilnehmerliste bleiben rahmenlos (Rahmen nur beim Bearbeiten) */
html.themePcc .playerList input.playerNameEdit:not(:focus) { border-color: transparent; }

/* ---------- Öffentliche Seiten: Anmeldung, Partner-Link, Abmeldung, Court, Live ---------- */
html.themePcc .cRegForm, html.themePcc .cCtCard.cRegDone { border-radius: 20px; position: relative; overflow: hidden; padding-top: 20px; }
html.themePcc .cRegForm input[type=text], html.themePcc .cRegForm input[type=email], html.themePcc .cRegForm input[type=tel],
html.themePcc .cRegForm select, html.themePcc .cRegForm textarea { background: #fff; border-color: #dcdce4; border-radius: 12px; }
html.themePcc .cRegForm input:focus, html.themePcc .cRegForm select:focus, html.themePcc .cRegForm textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); outline: none; }
html.themePcc .cRegInfo, html.themePcc .cCtLine, html.themePcc .cCtEmpty { border-radius: 14px; }
html.themePcc .cCtT { background: var(--surface); }
html.themePcc .cLiveTabs button.on { background: var(--pink); color: var(--on-pink); }
html.themePcc .cOrgEv { border-color: var(--line); border-radius: 16px; }
html.themePcc .cOrgEv:hover { border-color: var(--accent); }
html.themePcc .cOrgEv.live { border-color: var(--accent); box-shadow: 0 0 0 3px var(--ring); }
html.themePcc .cOrgEv.live .cOrgSt, html.themePcc .cOrgGo { color: var(--accent); }
html.themePcc .cPbCard { border-radius: 20px; }

/* ---------- Barrierefreiheit (Backlog Punkt 10) ---------- */
/* Deutlicher Fokusrahmen bei Tastaturbedienung (nicht bei Klick/Tipp) */
html.themePcc :where(button, a[href], summary, [role=button], [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid var(--accent); outline-offset: 2px;
}
/* Kontrast mind. 4,5:1 (WCAG AA) für kleine Hinweise in der Teilnehmerliste und den Reitern */
html.themePcc .tournamentTab .tFormat { color: #4a5f58; }
html.themePcc .tabBtn:not(.active) .tabNum { color: #4b4a59; }
html.themePcc .formOr, html.themePcc .playerList button.ptLevel.empty { color: #6a695e; }
html.themePcc .playerList button.akToggle:not(.active) { opacity: 1; color: #57615d; }