@import "fonts.css";

:root {
    --tennis-green:  #2ecc71;
    --tennis-orange: #e67e22;
    --tennis-dark:   #2c3e50;
}

/* ── Global button ── */
.btn-tennis {
    background: var(--tennis-green, #2ecc71) !important;
    color: #fff !important;
    border: none;
    border-radius: 25px;
    padding: 10px 28px;
    font-weight: 700;
    transition: background 0.2s, transform 0.1s;
}
.btn-tennis:hover {
    background: #27ae60;
    color: #fff;
    transform: translateY(-1px);
}

/* ── Footer ── */
footer {
    background: #1a252f;
    color: rgba(255,255,255,0.8);
    padding: 60px 0 0;
}
footer .footer-brand { font-size: 1.5rem; font-weight: 800; color: #fff; }
footer .footer-heading { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.5); margin-bottom: 16px; }
footer .footer-link { color: rgba(255,255,255,0.7); text-decoration: none; display: block; margin-bottom: 8px; font-size: 0.9rem; transition: color 0.2s; }
footer .footer-link:hover { color: #fff; }
footer .footer-bottom { border-top: 1px solid rgba(255,255,255,0.1); padding: 20px 0; margin-top: 40px; font-size: 0.85rem; color: rgba(255,255,255,0.5); }
footer .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.8);
    font-size: 1rem;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
footer .social-icon:hover { background: var(--tennis-green, #2ecc71); color: #fff; }

.modal-section-label {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #9ba4af;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid #f0f2f4;
}