:root {
    --primary-color: #0d6efd;
    --secondary-color: #6c757d;
    --success-color: #198754;
    --info-color: #0dcaf0;
}

body {
    background-color: #f8f9fa;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.navbar-brand {
    font-weight: 600;
}

.card {
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
    border: none;
    margin-bottom: 20px;
}

.card-header {
    background-color: #fff;
    border-bottom: 2px solid var(--primary-color);
    font-weight: 600;
}

.club-card {
    transition: transform 0.2s;
}

.club-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.1);
}

.athlete-row {
    border-left: 3px solid transparent;
    transition: all 0.2s;
}

.athlete-row:hover {
    background-color: rgba(13, 110, 253, 0.05);
    border-left-color: var(--primary-color);
}

.gender-f { color: #e83e8c; }
.gender-m { color: #0d6efd; }
.gender-x { color: #6f42c1; }

.badge-stroke {
    background-color: #e9ecef;
    color: #495057;
    font-weight: 500;
}

.search-highlight {
    background-color: #fff3cd;
    padding: 2px 0;
    border-radius: 3px;
}

.tab-content {
    background-color: #fff;
    border-radius: 0 0 10px 10px;
    padding: 20px;
    border: 1px solid #dee2e6;
    border-top: none;
}

.nav-tabs .nav-link.active {
    font-weight: 600;
    border-bottom: 3px solid var(--primary-color);
}

.event-badge {
    font-size: 0.8rem;
    margin-right: 5px;
    margin-bottom: 5px;
}

.fade-in {
    animation: fadeIn 0.5s;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.meet-info {
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 25px;
}

.table-responsive {
    border-radius: 8px;
    overflow: hidden;
}

.table thead th {
    background-color: #f1f5f9;
    border-bottom: 2px solid #dee2e6;
    font-weight: 600;
}

/* Додаткові стилі для кращого вигляду */
.club-card .card-header {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

.athlete-count-badge {
    cursor: pointer;
    transition: transform 0.2s;
}

.athlete-count-badge:hover {
    transform: scale(1.1);
}

.relay-card {
    border-left: 4px solid var(--info-color);
}

.badge.gender-m {
    background-color: rgba(13, 110, 253, 0.1);
    border: 1px solid #0d6efd;
}

.badge.gender-f {
    background-color: rgba(232, 62, 140, 0.1);
    border: 1px solid #e83e8c;
}

.badge.gender-x {
    background-color: rgba(111, 66, 193, 0.1);
    border: 1px solid #6f42c1;
}

@media (max-width: 768px) {
    .meet-info .row > div {
        margin-bottom: 15px;
    }
    
    .card-body {
        padding: 1rem;
    }
}