/* TF-Web: zentrale CSS-Datei. Hier Farben, Buttons und mobile Darstellung aendern. */
:root{font:14px system-ui,-apple-system,Segoe UI,sans-serif;color:#192b36;background:#f2f6f8}*{box-sizing:border-box}body{margin:0}header{background:#153f53;color:white;padding:15px 24px;display:flex;gap:16px;align-items:center;justify-content:space-between}header a{color:white}.toolbar{padding:13px 22px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}button,input,textarea{font:inherit}button{border:1px solid #b7c8d1;border-radius:7px;background:white;padding:5px 9px;cursor:pointer}.cards{display:flex;align-items:flex-start;flex-wrap:wrap;gap:12px;padding:8px 20px}.card{border:1px solid #c5d3db;border-radius:10px;background:white;min-width:225px;width:max-content;max-width:min(100%,440px);box-shadow:0 2px 9px #102c3a12;overflow:hidden}.head{padding:11px 13px;background:var(--tint,#dbeafe);display:flex;justify-content:space-between;align-items:start;gap:16px}.head strong{font-size:14px}.body{padding:9px 12px}.person{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 0;border-bottom:1px solid #edf1f3}.person:last-child{border:0}.small{font-size:12px;color:#60727f}.trial{border-top:1px solid #ddd;padding:6px 0}.notes{margin-top:8px}.notes textarea{display:block;width:100%;min-height:55px;border:1px solid #c7d2d9;border-radius:5px;padding:6px}fieldset{border:0;padding:0;margin:0}form.inline{display:inline-flex;align-items:center;gap:3px}.pill{font-size:11px;color:#315161}.sub{font-size:12px;color:#4b626e}.hint{color:#526773}.alert{margin:10px 20px;padding:10px;background:#fff2df}label{cursor:pointer}.contact{display:none;padding:12px;background:#f1f7f9;border-radius:7px;margin-top:6px;max-width:360px;overflow-wrap:anywhere}details[open] .contact{display:block}@media(max-width:500px){.card{width:100%;max-width:none}}
.tabs{display:flex;gap:15px;padding:12px 22px;background:white;border-bottom:1px solid #dce6eb}.tabs a{color:#24546c;text-decoration:none;font-weight:600}.management{margin:14px 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:9px}.management details{border:1px solid #d6e1e7;background:white;border-radius:10px;padding:13px}.management summary{cursor:pointer;font-weight:650;color:#224c61}.editor{display:grid;gap:9px;margin-top:12px}.editor label{display:grid;gap:4px;font-size:12px}.editor input,.editor select,.editor textarea{width:100%;padding:9px;border:1px solid #b8cbd5;border-radius:6px}.editor button{background:#215e73;color:white;padding:10px}.card{min-width:280px;max-width:410px}.head{min-height:80px}.person{min-height:38px}button:hover{filter:brightness(.96)}.alert{border-radius:8px}@media(max-width:700px){.management{margin:10px}.tabs{flex-wrap:wrap}}
 .day-filter{display:flex;gap:6px;flex-wrap:wrap}.day-btn{min-width:45px;padding:9px 13px;border-radius:8px;border:1px solid #b7c8d1;background:#fff;color:#24546c;font-weight:650}.day-btn.active{background:#215e73;color:#fff;border-color:#215e73}.day-btn:focus-visible{outline:3px solid #70b7d1;outline-offset:2px}.card[hidden]{display:none!important}
.tabs{gap:9px;flex-wrap:wrap;padding:12px 16px}.tabs .navbtn{border:1px solid #b9cbd5;border-radius:9px;padding:11px 14px;background:#fff;text-decoration:none;color:#194a60}.tabs .navbtn.selected{background:#215e73;color:#fff}.management{max-width:860px;margin:22px auto;padding:0 12px;display:block}.management details{padding:22px;box-shadow:0 4px 18px #153f5312}.management summary{font-size:18px}.editor{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.editor label:has(textarea),.editor button,.management p{grid-column:1/-1}.editor button{max-width:260px}.navbtn:focus-visible{outline:3px solid #69b7d2}@media(max-width:680px){.editor{grid-template-columns:1fr}.tabs .navbtn{flex:1 1 140px;text-align:center}.management{margin:12px auto}.management details{padding:15px}}

/* Responsive navigation and calendar */
.tabs{align-items:center;gap:10px;background:#fff;padding:13px 20px}.tabs .navbtn{display:inline-flex;gap:8px;align-items:center;justify-content:center;min-height:44px;font-weight:650}.nav-icon{font-size:19px;line-height:1}.toolbar{justify-content:space-between;background:#edf4f7}.toolbar label{margin-left:auto;display:flex;gap:10px;align-items:center;background:#fff;border:1px solid #c4d8e2;border-radius:11px;padding:7px 12px;font-weight:600;color:#205369}.toolbar input[type=date]{border:0;background:transparent;color:#205369;padding:6px;font:inherit}.is-present{background:#d7f4e4}.is-absent{background:#fbe2df}.lookup{grid-column:1/-1;background:#edf6fa;border:1px solid #c9dfe9;padding:12px;border-radius:9px}.lookup select,.lookup input{width:100%;padding:10px;border:1px solid #b8cbd5;border-radius:7px}.section-title{font-size:17px;font-weight:700;color:#194a60}.management details{margin-bottom:14px}@media(max-width:700px){.toolbar label{margin-left:0;width:100%;justify-content:space-between}.tabs .navbtn{flex:1 1 135px}.cards{padding:10px}.card{min-width:0;width:100%;max-width:none}.person{gap:5px}}

/* Suchergebnisse: gut lesbar und auch auf Touchscreens bedienbar. */
.search-results{display:grid;gap:4px;max-height:260px;overflow:auto;margin:6px 0}
.search-results:empty{display:none}
.search-results p{padding:8px;margin:0;color:#60727f}
.search-results .search-result,.lookup .new-record{display:block;width:100%;text-align:left;padding:11px 12px;border:1px solid #c6d8e2;border-radius:8px;background:white;color:#194a60;min-height:44px}
.search-results .search-result:hover,.search-results .search-result:focus-visible{background:#dceef6;outline:2px solid #79b7cf}
.lookup .new-record{margin-top:8px;font-weight:600;background:#f8fcfe}
.editor button:disabled{opacity:.5;cursor:not-allowed}

/* V4.2: Gemeinsame Gestaltung fuer alle Seiten. Farben hier zentral aendern. */
:root{--tf-primary:#215e73;--tf-border:#c5d3db;--tf-bg:#f2f6f8;--tf-radius:10px}
.assigned-courses{grid-column:1/-1;border:1px solid var(--tf-border);border-radius:var(--tf-radius);padding:13px;background:#f7fbfd;margin-top:10px}
.assigned-courses h3{margin:0 0 9px;font-size:14px;color:var(--tf-primary)}
.assigned-list{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.assigned-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid #d9e5eb;border-radius:8px;padding:10px}
.assigned-list .course-time{font-size:12px;color:#60727f}
.assigned-list .course-check{color:#187b55;font-weight:700}
@media(max-width:600px){.assigned-list li{align-items:flex-start}.management{padding:0 8px}.login-box{width:calc(100vw - 32px)}.toolbar{padding:10px}.tabs{padding:10px}}

/* V4.3: X-Button, offene Probestunden und einspaltige Verwaltung */
.remove-course{background:#fff5f4;color:#9b2929;border:1px solid #efc2c0;font-size:22px;line-height:1;min-width:40px;min-height:40px}
.remove-course:hover{background:#ffe4e0}
.trial-list{display:grid;gap:9px;margin-top:15px}.trial-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--tf-border);border-radius:9px;background:#f7fbfd}
.trial-row button{min-height:40px}.management .assigned-courses{margin-top:15px}
@media(max-width:600px){.trial-row{flex-wrap:wrap}.trial-row button{width:100%}}

/* V4.4: Schrift und Farben zentral. Keine externen Font-CDNs erforderlich. */
:root{--tf-font:"Trebuchet MS", "Segoe UI", Arial, sans-serif;--tf-primary:#205e73;--tf-bg:#f2f6f8;--tf-border:#c5d3db;font-family:var(--tf-font)}
body{font-family:var(--tf-font)}
/* Login-Formular: gleicher Stil wie die restliche Anwendung. */
body:has(.login-box){min-height:100vh;display:grid;place-items:center;padding:20px}
.login-box{width:min(100%,390px);background:#fff;padding:34px;border:1px solid var(--tf-border);border-radius:16px;box-shadow:0 12px 40px #153f5319}
.login-box h2{margin:0 0 8px;color:var(--tf-primary)}
.login-box input,.login-box button{display:block;width:100%;padding:13px;margin:12px 0;border-radius:9px}
.login-box input{border:1px solid var(--tf-border);background:#fff}
.login-box .login-submit{background:var(--tf-primary);color:#fff;border:1px solid var(--tf-primary);font-weight:700;min-height:46px}
.login-box .login-submit:hover{background:#164b60}
/* Teilnehmerliste: Suchfeld, Tabelle und Handyansicht. */
.participant-directory{max-width:1100px;margin:22px auto;padding:24px;background:#fff;border:1px solid var(--tf-border);border-radius:14px;box-shadow:0 4px 20px #153f5310}
.directory-header{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}
.directory-header h1{color:var(--tf-primary);margin:0 0 8px;font-size:24px}
.directory-header .navbtn,.directory-edit{display:inline-block;text-decoration:none;color:var(--tf-primary);border:1px solid var(--tf-border);padding:9px 12px;border-radius:8px}
.directory-search{display:grid;gap:8px;margin:22px 0 15px;font-weight:600;color:var(--tf-primary)}
.directory-search input{padding:12px;border:1px solid var(--tf-border);border-radius:9px;font:inherit}
.directory-scroll{overflow-x:auto}.directory-table{width:100%;border-collapse:collapse;text-align:left;min-width:650px}
.directory-table th,.directory-table td{padding:12px;border-bottom:1px solid #e3edf1}
.directory-table th{background:#edf6fa;color:var(--tf-primary)}
.directory-table tbody tr:hover{background:#f3f9fc;cursor:pointer}
.directory-table tr[hidden]{display:none}
@media(max-width:680px){.participant-directory{margin:10px;padding:15px}.directory-header h1{font-size:21px}}

/* V4.5: Einfache Newsletter-Checkbox im Teilnehmerformular */
.newsletter-check { display:flex; align-items:center; gap:10px; grid-column:1/-1; padding:10px 12px; border:1px solid var(--tf-border,#c8d9e3); border-radius:8px; background:#f5fafc; }
.newsletter-check input { width:18px; height:18px; flex:none; accent-color:var(--tf-primary,#205e73); }