/* Bierpong Turnier - Theme */

:root {
    --beer-amber: #f5a623;
    --beer-amber-light: #ffd166;
    --beer-red-cup: #e63946;
    --beer-green-win: #4caf50;
    --beer-foam: #fff8e7;
    --beer-wood-dark: #1b120a;
    --beer-wood-mid: #2b1d0e;
    --beer-wood-light: #4a3319;
}

body {
    font-family: 'Poppins', 'Segoe UI', sans-serif;
}

/* Warm party background instead of plain black */
body.bg-dark,
.bg-dark {
    background:
        radial-gradient(circle at 15% 0%, rgba(245, 166, 35, 0.15), transparent 40%),
        radial-gradient(circle at 85% 100%, rgba(230, 57, 70, 0.10), transparent 45%),
        linear-gradient(180deg, var(--beer-wood-dark) 0%, #120b06 100%) !important;
    min-height: 100vh;
}

/* Playful headline style */
h1, h2 {
    font-family: 'Luckiest Guy', 'Poppins', cursive;
    letter-spacing: 0.5px;
    color: var(--beer-amber-light);
    text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.5), 0 0 18px rgba(245, 166, 35, 0.35);
}

h1 { font-size: clamp(1.7rem, 5vw, 2.6rem); }
h2 { font-size: clamp(1.25rem, 4vw, 1.8rem); }

/* Tables */
.table-dark,
.table-dark > :not(caption) > * > * {
    --bs-table-bg: transparent;
    background-color: rgba(43, 29, 14, 0.85) !important;
    color: var(--beer-foam) !important;
    border-color: rgba(245, 166, 35, 0.25) !important;
}

.table-dark.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(245, 166, 35, 0.07) !important;
}

.table-responsive {
    border-radius: 12px;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
}

@media (max-width: 576px) {
    .table-responsive table td,
    .table-responsive table th {
        padding: 0.5rem 0.35rem;
    }
}

/* Compact schedule/team tables: combine Runde/Tisch into one narrow
   "R/T" column and shrink font on small screens so nothing is clipped */
.compact-table .col-rt {
    white-space: nowrap;
    width: 1%;
}

@media (max-width: 576px) {
    .compact-table {
        font-size: 0.8rem;
    }

    .compact-table th,
    .compact-table td {
        padding: 0.4rem 0.3rem;
    }

    .compact-table .col-rt {
        font-size: 0.75rem;
    }

    .compact-table .btn {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }

    .compact-table .badge {
        font-size: 0.7rem;
        padding: 0.3em 0.55em;
    }
}

/* Report-result form (team.html) */
.report-input {
    width: 3.8rem;
    min-width: 0;
    flex-shrink: 1;
}

.report-form {
    min-width: 0;
}

@media (max-width: 400px) {
    .table-responsive form.report-form {
        gap: 0.25rem !important;
    }

    .table-responsive form.report-form .report-input {
        width: 3rem;
        padding-left: 0.3rem;
        padding-right: 0.3rem;
    }

    .table-responsive form.report-form .btn {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

/* Top-16 qualification highlight, gold instead of plain green.
   Selector needs to be at least as specific as the striped-row rule above
   (and appear after it) so the gold highlight always wins, even on
   alternating striped rows. */
table.table-dark.table-striped tr.table-success > * {
    background-color: var(--beer-amber) !important;
    color: var(--beer-wood-mid) !important;
    font-weight: 700;
}

.border-warning {
    border-color: var(--beer-amber) !important;
}

.border-danger {
    border-color: var(--beer-red-cup) !important;
}

/* Badges */
.badge {
    border-radius: 999px;
    padding: 0.4em 0.8em;
    font-weight: 600;
}

.badge.bg-warning.text-dark {
    background-color: var(--beer-amber) !important;
    color: var(--beer-wood-mid) !important;
}

.badge.bg-success {
    background-color: var(--beer-green-win) !important;
}

.badge.bg-secondary {
    background-color: var(--beer-wood-light) !important;
}

.badge.bg-danger {
    background-color: var(--beer-red-cup) !important;
}

/* Buttons */
.btn {
    border-radius: 999px !important;
    font-weight: 600;
    letter-spacing: 0.02em;
    border: none !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.45);
}

.btn-success {
    background: linear-gradient(135deg, #4caf50, #2e7d32) !important;
    color: #fff !important;
}

.btn-primary {
    background: linear-gradient(135deg, var(--beer-amber), #d68910) !important;
    color: var(--beer-wood-mid) !important;
}

.btn-secondary {
    background: linear-gradient(135deg, var(--beer-wood-light), #3a2610) !important;
    color: var(--beer-foam) !important;
}

.btn-warning {
    background: linear-gradient(135deg, var(--beer-amber-light), var(--beer-amber)) !important;
    color: var(--beer-wood-mid) !important;
}

.btn-danger {
    background: linear-gradient(135deg, var(--beer-red-cup), #b3222c) !important;
    color: #fff !important;
}

.btn-outline-light {
    background: transparent !important;
    border: 2px solid var(--beer-amber-light) !important;
    color: var(--beer-amber-light) !important;
    box-shadow: none;
}

.btn-outline-light:hover {
    background: var(--beer-amber-light) !important;
    color: var(--beer-wood-mid) !important;
}

/* Cards (admin panels) */
.card.bg-secondary {
    background: linear-gradient(160deg, rgba(74, 51, 25, 0.9), rgba(43, 29, 14, 0.95)) !important;
    border: 1px solid rgba(245, 166, 35, 0.25) !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

/* Team selection list */
.list-group-item.bg-secondary {
    background: linear-gradient(160deg, rgba(74, 51, 25, 0.9), rgba(43, 29, 14, 0.95)) !important;
    border: 1px solid rgba(245, 166, 35, 0.25) !important;
    border-radius: 12px !important;
    color: var(--beer-foam) !important;
}

.list-group-item.bg-secondary:hover {
    background: rgba(245, 166, 35, 0.18) !important;
}

/* Alerts */
.alert-success {
    background-color: rgba(76, 175, 80, 0.15) !important;
    border-color: rgba(76, 175, 80, 0.4) !important;
    color: #c8e6c9 !important;
}

.alert-info {
    background-color: rgba(245, 166, 35, 0.15) !important;
    border-color: rgba(245, 166, 35, 0.4) !important;
    color: #ffe8b3 !important;
}

.alert-warning {
    background-color: rgba(255, 209, 102, 0.15) !important;
    border-color: rgba(255, 209, 102, 0.4) !important;
    color: #ffe8b3 !important;
}

.alert-danger {
    background-color: rgba(230, 57, 70, 0.15) !important;
    border-color: rgba(230, 57, 70, 0.4) !important;
    color: #ffd1d1 !important;
}

/* Form controls */
.form-control,
.form-select {
    background-color: rgba(43, 29, 14, 0.85) !important;
    color: var(--beer-foam) !important;
    border: 1px solid rgba(245, 166, 35, 0.35) !important;
    border-radius: 10px !important;
}

.form-control:focus,
.form-select:focus {
    background-color: rgba(43, 29, 14, 0.95) !important;
    color: var(--beer-foam) !important;
    border-color: var(--beer-amber) !important;
    box-shadow: 0 0 0 0.2rem rgba(245, 166, 35, 0.25) !important;
}

.form-label {
    color: var(--beer-amber-light);
    font-weight: 600;
}
