/* tournament-admin/ — layout shell, .puzzle-status, .editor-toolbar, .field-group,
   .admin-empty etc. are all reused from ../puzzle-editor/styles.css (linked in
   index.html) since this is another admin tool built on the same shell. Only
   the classes specific to this page live here. */

.field-group--checkbox label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

/* The native datetime-local picker icon renders as a dark glyph by default —
   invisible (though still clickable) against this site's dark theme. Chrome/
   Edge-only pseudo-element; Firefox ignores it harmlessly. */
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
}

/* Bare <textarea> elements on this page aren't wrapped in puzzle-editor's
   .editor-config (that's what gives its textareas the dark, full-width
   styling) — style them directly here instead, same look, full page width. */
.puzzle-editor-board textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(4, 10, 20, .45);
    color: inherit;
    padding: 11px 12px;
    font: inherit;
    resize: vertical;
}

.tournament-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 12px 0 20px;
}

.tournament-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-radius: var(--radius-md);
    background: var(--surface-strong);
    border: 1px solid var(--line);
}

.tournament-row-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tournament-row-meta {
    font-size: 0.85em;
    color: var(--muted);
}

.tournament-row-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.tournament-status-badge {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    font-weight: 600;
    text-transform: capitalize;
}

.tournament-status-badge.is-draft { background: rgba(148, 163, 184, 0.2); color: var(--muted); }
.tournament-status-badge.is-registration { background: rgba(45, 212, 191, 0.18); color: var(--accent-2); }
.tournament-status-badge.is-live { background: rgba(124, 92, 255, 0.2); color: var(--accent); }
.tournament-status-badge.is-review { background: rgba(234, 179, 8, 0.2); color: #eab308; }
.tournament-status-badge.is-closed { background: rgba(148, 163, 184, 0.15); color: var(--muted); }
.tournament-status-badge.is-canceled { background: rgba(239, 68, 68, 0.18); color: #ef4444; }

.puzzle-picker {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 8px 0 16px;
    max-height: 480px;
    overflow-y: auto;
    padding-right: 4px;
}

.puzzle-picker-row {
    padding: 10px 14px;
    border-radius: var(--radius-sm, 10px);
    background: var(--surface-strong);
    border: 1px solid var(--line);
}

.puzzle-picker-check {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.puzzle-picker-meta {
    margin: 4px 0 0 26px;
    font-size: 0.82em;
    color: var(--muted);
}

.puzzle-picker-overrides {
    display: flex;
    gap: 16px;
    margin: 8px 0 0 26px;
    font-size: 0.85em;
}

.puzzle-picker-overrides label {
    display: flex;
    align-items: center;
    gap: 6px;
}

.puzzle-picker-overrides input {
    width: 90px;
}

.prize-rows {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 6px 0;
}

.prize-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.prize-row-place {
    min-width: 48px;
    font-weight: 600;
    color: var(--muted);
}

.prize-row input {
    flex: 1;
}

.terms-preview {
    white-space: pre-wrap;
    padding: 12px 14px;
    border-radius: var(--radius-sm, 10px);
    background: var(--surface-strong);
    border: 1px solid var(--line);
    font-size: 0.9em;
    max-height: 260px;
    overflow-y: auto;
}