/*
Theme Name: Turnier Theme (leicht)
Theme URI:  https://example.local/turnier-theme
Author:      Ihr Name
Description: Sehr resourcenschonendes, blau-weißes Theme für Turnier-Listen.
Version:     1.0
License:     GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: turnier-theme
Tags: light, accessibility, responsive
*/

/* Basis-Reset und Layout */
:root{
  --bg: #ffffff;
  --accent: #0b66d1; /* blau */
  --text: #0b2338;
  --muted: #6b7a89;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial; color:var(--text); background:var(--bg);}

.site{max-width:980px;margin:28px auto;padding:18px}
.site-header{display:flex;align-items:center;gap:12px}
.site-title{font-size:1.4rem;color:var(--accent);margin:0}
.site-description{color:var(--muted);font-size:.95rem;margin:0}
/* header user info right alignment override if header injected in template */
.site-header .user-info{color:var(--text);font-weight:700}

.card{border:1px solid rgba(11,102,209,0.12);padding:14px;border-radius:8px;background:rgba(11,102,209,0.03)}

.starter-liste{margin-top:16px}
.starter-item{display:flex;justify-content:space-between;padding:10px 8px;border-bottom:1px dashed rgba(11,102,209,0.06)}
.starter-item:last-child{border-bottom:0}
.starter-name{font-weight:600}
.starter-punkte{color:var(--accent);font-weight:700}

.notice{padding:12px;border-radius:6px;background:#fff4f0;border:1px solid #ffd8cc;color:#6a3b24}

.login-wrap{max-width:360px}

/* kleine responsive Anpassung */
@media (max-width:520px){.site{margin:18px;padding:12px}}

/* Editor controls */
.tt-editor-controls{display:flex;gap:8px;align-items:flex-end;margin-top:6px}
.tt-editor-controls select{padding:10px 12px;border-radius:8px;border:1px solid rgba(11,102,209,0.15);width:100%;font-size:1rem;background:#fff;transition:border-color .2s ease}
.tt-editor-controls select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(11,102,209,0.1)}
.tt-editor-controls button{padding:8px 10px;border-radius:6px;border:0;background:var(--accent);color:#fff;cursor:pointer}
.tt-editor-controls button[disabled]{opacity:.6;cursor:not-allowed}

/* Button styling under dropdown */
#tt-set-current-btn,#tt-clear-current-btn{padding:12px 24px;border-radius:8px;font-size:1rem;font-weight:600;border:0;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
#tt-set-current-btn{background:var(--accent);color:#fff}
#tt-set-current-btn:hover{background:#0952ab;transform:translateY(-1px);box-shadow:0 4px 8px rgba(11,102,209,0.3)}
#tt-set-current-btn:active{transform:translateY(0);box-shadow:0 2px 4px rgba(0,0,0,0.1)}
#tt-clear-current-btn{background:#f0f4f8;color:var(--text);border:1px solid rgba(11,102,209,0.15)}
#tt-clear-current-btn:hover{background:#e5eaf0;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,0.15)}
#tt-clear-current-btn:active{transform:translateY(0);box-shadow:0 2px 4px rgba(0,0,0,0.1)}
#tt-set-current-btn:disabled,#tt-clear-current-btn:disabled{opacity:.5;cursor:not-allowed;transform:none !important}

/* Icon-style buttons for current dancer controls (small, inline) */
.tt-icon-btn{background:transparent;border:0;padding:6px 8px;border-radius:8px;cursor:pointer;font-size:1.15rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
.tt-icon-btn:hover{background:rgba(11,102,209,0.06);color:var(--text)}
/* Override ID-based rules when using the icon button class */
#tt-set-current-btn.tt-icon-btn, #tt-clear-current-btn.tt-icon-btn { background:transparent !important; color:var(--muted) !important; border:0 !important; box-shadow:none !important; padding:6px !important; min-width:36px !important; min-height:36px !important; }

/* Certificate group select */
#tt-certificate-group{padding:10px 12px;border-radius:8px;border:1px solid rgba(11,102,209,0.15);font-size:1rem;background:#fff;transition:border-color .2s ease;width:auto;min-width:200px}
#tt-certificate-group:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(11,102,209,0.1)}

/* Übersicht Button */
#tt-show-uebersicht{cursor:pointer;transition:background .2s ease}
#tt-show-uebersicht:hover{background:rgba(11,102,209,0.08)}

/* Current info styling: make the wrapper visually neutral so the card inside appears directly
  (we keep an element for JS hooks but remove visual chrome). */
#tt-current-info{padding:0;background:transparent;border:none;margin-top:8px}

/* Toolbar heading: when used inside the editor controls, don't show framed heading */
.tt-editor-controls .tt-rating-title{border:none;background:transparent;padding:0;margin:0 0 8px 0;font-size:1.05rem}

/* Auswertung */
.tt-auswertung{margin-top:12px}
.tt-auswertung h3{margin:0 0 12px 0;font-size:1.1rem}
.tt-gruppe{margin-bottom:20px}
.tt-gruppe h4{margin:0 0 10px 0;font-size:1rem;color:var(--accent);border-bottom:1px solid rgba(11,102,209,0.1);padding-bottom:5px}
.tt-auswertung-card{background:#fff;border:1px solid rgba(11,102,209,0.1);border-radius:8px;padding:10px;margin-bottom:8px;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.tt-auswertung-header{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.tt-platz{font-size:1.5rem;font-weight:800;color:var(--accent);min-width:40px;text-align:center}
.tt-auswertung-title{font-size:1rem;margin-bottom:4px;flex:1}
.tt-auswertung-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:0.8rem;color:var(--muted);margin-top:4px}
.tt-auswertung-total-box{display:flex;align-items:center;gap:6px;background:#e9f2ff;border:1px solid #0b66d1;border-radius:6px;padding:6px 10px;margin-left:auto}
.tt-auswertung-total-box .tt-total-label{font-size:0.78rem;color:var(--muted)}
.tt-auswertung-total-box .tt-total-value{font-size:1.05rem;font-weight:700;color:#0b2338}

/* (Removed legacy #tt-current-results styles - current dancer card styles are in .tt-current-dancer-card) */

/* Übersicht (compact cards) */
.tt-uebersicht-card{background:#fff;border:1px solid rgba(11,102,209,0.08);border-radius:10px;padding:10px;margin-bottom:8px;box-shadow:0 2px 8px rgba(2,6,23,0.04);transition:transform .18s ease,box-shadow .18s ease,opacity .24s ease;opacity:1;transform:none;will-change:transform,opacity}
.tt-uebersicht-card.visible{opacity:1;transform:none}
.tt-uebersicht-header{display:flex;align-items:center;gap:8px}
.tt-uebersicht-chips{display:flex;gap:6px;align-items:center;margin-right:8px}
.tt-count-chip{background:#fff6e6;border:1px solid rgba(0,0,0,0.06);color:var(--muted);padding:4px 8px;border-radius:999px;font-weight:700}
.tt-uebersicht-title{
  /* allow the name to wrap so long names don't hide the settings button */
  flex:1 1 0%;
  min-width:0; /* allow flex children to shrink properly */
  display:flex;
  align-items:center;
  gap:8px;
  font-size:1rem;
  white-space:normal;
  word-break:break-word;
}
.tt-uebersicht-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:0.85rem;color:var(--muted);align-items:center}
.tt-uebersicht-scores{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}

/* einzelne Juror-Kärtchen */
.tt-score-item{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;padding:6px 8px;min-width:64px;border-radius:8px;background:linear-gradient(180deg,#fbfdff,#f4f8ff);border:1px solid rgba(11,102,209,0.06);box-shadow:0 1px 4px rgba(11,102,209,0.04);transition:transform .16s ease,box-shadow .16s ease}
.tt-score-item:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(11,102,209,0.08)}
.tt-score-item .tt-author-name{font-size:0.78rem;line-height:1;color:var(--muted);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}
.tt-score-item .tt-score-value{font-weight:800;margin-top:6px;font-size:1.05rem;color:var(--accent)}

/* subtle shimmer for loading state (resource-friendly) */
.tt-shimmer{background:linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%);background-size:200% 100%;animation:shimmer 1.6s linear infinite}
@keyframes shimmer{from{background-position:-100% 0}to{background-position:100% 0}}

/* small responsive tweaks */
@media (max-width:520px){
  .tt-score-item .tt-author-name{max-width:56px;font-size:0.72rem}
  .tt-score-item{min-width:48px;padding:4px 6px}
}

/* Rating area */
#tt-rating-area{margin-top:16px}
.tt-import-result{margin-top:10px;padding:10px;background:#f4faff;border:1px solid rgba(11,102,209,0.06);border-radius:6px}

.tt-rating-grid{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start}
.tt-rating-item{width:calc(20% - 10px);min-width:120px;display:flex;flex-direction:column;align-items:center}
@media (max-width:768px){.tt-rating-item{width:calc(33.333% - 8px);min-width:110px}}
@media (max-width:520px){.tt-rating-item{width:calc(50% - 6px);min-width:100px}}

.tt-circle{width:88px;height:88px;border-radius:50%;background:#f0f4f8;border:2px solid rgba(11,102,209,0.06);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--muted);box-shadow:0 2px 6px rgba(2,6,23,0.04);cursor:pointer;transition:all .18s ease;font-size:1.6rem}
.tt-circle.empty{background:repeating-linear-gradient(45deg,#ff9800,#ff9800 4px,#ffb74d 4px,#ffb74d 8px);color:#fff;border-color:#ff9800;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.tt-circle.selected{background:var(--accent);color:#fff;border-color:rgba(11,102,209,0.18);box-shadow:0 6px 18px rgba(11,102,209,0.18);font-size:1.85rem}
.tt-circle:hover{transform:translateY(-4px)}
.tt-circle-label{margin-top:8px;font-size:1rem;color:var(--muted);text-align:center}

/* Picker overlay for numbers 0..15 */
.tt-score-picker{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top-left-radius:12px;border-top-right-radius:12px;padding:12px 14px;box-shadow:0 -8px 24px rgba(2,6,23,0.12);z-index:9999}
.tt-score-picker .row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.tt-score-btn{min-width:56px;min-height:56px;padding:12px;border-radius:10px;border:1px solid rgba(11,102,209,0.08);background:#f7fbff;color:var(--text);font-weight:800;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem}
.tt-score-btn.large{min-width:72px;min-height:72px;border-radius:12px;font-size:1.25rem}
.tt-score-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.tt-score-picker .close{display:block;text-align:center;margin-top:10px;color:var(--muted);cursor:pointer}

/* form submit */
#tt-rating-form button[type="submit"]{margin-top:12px;background:var(--accent);color:#fff;border:0;padding:10px 14px;border-radius:8px;cursor:pointer}

/* small helper */
.tt-helper{font-size:0.9rem;color:var(--muted);margin-top:8px}

/* Tänzer Meta block in rating form */
.tt-taenzer-meta{margin-bottom:10px;padding:8px 10px;border-radius:6px;background:rgba(11,102,209,0.03);font-size:0.95rem;color:var(--text)}
.tt-taenzer-meta div{margin:2px 0}

/* rating header with chips */
.tt-rating-header{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;margin-bottom:8px}
.tt-chip-list{display:flex;gap:8px;align-items:center}
.tt-chip{background:#e9f2ff;border:1px solid rgba(11,102,209,0.12);padding:4px 8px;border-radius:999px;font-size:0.85rem;font-weight:700;color:var(--text)}
.tt-chip .chip-label{font-weight:700;margin-right:6px}

/* Footer for rating form: total + submit */
.tt-form-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.tt-total-display{font-weight:800;color:var(--accent);background:#e9f2ff;border:1px solid rgba(11,102,209,0.08);padding:6px 10px;border-radius:8px}

@media (max-width:520px){
  .tt-form-footer{flex-direction:column;align-items:stretch}
  .tt-total-display{width:100%;text-align:left;margin-bottom:8px}
  #tt-rating-form button[type="submit"]{width:100%}
}

/* Jury criteria list: one row per criterion, label left, buttons right */
.tt-crit-list{display:flex;flex-direction:column;gap:8px}
.tt-crit-row{display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:10px;border-radius:8px;background:rgba(11,102,209,0.02);border:1px solid rgba(11,102,209,0.09);box-shadow:0 1px 3px rgba(11,102,209,0.03)}
.tt-crit-label{flex:0 0 28%;font-weight:700;color:orange;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:8px}
.tt-crit-buttons{flex:1;display:flex;gap:6px;flex-wrap:nowrap;justify-content:flex-start;align-items:center;overflow-x:auto;padding-bottom:2px}
.tt-crit-buttons::-webkit-scrollbar{height:8px}
.tt-crit-buttons::-webkit-scrollbar-thumb{background:rgba(11,102,209,0.12);border-radius:6px}
.tt-crit-button{padding:6px 8px;border-radius:8px;border:1px solid rgba(0,0,0,0.06);background:#f0f4f8;color:var(--text);cursor:pointer;font-weight:700;min-width:30px;font-size:0.95rem}
.tt-crit-button.tt-crit-zero{opacity:0.95;font-weight:700;min-width:30px;padding:6px 8px;font-size:0.95rem}
.tt-crit-value{display:inline-flex;align-items:center;justify-content:center;min-width:36px;padding:6px 8px;border-radius:8px;border:1px solid rgba(11,102,209,0.08);margin-left:8px;color:transparent;background:transparent;font-weight:800}
.tt-crit-value.selected{color:var(--accent);background:#e9f2ff;border-color:var(--accent);box-shadow:0 4px 14px rgba(11,102,209,0.08)}
.tt-crit-button:hover{background:#e6eefb}
.tt-crit-button.selected{background:#2e7d32;color:#fff;border-color:#2e7d32}
.tt-crit-row .tt-crit-label.selected{color:var(--accent)}

@media (max-width:880px){
  .tt-crit-label{flex:0 0 32%}
}

@media (max-width:520px){
  /* Auf sehr kleinen Bildschirmen: Label oben, Buttons darunter, aber Buttons dürfen horizontal scrollen */
  .tt-crit-row{flex-direction:column;align-items:flex-start}
  .tt-crit-label{flex:0 0 auto;width:100%;margin-bottom:6px}
  .tt-crit-buttons{justify-content:flex-start}
}

/* Header layout adjustments */
.wrap{display:flex;justify-content:space-between;align-items:center}
.tt-header-left{display:flex;flex-direction:column}
.tt-header-right{display:flex;align-items:center;gap:12px}

/* Heading styles: capitalize, slightly larger and framed */
.site-title{font-size:1.6rem;color:var(--accent);margin:0;text-transform:capitalize}
.tt-rating-title{font-size:1.15rem;margin:0;padding:6px 10px;border:1px solid rgba(11,102,209,0.08);background:#f7fbff;border-radius:6px;flex:1}
.tt-uebersicht h3{font-size:1.18rem;padding:8px 10px;border:1px solid rgba(11,102,209,0.08);background:#f7fbff;border-radius:6px;margin-bottom:12px;text-transform:capitalize}

/* Chip label styling: show label and value concisely */
.tt-chip{display:inline-flex;align-items:center;gap:6px}
.tt-chip .chip-key{font-size:0.75rem;color:var(--muted);font-weight:600}
.tt-chip .chip-val{font-weight:700}

/* Utility helpers used by script.js */
.hidden{display:none !important}

/* Submit button class (used when script creates button element) */
.tt-submit-btn{margin-top:12px;background:var(--accent);color:#fff;border:0;padding:10px 14px;border-radius:8px;cursor:pointer}

/* Privacy mode: mute colors for criteria buttons */
.tt-privacy-mode .tt-crit-button{background:#f0f0f0;color:#666;border:1px solid #ccc}
.tt-privacy-mode .tt-crit-button.selected{background:#dcdcdc;color:#333;border-color:#bdbdbd}

/* Übersicht specifics */
.tt-uebersicht-total-row{display:flex;align-items:center;margin-top:6px}
.tt-uebersicht-total-box{display:flex;align-items:center;gap:6px;background:#e9f2ff;border:1px solid #0b66d1;border-radius:6px;padding:6px 10px;margin-left:auto}
.tt-uebersicht-total-box .tt-total-label{font-size:0.78rem;color:var(--muted)}
.tt-uebersicht-total-box .tt-total-value{font-size:1.05rem;font-weight:700;color:#0b2338}

.tt-score-missing .tt-score-value{color:var(--muted);font-weight:700}
.tt-score-present{ /* leaves default accent color as defined in .tt-score-item .tt-score-value */ }

/* small visual polish for selected crit-value */
.tt-crit-value.hidden{color:transparent;background:transparent;border-color:transparent}

/* Small control buttons (sort) and active state */
.card.small{padding:6px 10px;border-radius:8px;background:#f4f8ff;border:1px solid rgba(11,102,209,0.08);font-size:0.9rem;font-weight:700;cursor:pointer;transition:all .15s ease;display:inline-flex;align-items:center;gap:6px}
.card.small:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(11,102,209,0.06)}
.card.small.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 8px 26px rgba(11,102,209,0.14)}
.card.small.active:hover{transform:none}

/* Checkbox styling: use native accent-color where supported, otherwise fall back */
#tt-show-platz{width:18px;height:18px;margin:0;vertical-align:middle;accent-color:var(--accent);cursor:pointer}
label[for="tt-show-platz"]{display:inline-flex;align-items:center;gap:8px;cursor:pointer}

/* Ensure inline platz label looks consistent */
.tt-platz-inline{font-weight:800;color:var(--accent);margin-left:6px}

/* Compact chips for Übersicht/Auswertung: place to the right of the name */
.tt-uebersicht-header, .tt-auswertung-header {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tt-uebersicht-title {
  /* allow title area to grow and wrap on small screens so the settings button remains visible */
  flex: 1 1 0%;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:normal;
}
.tt-uebersicht-chips-right {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-start; /* left-align chips within their area */
  flex: 0 0 auto; /* don't grow; stay to the right of the title */
  margin-left: auto; /* push this group to the right edge */
  flex-wrap: wrap; /* allow wrapping on small screens */
  text-align: left;
}
.tt-chip {
  background: #f3f4f6;
  color: #111;
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 0.82rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.tt-chip-meta { background: #f4f7f3; color: #0b5132; }
.tt-count-chip { background: #e8f2ff; color: #0b57a6; font-weight:600; }
.tt-chip .chip-val { display: inline-block; padding: 0 0; }

/* reduce spacing for chips in compact cards */
.tt-uebersicht-card .tt-uebersicht-chips-right .tt-chip{padding:3px 6px;font-size:0.8rem;border-radius:10px}

/* Verein chip placed immediately after the name */
.tt-chip-verein{margin-left:8px;background:#fff7f0;color:#6a3b24;padding:3px 6px;border-radius:8px;font-size:0.82rem;border:1px solid rgba(0,0,0,0.04)}

/* small settings button next to verein chip */
.tt-open-settings{margin-left:6px;border:0;background:transparent;cursor:pointer;font-size:0.95rem;padding:6px 8px;border-radius:6px;color:var(--muted);flex:0 0 auto}
.tt-open-settings:hover{background:rgba(11,102,209,0.06);color:var(--text)}

/* Modal overlay and modal styles */
.tt-modal-overlay{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(2,6,23,0.45);display:flex;align-items:center;justify-content:center;z-index:99999;padding:20px}
.tt-modal{background:#fff;border-radius:12px;max-width:720px;width:100%;box-shadow:0 20px 60px rgba(2,6,23,0.5);overflow:hidden;border:1px solid rgba(2,6,23,0.06)}
.tt-modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid rgba(2,6,23,0.04)}
.tt-modal-header h3{margin:0;font-size:1.1rem}
.tt-modal-close{background:transparent;border:0;font-size:1.1rem;cursor:pointer}
.tt-modal-body{padding:18px;max-height:60vh;overflow:auto}
.tt-modal-body form{display:flex;flex-direction:column;gap:10px}
.tt-modal-body label{display:flex;flex-direction:column;font-size:0.95rem;color:var(--muted)}
.tt-modal-body input[type="text"], .tt-modal-body input[type="number"]{padding:8px 10px;border-radius:8px;border:1px solid rgba(2,6,23,0.06);font-size:1rem}
.tt-modal-footer{padding:12px 18px;border-top:1px solid rgba(2,6,23,0.04);display:flex;align-items:center}
.tt-modal-actions{display:flex;align-items:center;width:100%;gap:10px}
.tt-btn{padding:8px 12px;border-radius:8px;border:1px solid rgba(2,6,23,0.06);background:#f4f6f8;cursor:pointer}
.tt-btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.tt-btn-danger{background:#fff6f6;color:#8b1e1e;border:1px solid rgba(139,30,30,0.08)}
.tt-confirm-summary{white-space:pre-wrap;background:#f7f7f7;padding:12px;border-radius:8px}

/* Criteria circle grid used in juror-detail modal */
.tt-circle-grid{display:flex;flex-wrap:wrap;gap:10px}
.tt-crit-circle{width:84px;height:84px;border-radius:50%;background:#f7fbff;border:1px solid rgba(11,102,209,0.06);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;box-shadow:0 6px 18px rgba(11,102,209,0.04);transition:transform .18s ease,opacity .18s ease}
.tt-crit-circle .val{font-weight:800;color:var(--accent);font-size:1.15rem}
.tt-crit-circle .label{font-size:0.72rem;color:var(--muted);margin-top:6px;text-align:center}
.tt-crit-circle{opacity:0;transform:translateY(6px);animation:tt-crit-fade .36s forwards}
.tt-crit-circle[style*="--anim-delay"]{animation-delay:var(--anim-delay)}
@keyframes tt-crit-fade{to{opacity:1;transform:none}}

/* confirmation modal slight variations */
.tt-modal-confirm{max-width:520px}

/* Toast notifications */
.tt-toast-container{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;z-index:120000;max-width:360px}
.tt-toast{background:#fff;border-radius:8px;padding:10px 14px;box-shadow:0 6px 20px rgba(2,6,23,0.18);border:1px solid rgba(2,6,23,0.06);color:#0b2338;font-weight:600;opacity:1;transform:none;transition:all .35s ease}
.tt-toast-info{background:#f7fbff;border-left:4px solid var(--accent)}
.tt-toast-success{background:#f3fff6;border-left:4px solid #2e7d32;color:#0b4b2f}
.tt-toast-error{background:#fff6f6;border-left:4px solid #b71c1c;color:#7a1e1e}
.tt-toast-hide{opacity:0;transform:translateY(8px)}

/* Field error inside modal */
.tt-field-error{color:#8b1e1e;font-size:0.92rem;margin-top:6px}

/* Ensure the main name text can shrink/wrap without pushing the settings button out of view */
.tt-uebersicht-title strong{flex:1 1 0;min-width:0;word-break:normal;overflow-wrap:break-word}

/* Make startnr, name and verein resistant to collapsing on small screens.
   Provide sensible min-widths so names don't break letter-by-letter; the
   name (strong) may still wrap at word boundaries but not at single chars. */
.tt-startnr{flex:0 0 auto;min-width:48px;margin-right:6px}
.tt-chip-verein{flex:0 0 auto;min-width:64px}

@media (max-width:520px){
  /* on small phones slightly reduce name font and min-widths */
  .tt-startnr{min-width:40px}
  .tt-chip-verein{min-width:56px}
  .tt-uebersicht-title strong{min-width:110px;font-size:0.95rem}
}

@media (max-width:380px){
  /* very small screens: allow name to be a bit smaller to fit */
  .tt-uebersicht-title strong{min-width:90px;font-size:0.9rem}
  .tt-chip-verein{min-width:48px}
}

/* Responsive adjustments for the control row beside #tt-bericht-titel */
#tt-bericht-titel + div{display:flex;align-items:center;justify-content:space-between;gap:8px}
#tt-bericht-titel + div > div{display:flex;gap:8px;align-items:center}

@media (max-width:720px){
  /* Stack controls vertically on small screens */
  #tt-bericht-titel + div{flex-direction:column;align-items:stretch}
  #tt-bericht-titel + div > div{width:100%;justify-content:space-between;flex-wrap:wrap}
  #tt-bericht-titel + div > div:first-child{margin-bottom:8px}
  /* make certificate select shrink-friendly */
  #tt-certificate-group{min-width:120px;max-width:60%;flex:1}
  #tt-generate-certificates{flex:0 0 auto}
  .card.small{flex:0 0 auto}
}

@media (max-width:420px){
  /* On very small screens, make buttons wrap and shrink a bit */
  #tt-bericht-titel + div > div{gap:6px}
  .card.small{padding:6px 8px;font-size:0.85rem}
  #tt-certificate-group{max-width:100%}
}

/* Section break between current dancer info and the overview / evaluations
  Reduced height so the Auswertung section appears closer to the controls.
*/
.tt-section-break{height:6px}
@media (max-width:720px){ .tt-section-break{height:6px} }

/* Reduce extra top margin for the overview area (overrides inline styles)
  to avoid stacking excessive gaps when combined with the section-break. */
#tt-uebersicht-area{margin-top:8px !important}

/* Global animation container (used by animation.js) */
.tt-global-anim{position:fixed;left:0;right:0;top:0;bottom:0;pointer-events:none;z-index:0;overflow:hidden}
.tt-global-anim canvas{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
/* On very small screens reduce intensity by limiting visual height slightly */
@media (max-width:720px){ .tt-global-anim{height:72vh} }

/* Animation controls (top-right) */
/* Controls moved to bottom-left and slightly smaller */
.tt-anim-controls{display:none}
.tt-anim-btn{background:linear-gradient(180deg,rgba(255,255,255,0.98),rgba(252,250,244,0.96));border-radius:8px;padding:4px 6px;border:1px solid rgba(2,6,23,0.06);box-shadow:0 6px 18px rgba(2,6,23,0.06);cursor:pointer;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:6px;font-size:0.82rem;min-width:44px;min-height:36px;justify-content:center}
.tt-anim-btn svg{width:12px;height:12px}
.tt-anim-btn.toggle-on{background:linear-gradient(180deg,#fff8e0,#fff3d6);border-color:rgba(255,195,60,0.22)}
.tt-anim-btn:focus{outline:3px solid rgba(11,102,209,0.12);outline-offset:2px}

/* hide animation container when turned off */
body.tt-anim-disabled .tt-global-anim{display:none}

/* Fullscreen body modifier: remove site chrome when fullscreen requested */
body.tt-anim-fullscreen #wpadminbar{display:none !important}

/* Generic small toggle button (used in forms) - match visual style of .tt-anim-btn */
.tt-toggle-btn{background:linear-gradient(180deg,rgba(255,255,255,0.98),rgba(252,250,244,0.96));border-radius:8px;padding:6px 8px;border:1px solid rgba(2,6,23,0.06);box-shadow:0 6px 18px rgba(2,6,23,0.06);cursor:pointer;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:8px;font-size:0.88rem;min-width:44px;min-height:36px;justify-content:center}
.tt-toggle-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(2,6,23,0.08)}
.tt-toggle-btn:active{transform:translateY(0)}
.tt-toggle-btn:focus{outline:3px solid rgba(11,102,209,0.12);outline-offset:2px}
.tt-toggle-btn.toggle-on{background:linear-gradient(180deg,#fff8e0,#fff3d6);border-color:rgba(255,195,60,0.22)}

/* Specific variants keep semantic class names for future icon tweaks
  (pseudo-element icons removed to avoid doubling when JS injects icons) */
.tt-privacy-btn::before{content:'';}
.tt-fullscreen-btn::before{content:'';}

/* Fix: ensure buttons in the footer/top controls align and have equal spacing */
.tt-button-group{display:flex;align-items:center;flex-wrap:wrap}
.tt-button-group > * { margin-left:8px; }
.tt-button-group > *:first-child { margin-left:0; }

/* Normalize visual dimensions for small toggle/anim buttons */
.tt-button-group .tt-toggle-btn,
.tt-button-group .tt-anim-btn,
#tt-top-controls-section .tt-anim-btn {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  vertical-align:middle !important;
  min-height:36px;
  height:36px;
  padding:6px 10px !important;
  line-height:1 !important;
  font-size:0.95rem !important;
}

/* Ensure submit stays visually consistent with icon buttons */
.tt-button-group .tt-submit-btn { margin-left:8px; }

/* Ensure top controls use same baseline size for consistency */
#tt-top-controls-section .tt-toggle-btn{padding:6px 10px;font-size:0.92rem}

/* Ensure main content lays above canvas */
main, .site, .card { position: relative; z-index: 2; }

/* Prevent group titles and selects from breaking letter-by-letter on small screens */
#tt-bericht-titel{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tt-certificate-group, #tt-certificate-group option{white-space:nowrap}
.tt-gruppe h4{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media (max-width:420px){
  #tt-bericht-titel{font-size:1rem}
  .tt-gruppe h4{font-size:0.95rem}
}

/* On small screens move the chips (Verein/Kategorie/count) to a second row
   below the name instead of shrinking the name. The chips are full-width
   and left-aligned to improve readability. */
@media (max-width:520px){
  .tt-uebersicht-header, .tt-auswertung-header { flex-wrap:wrap; align-items:flex-start; }
  .tt-uebersicht-title { flex: 1 1 100%; min-width:0; }
  .tt-uebersicht-chips-right { order: 2; width: 100%; margin-left: 0; justify-content: flex-start; padding-top:6px; gap:8px }
  .tt-chip-verein { order: 1; }
  .tt-open-settings { order: 3; margin-left:0; }
}

@media (max-width:380px){
  .tt-uebersicht-chips-right { gap:6px }
}

/* Wrap chips and control buttons on tablet / <=10" devices (approx. 1024px)
   so each chip/button moves to the next line when horizontal space is low. */
@media (max-width:800px) {
  .tt-uebersicht-header,
  .tt-auswertung-header,
  .tt-gruppen-header,
  .tt-uebersicht .tt-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }

  .tt-uebersicht-chips,
  .tt-uebersicht-chips-right,
  .tt-chip-list,
  .tt-button-group,
  .tt-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }

  /* When wrapping occurs, move right-side chips/buttons to their own line */
  .tt-uebersicht-chips-right { width: 100%; justify-content: flex-start; margin-left: 0; }
  .tt-button-group { width: 100%; justify-content: flex-start; margin-top: 6px; }

  /* Allow chips and buttons to break into multiple lines */
  .tt-chip,
  .tt-chip-verein,
  .tt-chip-kategorie,
  .tt-count-chip,
  .tt-open-settings,
  .card.small,
  .tt-btn,
  .button {
    flex: 0 1 auto;
    white-space: normal;
    min-width: 0;
  }

  /* Keep startnr/name area flexible so it uses remaining space */
  .tt-startnr,
  .tt-name,
  .tt-uebersicht-title strong {
    min-width: 0;
    flex: 1 1 auto;
    overflow: visible;
  }
}


/* ---------------------------
   Neues Login-Design
   --------------------------- */
.tt-login-hero{position:relative;min-height:60vh;display:flex;align-items:center;justify-content:center;padding:36px 18px}
.tt-login-bg{position:absolute;inset:0;overflow:hidden;z-index:0;background:linear-gradient(180deg,#eaf4ff 0%, #f8fbff 40%, #ffffff 100%)}
.tt-login-bg canvas{width:100%;height:100%;display:block}
.tt-login-card{position:relative;z-index:5;max-width:420px;width:100%;margin:24px;border-radius:14px;box-shadow:0 20px 50px rgba(2,6,23,0.12);background:linear-gradient(180deg,rgba(255,255,255,0.95),#ffffff);border:1px solid rgba(11,102,209,0.06);overflow:hidden}
.tt-login-card-inner{padding:28px 26px;display:flex;flex-direction:column;gap:10px}
.tt-login-title{margin:0;font-size:1.6rem;color:var(--accent);letter-spacing:0.2px}
.tt-login-sub{margin:0;color:var(--muted);font-size:0.95rem}

.login-wrap form{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.login-wrap label{font-size:0.9rem;color:var(--muted);display:block}
.login-wrap input[type="text"], .login-wrap input[type="password"], .login-wrap input[type="email"]{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(11,102,209,0.12);background:#fff;font-size:1rem;transition:box-shadow .12s ease,border-color .12s ease}
.login-wrap input:focus{outline:none;box-shadow:0 8px 18px rgba(11,102,209,0.08);border-color:var(--accent)}
.login-wrap .forgetmenot{display:flex;align-items:center;gap:8px;font-size:0.92rem;color:var(--muted)}
.login-wrap .button, .login-wrap input[type="submit"]{background:var(--accent);color:#fff;border:0;padding:10px 14px;border-radius:10px;font-weight:700;cursor:pointer;box-shadow:0 8px 20px rgba(11,102,209,0.12);transition:transform .12s ease,box-shadow .12s ease}
.login-wrap .button:hover, .login-wrap input[type="submit"]:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(11,102,209,0.16)}

.tt-login-footer{display:flex;gap:10px;align-items:center;justify-content:flex-start;margin-top:8px;font-size:0.95rem;color:var(--muted)}
.tt-login-footer a{color:var(--accent);text-decoration:none}
.tt-login-footer a:hover{text-decoration:underline}
.tt-login-sep{color:var(--muted);opacity:0.6}

/* Subtile Dekoration im Card-Oberteil */
.tt-login-card::before{content:'';position:absolute;left:-40%;top:-20%;width:220px;height:220px;background:radial-gradient(circle at 30% 30%,rgba(11,102,209,0.06),transparent 40%);transform:rotate(12deg);pointer-events:none}
.tt-login-card::after{content:'';position:absolute;right:-30%;bottom:-30%;width:320px;height:320px;background:radial-gradient(circle at 60% 60%,rgba(46,125,194,0.04),transparent 35%);pointer-events:none}

/* Responsive: Card passt sich an kleine Bildschirme an */
@media (max-width:520px){
  .tt-login-hero{min-height:50vh;padding:20px}
  .tt-login-card-inner{padding:18px}
  .tt-login-title{font-size:1.3rem}
}

/* prefers-reduced-motion: Animationen deaktivieren */
@media (prefers-reduced-motion: reduce){
  .tt-login-card, .tt-login-card::before, .tt-login-card::after, .login-wrap .button{transition:none}
  #tt-login-canvas{display:none}
}

/* Accessibility: focus-visible styles */
.login-wrap input:focus-visible{outline:3px solid rgba(11,102,209,0.12);outline-offset:2px}

/* Styles for the current dancer card (matches Übersicht/Auswertung visual language) */
.tt-current-dancer-card{background:#fff;border:none;border-radius:10px;padding:10px;margin-top:6px;box-shadow:0 4px 10px rgba(2,6,23,0.04);display:flex;flex-direction:column;gap:8px}
.tt-current-dancer-card .tt-current-header{display:flex;align-items:center;gap:8px}
.tt-current-dancer-card .tt-platz{font-size:1.4rem;font-weight:800;color:var(--accent);min-width:44px;text-align:center}
.tt-current-dancer-card .tt-current-header strong{font-size:1.05rem}
.tt-current-dancer-card .tt-uebersicht-chips-right{margin-left:auto;display:flex;gap:8px;align-items:center}
.tt-current-dancer-card .tt-chip{padding:4px 8px;border-radius:10px;background:#f3f4f6;font-weight:700}
.tt-current-dancer-card .tt-uebersicht-total-row{margin-top:6px}
.tt-current-dancer-card .tt-uebersicht-total-box{background:#e9f2ff;border:1px solid #0b66d1;border-radius:6px;padding:6px 10px;display:flex;align-items:center;gap:8px}
.tt-current-dancer-card .tt-total-label{font-size:0.78rem;color:var(--muted)}
.tt-current-dancer-card .tt-total-value{font-size:1.05rem;font-weight:800;color:#0b2338}
.tt-current-dancer-card .tt-uebersicht-scores{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.tt-current-dancer-card .tt-score-item{min-width:56px;padding:6px 8px}

/* Excluded judge score (hatched) */
.tt-score-excluded{
  position:relative;
  opacity:0.85;
}
.tt-score-excluded::after{
  content:'';
  position:absolute;
  left:0;right:0;top:0;bottom:0;
  background-image:repeating-linear-gradient(135deg, rgba(0,0,0,0.04) 0 4px, transparent 4px 8px);
  border-radius:8px;
  pointer-events:none;
}
.tt-score-excluded .tt-score-value{color:var(--muted);text-decoration:line-through}
.tt-excluded-note{font-size:0.85rem;color:var(--muted);margin-top:6px}

/* Top control section: reuse animation control styles for a top menu */
#tt-top-controls-section{margin-bottom:6px}
#tt-top-controls-section .tt-anim-btn{background:linear-gradient(180deg,rgba(255,255,255,0.98),rgba(252,250,244,0.96));border-radius:8px;padding:6px 10px;border:1px solid rgba(2,6,23,0.06);box-shadow:0 6px 18px rgba(2,6,23,0.06);cursor:pointer;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:8px;font-size:0.92rem}
#tt-top-controls-section .tt-anim-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(2,6,23,0.08)}

@media (max-width:520px){
  #tt-top-controls-section{padding:6px}
  #tt-top-controls-section .tt-anim-btn{flex:0 0 auto}
}

@media (max-width:520px){
  .tt-current-dancer-card{padding:8px}
  .tt-current-dancer-card .tt-current-header{flex-wrap:wrap}
  .tt-current-dancer-card .tt-uebersicht-chips-right{width:100%;order:2;margin-left:0;justify-content:flex-start}
}

/* Vereine Ranking styles: similar visual language to Auswertung */
.tt-vereine-ranking{margin-top:12px}
.tt-vereine-ranking h3{margin:0 0 12px 0;font-size:1.1rem;color:var(--accent);padding:8px 10px;border:1px solid rgba(11,102,209,0.08);background:#f7fbff;border-radius:6px;text-transform:capitalize}
.tt-vereine-table{width:100%;border-collapse:collapse;margin-top:10px;background:#fff;border:1px solid rgba(11,102,209,0.06);border-radius:8px;overflow:hidden}
.tt-vereine-table thead th{background:#f4f8ff;color:var(--accent);text-align:left;padding:10px 12px;font-weight:800;border-bottom:1px solid rgba(11,102,209,0.04)}
.tt-vereine-table tbody td{padding:10px 12px;border-bottom:1px solid rgba(11,102,209,0.04);vertical-align:middle}
.tt-vereine-table tbody tr:last-child td{border-bottom:0}
.tt-vereine-rank{font-weight:800;color:var(--accent);width:48px;text-align:center}
.tt-vereine-name{font-weight:700}
.tt-vereine-count{color:var(--muted);min-width:80px;text-align:center}
.tt-vereine-avg{font-weight:800;color:#0b2338;text-align:right;min-width:100px}
.tt-vereine-note{margin-top:8px;color:var(--muted);font-size:0.92rem}

/* Small clubs row styling (clubs with less than 3 dancers) */
.tt-vereine-row.tt-club-small{opacity:0.8;background:linear-gradient(180deg,#fff,#fbfbfb)}
.tt-vereine-row.tt-club-small .tt-vereine-name{color:var(--muted)}

@media (max-width:520px){
  .tt-vereine-table thead th, .tt-vereine-table tbody td{padding:8px}
  .tt-vereine-avg{text-align:left}
}