/* ─── Basis ───────────────────────────────────────────────────── */
.ta-dashboard {
    max-width: 1100px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #1e293b;
}

.ta-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid #e2e8f0;
}
.ta-header h2 { margin: 0; font-size: 1.6rem; }
.ta-subtitle   { margin: 4px 0 0; color: #64748b; font-size: .9rem; }

/* ─── Buttons ─────────────────────────────────────────────────── */
.ta-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    border-radius: 8px;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all .15s ease;
    text-decoration: none;
}
.ta-btn-primary  { background:#6366f1; color:#fff; }
.ta-btn-primary:hover { background:#4f46e5; }
.ta-btn-outline  { background:transparent; color:#64748b; border-color:#cbd5e1; }
.ta-btn-outline:hover { border-color:#6366f1; color:#6366f1; }
.ta-btn-danger   { background:#ef4444; color:#fff; }
.ta-btn-danger:hover { background:#dc2626; }

/* ─── Login ───────────────────────────────────────────────────── */
.ta-login-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50vh;
    padding: 24px;
}
.ta-login-box {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 40px;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 4px 24px rgba(0,0,0,.07);
}
.ta-login-box h2 { margin: 0 0 24px; font-size: 1.4rem; text-align: center; }

/* ─── Formularfelder ──────────────────────────────────────────── */
.ta-field { margin-bottom: 16px; }
.ta-field label {
    display: block;
    font-size: .85rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 6px;
}
.ta-field input,
.ta-field select,
.ta-field textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1.5px solid #cbd5e1;
    border-radius: 8px;
    font-size: .95rem;
    box-sizing: border-box;
    transition: border-color .15s;
}
.ta-field input:focus,
.ta-field select:focus,
.ta-field textarea:focus {
    border-color: #6366f1;
    outline: none;
}

.ta-radio-group { display: flex; gap: 20px; }
.ta-radio-group label { font-weight: normal; display: flex; align-items: center; gap: 6px; }

/* ─── Alerts ──────────────────────────────────────────────────── */
.ta-alert {
    padding: 10px 14px;
    border-radius: 8px;
    margin-bottom: 16px;
    font-size: .9rem;
}
.ta-alert-error { background: #fee2e2; color: #b91c1c; border: 1px solid #fca5a5; }

/* ─── Legende ─────────────────────────────────────────────────── */
.ta-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}
.ta-badge {
    padding: 5px 12px;
    border-radius: 20px;
    font-size: .85rem;
    font-weight: 600;
}
.ta-badge-available { background:#dcfce7; color:#15803d; }
.ta-badge-absent    { background:#fee2e2; color:#b91c1c; }
.ta-badge-mec       { background:#fef3c7; color:#92400e; }
.ta-hint { font-size:.82rem; color:#94a3b8; }

/* ─── Modal ───────────────────────────────────────────────────── */
.ta-modal {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
}
.ta-modal-box {
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    width: 100%;
    max-width: 460px;
    box-shadow: 0 8px 40px rgba(0,0,0,.18);
}
.ta-modal-box h3 { margin: 0 0 20px; font-size: 1.2rem; }
.ta-modal-actions { display: flex; gap: 10px; margin-top: 20px; }

/* ─── Tabs ────────────────────────────────────────────────────── */
.ta-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 24px;
    border-bottom: 2px solid #e2e8f0;
    flex-wrap: wrap;
}
.ta-tab {
    padding: 10px 20px;
    border: none;
    background: none;
    font-size: .9rem;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
}
.ta-tab:hover  { color: #6366f1; }
.ta-tab.active { color: #6366f1; border-bottom-color: #6366f1; }

/* ─── Filter-Bar ──────────────────────────────────────────────── */
.ta-filter-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    font-size: .9rem;
    font-weight: 600;
    color: #475569;
}
.ta-filter-bar select {
    padding: 6px 10px;
    border: 1.5px solid #cbd5e1;
    border-radius: 8px;
    font-size: .9rem;
}

/* ─── Kurs-Events im Kalender ─────────────────────────────────── */
.ta-fc-event { padding: 2px 4px; }
.ta-fc-event b { display: block; font-size: .82rem; }
.ta-event-trainer { font-size: .78rem; color: #e0e7ff; display: block; }
.ta-event-trainer.ta-unassigned { color: #fde68a; }

/* ─── Trainer-Übersicht ───────────────────────────────────────── */
.ta-overview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}
.ta-overview-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.ta-overview-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.ta-overview-avatar {
    width: 42px;
    height: 42px;
    background: #6366f1;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    font-weight: 700;
    flex-shrink: 0;
}
.ta-overview-header div { flex: 1; }
.ta-overview-header strong { display: block; font-size: .95rem; }
.ta-overview-header small  { color: #94a3b8; font-size: .8rem; }
.ta-overview-count {
    background: #e0e7ff;
    color: #4338ca;
    border-radius: 20px;
    padding: 3px 10px;
    font-size: .8rem;
    font-weight: 700;
    white-space: nowrap;
}
.ta-overview-events {
    list-style: none;
    padding: 0;
    margin: 0;
}
.ta-overview-events li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-top: 1px solid #f1f5f9;
    font-size: .88rem;
}
.ta-overview-events li small { color: #94a3b8; }
.ta-dot {
    width: 7px;
    height: 7px;
    background: #6366f1;
    border-radius: 50%;
    flex-shrink: 0;
}
.ta-no-events { font-size: .85rem; color: #94a3b8; margin: 0; }
.ta-loading    { color: #94a3b8; font-style: italic; }

/* ─── Trainer: Meine Kurse ────────────────────────────────────── */
.ta-my-courses {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 28px;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.ta-my-courses h3 { margin: 0 0 16px; font-size: 1.1rem; }
.ta-courses-section h4 {
    font-size: .85rem;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin: 0 0 10px;
}
.ta-courses-loading { color: #94a3b8; font-style: italic; }

.ta-course-list {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.ta-course-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #6366f1;
    border-radius: 8px;
}
.ta-course-item.ta-course-past {
    border-left-color: #cbd5e1;
    opacity: .7;
}
.ta-course-date {
    flex-shrink: 0;
    min-width: 180px;
}
.ta-course-day  { display: block; font-weight: 600; font-size: .9rem; color: #1e293b; }
.ta-course-time { display: block; font-size: .82rem; color: #64748b; margin-top: 2px; }
.ta-course-title { font-size: .95rem; }
.ta-course-title a { color: #6366f1; text-decoration: none; font-weight: 500; }
.ta-course-title a:hover { text-decoration: underline; }

.ta-past-courses {
    margin-top: 8px;
}
.ta-past-courses summary {
    cursor: pointer;
    font-size: .85rem;
    color: #64748b;
    font-weight: 600;
    padding: 6px 0;
    user-select: none;
}
.ta-past-courses summary:hover { color: #475569; }
.ta-course-list-past { margin-top: 10px; }

@media (max-width: 600px) {
    .ta-course-item  { flex-direction: column; align-items: flex-start; gap: 6px; }
    .ta-course-date  { min-width: unset; }
}
.fc .fc-button-primary {
    background-color: #6366f1 !important;
    border-color: #6366f1 !important;
}
.fc .fc-button-primary:hover {
    background-color: #4f46e5 !important;
}
.fc .fc-button-primary:not(:disabled).fc-button-active {
    background-color: #4338ca !important;
}

/* ─── Responsive ──────────────────────────────────────────────── */
@media (max-width: 600px) {
    .ta-header      { flex-direction: column; align-items: flex-start; }
    .ta-modal-box   { padding: 20px; margin: 16px; }
    .ta-overview-grid { grid-template-columns: 1fr; }
    .ta-tabs        { overflow-x: auto; }
}

/* ─── Event-Listen (Trainer + Organisator) ────────────────────── */
.ta-section-title { margin: 32px 0 12px; }
.ta-section-title h3 { margin: 0 0 4px; font-size: 1.1rem; }

.ta-event-group { margin-bottom: 24px; }
.ta-event-group-header {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #94a3b8;
    padding: 6px 0 8px;
    border-bottom: 2px solid #e2e8f0;
    margin-bottom: 4px;
}
.ta-event-group-body { display: flex; flex-direction: column; }

.ta-event-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid #f1f5f9;
    transition: background .1s;
}
.ta-event-row:hover { background: #f8fafc; }
.ta-event-row.ta-event-past { opacity: .55; }

.ta-event-row-info { flex: 1; min-width: 0; }
.ta-event-row-date strong { display: block; font-size: .9rem; color: #1e293b; }
.ta-event-row-time { font-size: .82rem; color: #64748b; }
.ta-event-row-title { font-size: 1rem; font-weight: 600; margin-top: 4px; color: #0f172a; }
.ta-event-row-note { font-size: .82rem; color: #64748b; margin-top: 4px; }
.ta-assigned-trainer { font-size: .82rem; color: #6366f1; margin-top: 4px; }

/* Trainer: Antwort-Buttons */
.ta-event-row-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    flex-shrink: 0;
}
.ta-response-btns { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }

.ta-btn-resp {
    padding: 5px 12px;
    border-radius: 20px;
    border: 1.5px solid #e2e8f0;
    background: #fff;
    font-size: .82rem;
    cursor: pointer;
    transition: all .15s;
    white-space: nowrap;
}
.ta-btn-resp:hover { border-color: #6366f1; color: #6366f1; }
.ta-btn-resp.active[data-status="available"] { background:#dcfce7; border-color:#22c55e; color:#15803d; font-weight:700; }
.ta-btn-resp.active[data-status="absent"]    { background:#fee2e2; border-color:#ef4444; color:#b91c1c; font-weight:700; }
.ta-btn-note, .ta-btn-reset { padding: 5px 8px; color: #94a3b8; }

/* Status-Badge in Liste */
.ta-status-badge {
    font-size: .8rem;
    padding: 3px 10px;
    border-radius: 20px;
    font-weight: 600;
    white-space: nowrap;
}
.ta-status-available { background:#dcfce7; color:#15803d; }
.ta-status-absent    { background:#fee2e2; color:#b91c1c; }
.ta-status-none      { background:#f1f5f9; color:#94a3b8; }

/* Organisator: Rückmeldungs-Übersicht pro Event */
.ta-event-row-responses {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-shrink: 0;
    min-width: 220px;
    max-width: 300px;
}
.ta-resp-group { display: flex; flex-direction: column; gap: 1px; }
.ta-resp-label { font-size: .78rem; font-weight: 700; }
.ta-resp-available { color: #15803d; }
.ta-resp-absent    { color: #b91c1c; }
.ta-resp-none      { color: #94a3b8; }
.ta-resp-names { font-size: .8rem; color: #475569; padding-left: 4px; }

@media (max-width: 700px) {
    .ta-event-row { flex-direction: column; }
    .ta-event-row-actions { align-items: flex-start; }
    .ta-event-row-responses { min-width: unset; max-width: 100%; }
}

/* ─── Assign-Modal Hinweise ───────────────────────────────────── */
.ta-assign-hint {
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 6px;
    padding: 10px 14px;
    font-size: .85rem;
    color: #92400e;
    margin-bottom: 12px;
}
.ta-field-hint {
    font-size: .8rem;
    color: #64748b;
    margin-top: 6px;
}

/* ─── Trainer-Checkboxen im Assign-Modal ─────────────────────── */
.ta-field-label { display:block; font-size:.85rem; font-weight:600; color:#374151; margin-bottom:8px; }
.ta-trainer-checkboxes { display:flex; flex-direction:column; gap:8px; max-height:260px; overflow-y:auto; padding:4px 0; }
.ta-checkbox-label {
    display:flex; align-items:center; gap:10px;
    padding: 8px 12px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    transition: all .15s;
    font-size: .9rem;
}
.ta-checkbox-label:hover { border-color: #6366f1; background: #f5f3ff; }
.ta-checkbox-label input[type="checkbox"] { width:16px; height:16px; accent-color:#6366f1; cursor:pointer; }
.ta-checkbox-label input:checked ~ span { font-weight: 600; color: #4f46e5; }
.ta-cb-stale { opacity: .65; }
.ta-cb-stale em { font-size:.78rem; color:#94a3b8; }


/* === PDF Materialien (v1.1.0) === */
.ta-course-pdfs {
	margin-top: 10px;
	padding: 10px 14px;
	background: #f6f8fa;
	border-left: 3px solid #5b6cff;
	border-radius: 6px;
}
.ta-course-pdfs strong {
	display: block;
	margin-bottom: 6px;
	font-size: 0.85em;
	color: #4a5568;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.ta-pdf-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.ta-pdf-list li {
	padding: 3px 0;
}
.ta-pdf-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
	color: #2c3e50;
	font-size: 0.95em;
}
.ta-pdf-link:hover {
	text-decoration: underline;
	color: #5b6cff;
}
.ta-pdf-icon {
	display: inline-block;
	padding: 1px 6px;
	background: #d63638;
	color: #fff;
	font-size: 0.7em;
	font-weight: bold;
	border-radius: 3px;
	letter-spacing: 0.5px;
}
.ta-pdf-link small {
	color: #8a8a8a;
	font-weight: normal;
	margin-left: 4px;
}


/* === Frei-Meldung Pool (v1.1.0) === */
.ta-section-title {
	margin: 24px 0 8px;
	font-size: 1.05em;
	color: #4a5568;
	border-bottom: 1px solid #e2e8f0;
	padding-bottom: 6px;
}
.ta-hint {
	font-size: 0.85em;
	color: #718096;
	margin: 0 0 10px;
}
.ta-free-list .ta-course-item {
	border-left: 3px solid #f59e0b;
	background: #fffbeb;
}
.ta-badge-free {
	display: inline-block;
	padding: 2px 8px;
	font-size: 0.75em;
	background: #f59e0b;
	color: #fff;
	border-radius: 3px;
	font-weight: 600;
	letter-spacing: 0.3px;
	margin-right: 6px;
}


/* === v1.2.0: Kunde + Print === */
.ta-event-row-customer {
	margin-top: 4px;
	font-size: 0.85em;
	color: #4a5568;
}
.ta-event-row-customer strong {
	color: #2d3748;
}
.ta-course-customer {
	margin-top: 6px;
	padding: 6px 10px;
	background: #eef2ff;
	border-radius: 4px;
	font-size: 0.9em;
	color: #3730a3;
}
.ta-course-customer strong {
	color: #1e1b4b;
}
.ta-actions {
	margin: 0 0 12px;
}
.ta-actions .ta-btn {
	font-size: 0.9em;
}


/* === v1.3.0: Login + Registrierung === */
.ta-auth-wrap {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	min-height: 70vh;
	padding: 24px 16px;
	box-sizing: border-box;
}
.ta-auth-card {
	width: 100%;
	max-width: 460px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(0,0,0,0.05);
	overflow: hidden;
}
.ta-auth-tabs {
	display: flex;
	border-bottom: 1px solid #e5e7eb;
}
.ta-auth-tab {
	flex: 1;
	padding: 14px 16px;
	background: #f9fafb;
	border: 0;
	border-right: 1px solid #e5e7eb;
	cursor: pointer;
	font-size: 0.95rem;
	font-weight: 600;
	color: #6b7280;
	transition: background .15s, color .15s;
}
.ta-auth-tab:last-child { border-right: 0; }
.ta-auth-tab.active {
	background: #fff;
	color: #1f2937;
	border-bottom: 2px solid #5b6cff;
	margin-bottom: -1px;
}
.ta-auth-tab:hover:not(.active) { background: #f3f4f6; }
.ta-auth-panel { padding: 28px 28px 32px; }
.ta-auth-title {
	margin: 0 0 18px;
	font-size: 1.25rem;
	color: #1f2937;
}
.ta-auth-form .ta-field,
.ta-dashboard .ta-field {
	margin-bottom: 14px;
}
.ta-auth-form label,
.ta-dashboard .ta-field label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.875rem;
	font-weight: 500;
	color: #374151;
}
.ta-auth-form label small { color: #9ca3af; font-weight: 400; }
.ta-auth-form input[type="text"],
.ta-auth-form input[type="email"],
.ta-auth-form input[type="password"] {
	display: block;
	width: 100%;
	padding: 10px 12px;
	font-size: 0.95rem;
	line-height: 1.4;
	color: #1f2937;
	background: #fff;
	border: 1px solid #d1d5db;
	border-radius: 8px;
	box-sizing: border-box;
	transition: border-color .15s, box-shadow .15s;
}
.ta-auth-form input:focus {
	outline: 0;
	border-color: #5b6cff;
	box-shadow: 0 0 0 3px rgba(91,108,255,.15);
}
.ta-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}
.ta-btn-block {
	display: block;
	width: 100%;
	padding: 12px 16px;
	font-size: 1rem;
	font-weight: 600;
	margin-top: 8px;
}
.ta-alert {
	padding: 10px 12px;
	margin-bottom: 16px;
	border-radius: 6px;
	font-size: 0.9rem;
}
.ta-alert-error { background: #fee2e2; color: #991b1b; border: 1px solid #fecaca; }
.ta-alert-success { background: #d1fae5; color: #065f46; border: 1px solid #a7f3d0; margin: 16px 28px 0; }
@media (max-width: 480px) {
	.ta-auth-panel { padding: 20px 18px 22px; }
	.ta-field-row { grid-template-columns: 1fr; gap: 0; }
}


/* === v1.5.0: Co-Trainer-Anzeige === */
.ta-course-cotrainers {
	margin-top: 6px;
	padding: 6px 10px;
	background: #ecfccb;
	border-radius: 4px;
	font-size: 0.88em;
	color: #365314;
}
.ta-course-cotrainers strong {
	color: #1a2e05;
}