/* Theme Variables - Grand Slam Color Schemes */
/* Using official tournament colors */

/* Wimbledon Theme - Traditional Green (Grass Court) */
.theme-wimbledon {
    --primary-color: #006640; /* Official Wimbledon green */
    --secondary-color: #4B0082; /* Wimbledon purple */
    --accent-color: #ffffff;
    --bg-light: #f0f7ed;
    --success-color: #006640; /* Wimbledon green for success */
    --error-color: #d32f2f; /* Red for errors */
    --warning-color: #f57c00; /* Orange for warnings */
}

.theme-wimbledon .hero-title,
.theme-wimbledon .section-title,
.theme-wimbledon .logo h1 {
    color: var(--primary-color);
}

.theme-wimbledon .logo-icon {
    filter: brightness(0) saturate(100%) invert(25%) sepia(95%) saturate(2300%) hue-rotate(130deg) brightness(0.9) contrast(1.1);
}

.theme-wimbledon .theme-btn.theme-wimbledon {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-wimbledon .kpi-number,
.theme-wimbledon .search-button {
    color: var(--primary-color);
}

.theme-wimbledon .search-button {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-wimbledon .kpi-card,
.theme-wimbledon .club-card,
.theme-wimbledon .feature-card {
    border-top: 4px solid var(--primary-color);
}

.theme-wimbledon .hero .btn-primary {
    background: linear-gradient(135deg, #006640 0%, #4B0082 100%);
    color: var(--accent-color);
}

.theme-wimbledon .hero .btn-secondary {
    background-color: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-wimbledon .hero .btn-secondary:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-wimbledon .hero {
    background: var(--bg-light);
}

/* Roland Garros Theme - Red/Orange (Clay Court) */
.theme-roland-garros {
    --primary-color: #D4522A; /* Official Roland Garros orange-red */
    --secondary-color: #8B4513; /* Clay brown */
    --accent-color: #ffffff;
    --bg-light: #fff5f5;
    --success-color: #388e3c; /* Green for success */
    --error-color: #d32f2f; /* Red for errors */
    --warning-color: #f57c00; /* Orange for warnings */
}

.theme-roland-garros .hero-title,
.theme-roland-garros .section-title,
.theme-roland-garros .logo h1 {
    color: var(--primary-color);
}

.theme-roland-garros .logo-icon {
    filter: brightness(0) saturate(100%) invert(42%) sepia(90%) saturate(2800%) hue-rotate(350deg) brightness(0.9) contrast(1.1);
}

.theme-roland-garros .theme-btn.theme-roland-garros {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-roland-garros .kpi-number,
.theme-roland-garros .search-button {
    color: var(--primary-color);
}

.theme-roland-garros .search-button {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-roland-garros .kpi-card,
.theme-roland-garros .club-card,
.theme-roland-garros .feature-card {
    border-top: 4px solid var(--primary-color);
}

.theme-roland-garros .hero .btn-primary {
    background: linear-gradient(135deg, #D4522A 0%, #8B4513 100%);
    color: var(--accent-color);
}

.theme-roland-garros .hero .btn-secondary {
    background-color: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-roland-garros .hero .btn-secondary:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-roland-garros .hero {
    background: var(--bg-light);
}

/* Australian Open Theme - Blue and Gold */
.theme-australian-open {
    --primary-color: #0085CA; /* Official Australian Open blue */
    --secondary-color: #FFC72C; /* Australian Open gold/yellow */
    --accent-color: #ffffff;
    --bg-light: #f0f7fc;
    --success-color: #1976d2; /* Blue-green for success */
    --error-color: #d32f2f; /* Red for errors */
    --warning-color: #f57c00; /* Orange for warnings */
}

.theme-australian-open .hero-title,
.theme-australian-open .section-title,
.theme-australian-open .logo h1 {
    color: var(--primary-color);
}

.theme-australian-open .logo-icon {
    filter: brightness(0) saturate(100%) invert(45%) sepia(95%) saturate(1476%) hue-rotate(176deg) brightness(1) contrast(1);
}

.theme-australian-open .theme-btn.theme-australian-open {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-australian-open .kpi-number,
.theme-australian-open .search-button {
    color: var(--primary-color);
}

.theme-australian-open .search-button {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-australian-open .kpi-card,
.theme-australian-open .club-card,
.theme-australian-open .feature-card {
    border-top: 4px solid var(--primary-color);
}

.theme-australian-open .hero .btn-primary {
    background: linear-gradient(135deg, #0085CA 0%, #FFC72C 100%);
    color: var(--accent-color);
}

.theme-australian-open .hero .btn-secondary {
    background-color: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-australian-open .hero .btn-secondary:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-australian-open .hero {
    background: var(--bg-light);
}

/* US Open Theme - Dark Blue and Black */
.theme-us-open {
    --primary-color: #003087; /* Official US Open dark blue */
    --secondary-color: #000000; /* Black */
    --accent-color: #ffffff;
    --bg-light: #f0f2f7;
    --success-color: #1976d2; /* Blue for success */
    --error-color: #d32f2f; /* Red for errors */
    --warning-color: #f57c00; /* Orange for warnings */
}

.theme-us-open .hero-title,
.theme-us-open .section-title,
.theme-us-open .logo h1 {
    color: var(--primary-color);
}

.theme-us-open .logo-icon {
    filter: brightness(0) saturate(100%) invert(10%) sepia(95%) saturate(5468%) hue-rotate(215deg) brightness(0.5) contrast(1.2);
}

.theme-us-open .theme-btn.theme-us-open {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-us-open .kpi-number,
.theme-us-open .search-button {
    color: var(--primary-color);
}

.theme-us-open .search-button {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-us-open .kpi-card,
.theme-us-open .club-card,
.theme-us-open .feature-card {
    border-top: 4px solid var(--primary-color);
}

.theme-us-open .hero .btn-primary {
    background: linear-gradient(135deg, #003087 0%, #000000 100%);
    color: var(--accent-color);
}

.theme-us-open .hero .btn-secondary {
    background-color: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-us-open .hero .btn-secondary:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-us-open .hero {
    background: var(--bg-light);
}

/* Theme-specific theme-toggle icon styles */
.theme-wimbledon .theme-toggle {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-wimbledon .theme-toggle:hover {
    background-color: rgba(0, 102, 64, 0.1);
    border-color: var(--primary-color);
}

.theme-wimbledon .theme-toggle .material-symbols-outlined {
    color: var(--primary-color);
}

.theme-roland-garros .theme-toggle {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-roland-garros .theme-toggle:hover {
    background-color: rgba(212, 82, 42, 0.1);
    border-color: var(--primary-color);
}

.theme-roland-garros .theme-toggle .material-symbols-outlined {
    color: var(--primary-color);
}

.theme-australian-open .theme-toggle {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-australian-open .theme-toggle:hover {
    background-color: rgba(0, 133, 202, 0.1);
    border-color: var(--primary-color);
}

.theme-australian-open .theme-toggle .material-symbols-outlined {
    color: var(--primary-color);
}

.theme-us-open .theme-toggle {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-us-open .theme-toggle:hover {
    background-color: rgba(0, 48, 135, 0.1);
    border-color: var(--primary-color);
}

.theme-us-open .theme-toggle .material-symbols-outlined {
    color: var(--primary-color);
}

/* Theme-specific login button styles */
.theme-wimbledon .btn-login {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-wimbledon .btn-login:hover {
    background-color: var(--secondary-color);
}

.theme-roland-garros .btn-login {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-roland-garros .btn-login:hover {
    background-color: #b83f1f;
}

.theme-australian-open .btn-login {
    background-color: var(--primary-color);
    color: var(--accent-color);
}

.theme-australian-open .btn-login:hover {
    background-color: #0066a3;
}

.theme-us-open .btn-login {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-us-open .btn-login:hover {
    background-color: #001d4a;
    border-color: #001d4a;
}

/* Theme-specific primary button styles (outside hero) */
/* These apply to buttons outside the hero section */
.theme-wimbledon .btn-primary,
.theme-wimbledon .nav-links .btn-sign-up {
    background: linear-gradient(135deg, #006640 0%, #4B0082 100%);
    color: var(--accent-color);
}

.theme-roland-garros .btn-primary,
.theme-roland-garros .nav-links .btn-sign-up {
    background: linear-gradient(135deg, #D4522A 0%, #8B4513 100%);
    color: var(--accent-color);
}

.theme-australian-open .btn-primary,
.theme-australian-open .nav-links .btn-sign-up {
    background: linear-gradient(135deg, #0085CA 0%, #FFC72C 100%);
    color: var(--accent-color);
}

.theme-us-open .btn-primary,
.theme-us-open .nav-links .btn-sign-up {
    background: linear-gradient(135deg, #003087 0%, #000000 100%);
    color: var(--accent-color);
}

/* Theme-specific nav link hover colors */
.theme-wimbledon .nav-links a:hover {
    color: var(--primary-color);
}

.theme-roland-garros .nav-links a:hover {
    color: var(--primary-color);
}

.theme-australian-open .nav-links a:hover {
    color: var(--primary-color);
}

.theme-us-open .nav-links a:hover {
    color: var(--primary-color);
}

/* Theme-specific nav sign-in buttons */
.theme-wimbledon .nav-links .btn-sign-in {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-wimbledon .nav-links .btn-sign-in:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-roland-garros .nav-links .btn-sign-in {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-roland-garros .nav-links .btn-sign-in:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-australian-open .nav-links .btn-sign-in {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-australian-open .nav-links .btn-sign-in:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

.theme-us-open .nav-links .btn-sign-in {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.theme-us-open .nav-links .btn-sign-in:hover {
    background-color: var(--primary-color);
    color: var(--accent-color);
    border-color: var(--primary-color);
}

/* Theme-specific footer styles */
.theme-wimbledon .footer {
    background: linear-gradient(135deg, #006640 0%, #004d31 100%);
    color: var(--accent-color);
}

.theme-wimbledon .footer-section a {
    color: rgba(255, 255, 255, 0.8);
}

.theme-wimbledon .footer-section a:hover {
    color: var(--secondary-color);
}

.theme-wimbledon .footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.theme-roland-garros .footer {
    background: linear-gradient(135deg, #D4522A 0%, #B83F1F 100%);
    color: var(--accent-color);
}

.theme-roland-garros .footer-section a {
    color: rgba(255, 255, 255, 0.8);
}

.theme-roland-garros .footer-section a:hover {
    color: #ffb74d;
}

.theme-roland-garros .footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.theme-australian-open .footer {
    background: linear-gradient(135deg, #0085CA 0%, #0066a3 100%);
    color: var(--accent-color);
}

.theme-australian-open .footer-section a {
    color: rgba(255, 255, 255, 0.8);
}

.theme-australian-open .footer-section a:hover {
    color: var(--secondary-color);
}

.theme-australian-open .footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.2);
}

.theme-us-open .footer {
    background: linear-gradient(135deg, #003087 0%, #001d4a 100%);
    color: var(--accent-color);
}

.theme-us-open .footer-section a {
    color: rgba(255, 255, 255, 0.8);
}

.theme-us-open .footer-section a:hover {
    color: #ffd700;
}

.theme-us-open .footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.2);
}

/* Theme-specific advantage icon colors */
.theme-wimbledon .advantage-icon {
    color: var(--primary-color);
}

.theme-roland-garros .advantage-icon {
    color: var(--primary-color);
}

.theme-australian-open .advantage-icon {
    color: var(--primary-color);
}

.theme-us-open .advantage-icon {
    color: var(--primary-color);
}

/* Theme-specific benefit icon colors */
.theme-wimbledon .benefit-icon {
    color: var(--primary-color);
}

.theme-roland-garros .benefit-icon {
    color: var(--primary-color);
}

.theme-australian-open .benefit-icon {
    color: var(--primary-color);
}

.theme-us-open .benefit-icon {
    color: var(--primary-color);
}

/* Theme-specific testimonial quote colors */
.theme-wimbledon .quote-icon {
    color: var(--primary-color);
}

.theme-roland-garros .quote-icon {
    color: var(--primary-color);
}

.theme-australian-open .quote-icon {
    color: var(--primary-color);
}

.theme-us-open .quote-icon {
    color: var(--primary-color);
}

/* Theme selector buttons styling */
.theme-btn.theme-wimbledon {
    background-color: #e8f5e9;
    color: #006640;
    border: 1px solid #006640;
}

.theme-btn.theme-roland-garros {
    background-color: #ffebee;
    color: #D4522A;
    border: 1px solid #D4522A;
}

.theme-btn.theme-australian-open {
    background-color: #e3f2fd;
    color: #0085CA;
    border: 1px solid #0085CA;
}

.theme-btn.theme-us-open {
    background-color: #e8eaf6;
    color: #003087;
    border: 1px solid #003087;
}

/* Theme Picker Dropdown Styles */
.theme-picker {
    position: relative;
    display: inline-block;
}

.theme-toggle {
    padding: 0.5rem 1rem;
    background-color: transparent;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--dark);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.theme-toggle .material-symbols-outlined {
    font-size: 1.2rem;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.theme-toggle:hover {
    background-color: rgba(0, 0, 0, 0.05);
    border-color: rgba(0, 0, 0, 0.2);
}

.theme-menu {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 0.5rem;
    background-color: var(--white);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 200px;
    z-index: 1000;
    overflow: hidden;
}

.theme-picker.active .theme-menu {
    display: block;
}

.theme-menu .theme-btn {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
    font-size: 0.9rem;
    text-align: left;
    transition: all 0.2s ease;
    color: var(--dark);
}

.theme-menu .theme-btn:last-child {
    border-bottom: none;
}

.theme-menu .theme-btn:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.theme-menu .theme-btn.active {
    background-color: rgba(0, 0, 0, 0.05);
    font-weight: 600;
}

/* Theme-specific active states for theme menu buttons */
.theme-wimbledon .theme-menu .theme-btn.theme-wimbledon.active {
    background-color: rgba(0, 102, 64, 0.1);
    color: #006640;
    font-weight: 600;
}

.theme-wimbledon .theme-menu .theme-btn.theme-wimbledon:hover {
    background-color: rgba(0, 102, 64, 0.15);
    color: #006640;
}

.theme-roland-garros .theme-menu .theme-btn.theme-roland-garros.active {
    background-color: rgba(212, 82, 42, 0.1);
    color: #D4522A;
    font-weight: 600;
}

.theme-roland-garros .theme-menu .theme-btn.theme-roland-garros:hover {
    background-color: rgba(212, 82, 42, 0.15);
    color: #D4522A;
}

.theme-australian-open .theme-menu .theme-btn.theme-australian-open.active {
    background-color: rgba(0, 133, 202, 0.1);
    color: #0085CA;
    font-weight: 600;
}

.theme-australian-open .theme-menu .theme-btn.theme-australian-open:hover {
    background-color: rgba(0, 133, 202, 0.15);
    color: #0085CA;
}

.theme-us-open .theme-menu .theme-btn.theme-us-open.active {
    background-color: rgba(0, 48, 135, 0.1);
    color: #003087;
    font-weight: 600;
}

.theme-us-open .theme-menu .theme-btn.theme-us-open:hover {
    background-color: rgba(0, 48, 135, 0.15);
    color: #003087;
}

.theme-icon {
    font-size: 1.2rem;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    display: inline-flex;
    align-items: center;
    color: inherit;
}

/* Apply theme background to body */
.theme-wimbledon body {
    background-color: var(--bg-light);
}

.theme-roland-garros body {
    background-color: var(--bg-light);
}

.theme-australian-open body {
    background-color: var(--bg-light);
}

.theme-us-open body {
    background-color: var(--bg-light);
}

/* Mobile responsive */
@media (max-width: 768px) {
    .theme-menu {
        right: 0;
        left: auto;
        min-width: 180px;
    }
}