/* content.css
 *
 * Formulare, Karten, Tabellen und Listen der Verwaltungsseiten (aus dem
 * frueheren style.css uebernommen - Seitenrahmen, Navigation und Farben liegen
 * jetzt in site.css). Klassennamen bleiben unveraendert, damit die
 * bestehenden Seiten ohne Umbau weiter funktionieren.
 */
h1 { font-size: 1.5rem; margin: .2rem 0 1rem; }
h2 { font-size: 1.25rem; margin: 0 0 .2rem; }
h3 { font-size: 1.05rem; margin: 1.4rem 0 .6rem; color: var(--text); }
a { color: var(--accent-dark); }

label { display: block; margin-top: .9rem; margin-bottom: .3rem; font-weight: 600; font-size: .92rem; }
/* font-size:1rem (statt z.B. .9rem) auf Inputs ist auf iOS bewusst wichtig -
   Safari zoomt beim Fokussieren automatisch hinein, wenn ein Feld eine
   kleinere Schrift hat. */
input, select, textarea {
    padding: .55rem .65rem; font-size: 1rem; width: 100%;
    border: 1px solid var(--border); border-radius: 8px; background: #fff;
    font-family: inherit; color: var(--text);
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(26,122,76,.15); }
input[readonly] { background: #f5f6f7; color: var(--text-muted); }
textarea { font-family: ui-monospace, monospace; font-size: .85rem; height: 100px; }
/* import-scorecard-json.php braucht fuer das eingefuegte KI-JSON deutlich
   mehr Platz als die uebrigen Textareas (z.B. Kursliste in add-club.php) -
   ID-Selektor wirkt dadurch nur auf dieser einen Seite. */
#json_input { height: 320px; }

table { width: 100%; border-collapse: collapse; }

button, .btn {
    display: inline-block; margin-top: 1.2rem; padding: .65rem 1.3rem;
    font-size: .95rem; font-weight: 600; cursor: pointer;
    border-radius: 8px; border: none; background: var(--accent); color: #fff;
    text-decoration: none; text-align: center; transition: background .15s;
}
button:hover, .btn:hover { background: var(--accent-dark); }
button.btn-secondary, .btn-secondary { background: #fff; color: var(--text); border: 1px solid var(--border); }
button.btn-secondary:hover, .btn-secondary:hover { background: #f5f6f7; }
button.btn-danger, .btn-danger { background: #fff; color: var(--danger); border: 1px solid #f0d4d0; padding: .4rem .8rem; font-size: .85rem; margin-top: 0; }
button.btn-danger:hover, .btn-danger:hover { background: #fdf0ee; }
button.btn-small, .btn-small { padding: .4rem .8rem; font-size: .85rem; margin-top: 0; }

.error { color: var(--danger); }
.success { color: var(--accent-dark); font-weight: 600; }
.muted { color: var(--text-muted); font-size: .88rem; }
.warning { color: #9a6b00; background: #fff7e0; border: 1px solid #f0dca0; border-radius: 8px; padding: .6rem .8rem; margin: .6rem 0; font-size: .9rem; }

.card {
    background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius);
    padding: 1.1rem 1.2rem; margin-top: 1rem; box-shadow: 0 1px 2px rgba(0,0,0,.03);
}


/* Zweispaltiges Layout: links Club-Auswahl/-Suche, rechts Inhalt - auf
   schmalen Bildschirmen (iPhone) untereinander statt nebeneinander. */
.layout { display: flex; gap: 1.5rem; margin-top: 1rem; align-items: flex-start; }
.left-panel { flex: 0 0 320px; }
.right-panel { flex: 1; min-width: 0; }

.row2 { display: flex; gap: .8rem; }
.row2 > div { flex: 1; }

/* Club-Suche mit Live-Ergebnisliste (siehe initClubSearch in script.js). */
#clubResults {
    border: 1px solid var(--border); border-radius: var(--radius); max-height: 60vh;
    overflow-y: auto; margin-top: .5rem; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.club-result { padding: .7rem .8rem; border-bottom: 1px solid var(--border); cursor: pointer; }
.club-result:last-child { border-bottom: none; }
.club-result:first-child { border-top-left-radius: var(--radius); border-top-right-radius: var(--radius); }
.club-result:last-child { border-bottom-left-radius: var(--radius); border-bottom-right-radius: var(--radius); }
.club-result:hover { background: #f5f6f7; }
.club-result.selected { background: #eaf5ef; font-weight: 600; color: var(--accent-dark); }
.club-result .muted { display: block; }
/* scorecards-overview.php rendert die Liste serverseitig als <a> statt wie
   add-scorecard.php/import-scorecard-json.php per JS in ein <div> - gleiche
   Optik, kein Link-Blau/-Unterstrich. */
a.club-result { display: block; text-decoration: none; color: inherit; }
.placeholder { color: var(--text-muted); padding: 3rem 1.5rem; text-align: center; border: 1px dashed var(--border); border-radius: var(--radius); background: #fff; }

/* Breite Tabellen horizontal scrollbar statt das Layout zu sprengen
   (.table-scroll), optional zusaetzlich hoehenbegrenzt mit Rahmen und
   fixiertem Tabellenkopf (.table-scroll--tall, siehe cleanup-duplicate-clubs.php). */
.table-scroll { overflow-x: auto; }
.table-scroll--tall { max-height: 420px; overflow-y: auto; border: 1px solid var(--border); border-radius: var(--radius); }

/* Loch-Editor-Tabelle (add-scorecard.php, scorecards-overview.php teilt
   sich NICHT diese Klasse - nur Formulare mit editierbaren Loch-Zeilen). */
.hole-table th, .hole-table td { padding: .35rem .3rem; text-align: left; }
.hole-table th { font-size: .78rem; text-transform: uppercase; letter-spacing: .02em; color: var(--text-muted); }
.hole-table td input { width: 4.5rem; padding: .35rem; }

/* Duplikat-/Kandidaten-Tabellen (cleanup-duplicate-clubs.php) - bewusst
   eigene Klasse statt blanker table/th/td-Selektoren, siehe Kommentar am
   Dateianfang. */
.candidates-table { font-size: .85rem; background: #fff; }
.candidates-table th, .candidates-table td { text-align: left; padding: .4rem .5rem; border-bottom: 1px solid var(--border); }
.candidates-table th { background: #f7f8f9; position: sticky; top: 0; }

/* Karten-Liste statt Tabelle fuer Scorecards eines Clubs (add-scorecard.php,
   scorecards-overview.php) - eine breite Tabelle mit 6+ Spalten liess sich
   auf dem iPhone nicht mehr sinnvoll darstellen (Aktionen liefen ueber den
   Bildschirmrand hinaus, Nutzer-Screenshot). Funktioniert dadurch auf jeder
   Bildschirmgroesse gleich gut. */
.scorecard-list { display: flex; flex-direction: column; gap: .6rem; margin-top: .6rem; }
.scorecard-item {
    background: #fff; border: 1px solid var(--border); border-radius: 10px;
    padding: .8rem .9rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
}
.scorecard-item.editing { border-color: var(--accent); background: #f6fbf8; }
.scorecard-item.clickable { cursor: pointer; }
.scorecard-item.clickable:hover { border-color: var(--accent); background: #f6fbf8; }
/* scorecards-overview.php: Tee-Zeile ist ein <a> zum Bearbeiten in
   add-scorecard.php - optisch trotzdem wie eine normale Karte, kein
   Link-Unterstrich/-Blau. */
a.scorecard-item { text-decoration: none; color: inherit; }
.scorecard-item-info { min-width: 0; }
.scorecard-item-tee { font-weight: 700; }
.scorecard-item-meta { color: var(--text-muted); font-size: .85rem; margin-top: .15rem; }
.scorecard-item-actions { display: flex; gap: .5rem; flex-shrink: 0; align-items: center; }

/* Koordinaten-Suche (add-club.php/geocode-club.php). */
#geocodeResults { margin-top: .5rem; }
.geocode-result {
    padding: .6rem .7rem; border: 1px solid var(--border); border-radius: 8px;
    margin-bottom: .4rem; cursor: pointer; font-size: .88rem; background: #fff;
}
.geocode-result:hover { background: #eaf5ef; border-color: var(--accent); }
.geocode-result .coords { color: var(--text-muted); font-size: .8rem; }

/* Name-/Land-Suchformular (cleanup-duplicate-clubs.php, scorecards-overview.php). */
.search-form { display: flex; gap: 1rem; flex-wrap: wrap; align-items: flex-end; }
.search-form > div:not(.search-form-actions) { flex: 1 1 220px; }
.search-form-actions { display: flex; gap: .5rem; align-items: center; }
.search-form-actions button, .search-form-actions .btn { margin-top: 0; }

/* Zahlen-Kacheln (cleanup-duplicate-clubs.php). */
.summary-grid { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: .6rem; }
.summary-item { flex: 1 1 180px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: .8rem 1rem; }
.summary-item .num { font-size: 1.6rem; font-weight: 700; }

/* Mobile Anpassungen der Verwaltungsbausteine: siehe @media-Block in site.css. */

/* ---------- Gemeinsame Bausteine der neueren Admin-Seiten ---------- */
.row3 { display: flex; gap: .8rem; }
.row3 > div { flex: 1; }
.row3 > div.narrow { flex: 0 0 7rem; }
.error-box { background: #fde4e4; color: #9a1f1f; padding: .7rem 1rem; border-radius: 10px; margin: .8rem 0; }
.ok-box { background: #e6f4ea; color: var(--accent-dark); padding: .7rem 1rem; border-radius: 10px; margin: .8rem 0; }
.meta { color: var(--text-muted); font-size: .85rem; line-height: 1.5; }
.card h3 { margin-top: 0; }
.actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-top: .9rem; }
.actions button, .actions .btn { margin-top: 0; }
.badge { display: inline-block; font-size: .78rem; padding: .12rem .5rem; border-radius: 99px; background: var(--accent-soft); color: var(--accent-dark); margin-right: .3rem; }
.badge.warn { background: #fff3d6; color: #8a5a00; }
.badge.bad { background: #fde4e4; color: #9a1f1f; }
table.submission-holes { border-collapse: collapse; margin-top: .5rem; font-size: .9rem; }
table.submission-holes th, table.submission-holes td { padding: .2rem .7rem; border-bottom: 1px solid var(--border); text-align: right; }
table.submission-holes th:first-child, table.submission-holes td:first-child { text-align: left; }
