/**
 * ============================================================================
 * SUITEPADEL — DESIGN SYSTEM (World-Class Theme)
 * ============================================================================
 * Capa de tema premium. Se carga DESPUÉS del resto y redefine los design tokens
 * (custom properties), por lo que actualiza todo el sistema de forma cohesiva e
 * independiente del orden de carga. Mobile-first.
 *
 * Marca SuitePadel · paleta Azure (#1B6FF3) → Court Green (#00D26A) sobre Navy ink.
 * ============================================================================
 */

/* Tipografía moderna (no bloquea el render; usa fallback del sistema) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

/* ============================================================================
   1. DESIGN TOKENS
   ============================================================================ */
:root,
html {
    /* Marca */
    --sp-brand:        #1B6FF3;   /* Azure */
    --sp-brand-600:    #155FD6;
    --sp-brand-700:    #1149A8;
    --sp-brand-050:    #EAF2FE;
    --sp-accent:       #00D26A;   /* Court Green */
    --sp-accent-600:   #00B85C;
    --sp-accent-050:   #E4FBEF;

    /* Compatibilidad con el sistema previo (azul/verde) */
    --primary-blue:  #1B6FF3;
    --primary-green: #00D26A;
    --blue-50:#EAF2FE; --blue-100:#CFE0FD; --blue-200:#A7C7FB; --blue-300:#6FA4F8;
    --blue-400:#3F84F5; --blue-500:#1B6FF3; --blue-600:#155FD6; --blue-700:#1149A8;
    --blue-800:#0C3576; --blue-900:#082249;
    --green-50:#E4FBEF; --green-100:#C2F5DB; --green-200:#8FE9BC; --green-300:#52D997;
    --green-400:#1FCB77; --green-500:#00D26A; --green-600:#00B85C; --green-700:#009149;
    --green-800:#006B36; --green-900:#004523;

    /* Ink / texto / superficies */
    --sp-ink:        #0E1726;   /* navy casi negro */
    --sp-ink-soft:   #2A3650;
    --sp-muted:      #5B6B82;
    --sp-faint:      #8A99AE;
    --sp-line:       #E5EAF2;
    --sp-line-soft:  #EEF2F8;
    --sp-bg:         #F4F7FB;   /* fondo app */
    --sp-surface:    #FFFFFF;
    --sp-surface-2:  #FAFCFF;

    /* Estados */
    --sp-success:#16A34A; --sp-success-bg:#E8F8EE;
    --sp-warning:#D97706; --sp-warning-bg:#FEF3E2;
    --sp-danger:#DC2626;  --sp-danger-bg:#FDECEC;
    --sp-info:#2563EB;    --sp-info-bg:#E8F0FE;

    /* Gradientes de marca */
    --gradient-primary:        linear-gradient(120deg, #1B6FF3 0%, #00D26A 100%);
    --gradient-primary-hover:  linear-gradient(120deg, #155FD6 0%, #00B85C 100%);
    --gradient-primary-vertical: linear-gradient(180deg, #1B6FF3 0%, #00D26A 100%);
    --sp-gradient-hero: radial-gradient(1200px 400px at 10% -20%, rgba(0,210,106,.35), transparent 60%),
                        radial-gradient(1000px 500px at 100% 0%, rgba(27,111,243,.45), transparent 55%),
                        linear-gradient(135deg, #0C3576 0%, #1149A8 45%, #1B6FF3 100%);

    /* Radios */
    --sp-r-xs: 8px; --sp-r-sm: 10px; --sp-r: 14px; --sp-r-lg: 18px; --sp-r-xl: 24px; --sp-r-pill: 999px;
    --radius-sm:10px; --radius:14px; --radius-md:14px; --radius-lg:18px; --radius-xl:24px;

    /* Sombras en capas (suaves, premium) */
    --sp-shadow-xs: 0 1px 2px rgba(14,23,38,.06);
    --sp-shadow-sm: 0 2px 6px rgba(14,23,38,.07), 0 1px 2px rgba(14,23,38,.05);
    --sp-shadow:    0 8px 24px rgba(14,23,38,.09), 0 2px 6px rgba(14,23,38,.06);
    --sp-shadow-lg: 0 18px 48px rgba(14,23,38,.14), 0 6px 16px rgba(14,23,38,.08);
    --sp-shadow-brand: 0 10px 24px rgba(27,111,243,.30);
    --sp-shadow-accent: 0 10px 24px rgba(0,210,106,.28);

    /* Tipografía */
    --sp-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    /* Transición */
    --sp-ease: cubic-bezier(.4,0,.2,1);
    --sp-t: .22s var(--sp-ease);
}

/* ============================================================================
   2. BASE / CONTENEDORES
   ============================================================================ */
.padel-dashboard-frontend,
.padel-club-dashboard,
.padel-club-public-page,
.padel-tournaments-container,
.padel-reservations-frontend,
.padel-player-dashboard,
.padel-club-container,
.padel-registration-container,
.padel-club-registration-form {
    font-family: var(--sp-font);
    color: var(--sp-ink);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    line-height: 1.55;
}
.padel-dashboard-frontend *,
.padel-club-public-page *,
.padel-tournaments-container * { box-sizing: border-box; }

.padel-dashboard-frontend h1, .padel-dashboard-frontend h2, .padel-dashboard-frontend h3,
.padel-club-public-page h1, .padel-club-public-page h2, .padel-club-public-page h3 {
    font-family: var(--sp-font);
    color: var(--sp-ink);
    letter-spacing: -.02em;
    font-weight: 800;
    line-height: 1.2;
}

/* ============================================================================
   3. HERO / HEADER
   ============================================================================ */
.padel-hero-header,
.padel-dashboard-header,
.padel-club-header-improved {
    position: relative;
    overflow: hidden;
    background: var(--sp-gradient-hero);
    color: #fff;
    border-radius: var(--sp-r-xl);
    padding: clamp(28px, 6vw, 56px) clamp(20px, 5vw, 48px);
    box-shadow: var(--sp-shadow-lg);
    margin-bottom: clamp(20px, 4vw, 32px);
    isolation: isolate;
}
.padel-hero-header::after,
.padel-dashboard-header::after {
    content: "";
    position: absolute; inset: 0; z-index: -1;
    background-image:
        repeating-linear-gradient(115deg, rgba(255,255,255,.05) 0 2px, transparent 2px 22px);
    opacity: .6; pointer-events: none;
}
.padel-hero-header h1, .padel-hero-header h2,
.padel-dashboard-header h1, .padel-dashboard-header h2,
.padel-club-header-improved h1 {
    color: #fff;
    font-size: clamp(1.7rem, 4.5vw, 2.6rem);
    margin: 0 0 .35em;
    text-shadow: 0 2px 18px rgba(0,0,0,.18);
}
.padel-hero-header p, .padel-dashboard-header p {
    color: rgba(255,255,255,.85);
    font-size: clamp(.95rem, 2.5vw, 1.1rem);
    max-width: 60ch; margin: 0;
}
.padel-hero-header--green,      .padel-hero-header--green-dark { background: linear-gradient(135deg,#006B36 0%,#00B85C 60%,#00D26A 100%); }
.padel-hero-header--blue,       .padel-hero-header--blue-dark  { background: linear-gradient(135deg,#082249 0%,#1149A8 55%,#1B6FF3 100%); }
.padel-hero-header--dark { background: linear-gradient(135deg,#0E1726 0%,#1B2942 100%); }

/* ============================================================================
   4. BOTONES
   ============================================================================ */
.padel-button, .padel-btn,
.padel-button-primary, .padel-btn-primary,
.padel-button-secondary, .padel-btn-secondary,
.padel-button-danger, .padel-button-small {
    display: inline-flex; align-items: center; justify-content: center; gap: .5em;
    font-family: var(--sp-font);
    font-weight: 600; font-size: .95rem; line-height: 1;
    padding: .8em 1.4em;
    border-radius: var(--sp-r-pill);
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: transform var(--sp-t), box-shadow var(--sp-t), background var(--sp-t), border-color var(--sp-t), color var(--sp-t);
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}
.padel-button:focus-visible, .padel-btn:focus-visible {
    outline: 3px solid var(--sp-brand-050); outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(27,111,243,.35);
}
/* Primario */
.padel-button, .padel-button-primary, .padel-btn-primary {
    background: var(--gradient-primary);
    color: #fff;
    box-shadow: var(--sp-shadow-brand);
}
.padel-button:hover, .padel-button-primary:hover, .padel-btn-primary:hover {
    background: var(--gradient-primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(27,111,243,.38);
}
.padel-button:active, .padel-btn-primary:active { transform: translateY(0); }
/* Secundario (ghost) */
.padel-button-secondary, .padel-btn-secondary, .padel-btn {
    background: var(--sp-surface);
    color: var(--sp-ink);
    border-color: var(--sp-line);
    box-shadow: var(--sp-shadow-xs);
}
.padel-button-secondary:hover, .padel-btn-secondary:hover, .padel-btn:hover {
    border-color: var(--sp-brand);
    color: var(--sp-brand);
    transform: translateY(-2px);
    box-shadow: var(--sp-shadow-sm);
}
/* Peligro */
.padel-button-danger {
    background: var(--sp-danger); color: #fff;
    box-shadow: 0 8px 20px rgba(220,38,38,.28);
}
.padel-button-danger:hover { background:#b91c1c; transform: translateY(-2px); }
/* Pequeño */
.padel-button-small { padding: .55em 1em; font-size: .82rem; }

/* ============================================================================
   5. CARDS
   ============================================================================ */
.padel-card, .padel-feature, .padel-court-box, .padel-info-item,
.padel-payment-option, .padel-stat-card {
    background: var(--sp-surface);
    border: 1px solid var(--sp-line);
    border-radius: var(--sp-r-lg);
    padding: clamp(18px, 3vw, 26px);
    box-shadow: var(--sp-shadow-sm);
    transition: transform var(--sp-t), box-shadow var(--sp-t), border-color var(--sp-t);
}
.padel-card:hover, .padel-feature:hover, .padel-court-box:hover, .padel-payment-option:hover {
    transform: translateY(-3px);
    box-shadow: var(--sp-shadow);
    border-color: #DBE6F6;
}
/* Stat cards (KPI) */
.padel-stat-card {
    display: flex; flex-direction: column; gap: .35rem;
    border-left: 4px solid var(--sp-brand);
}
.padel-stat-card .stat-number, .padel-stat-card .padel-stat-number,
.padel-stat-card strong { font-size: clamp(1.6rem,4vw,2.2rem); font-weight: 800; color: var(--sp-ink); letter-spacing:-.02em; }
.padel-stat-card .stat-label, .padel-stat-card .padel-stat-label { color: var(--sp-muted); font-size:.85rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; }

.padel-info-grid {
    display: grid; gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

/* ============================================================================
   6. TABS / NAVEGACIÓN
   ============================================================================ */
.padel-dashboard-nav, .padel-reservations-tabs {
    margin-bottom: clamp(18px, 3vw, 28px);
}
.padel-tabs {
    display: flex; gap: 6px;
    list-style: none; margin: 0; padding: 6px;
    background: var(--sp-surface);
    border: 1px solid var(--sp-line);
    border-radius: var(--sp-r-pill);
    box-shadow: var(--sp-shadow-xs);
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.padel-tabs::-webkit-scrollbar { display: none; }
.padel-tabs li { list-style: none; margin: 0; flex: 0 0 auto; }
.padel-tabs a, .padel-tab-btn {
    display: inline-flex; align-items: center; gap: .5em;
    padding: .65em 1.15em;
    border-radius: var(--sp-r-pill);
    color: var(--sp-muted);
    font-weight: 600; font-size: .92rem;
    text-decoration: none; white-space: nowrap;
    border: none; background: transparent; cursor: pointer;
    transition: background var(--sp-t), color var(--sp-t), box-shadow var(--sp-t);
}
.padel-tabs a:hover, .padel-tab-btn:hover { color: var(--sp-brand); background: var(--sp-brand-050); }
.padel-tabs li.active a, .padel-tab-btn.active {
    background: var(--gradient-primary);
    color: #fff;
    box-shadow: var(--sp-shadow-brand);
}
.padel-tab-icon { font-size: 1.05em; line-height: 1; }

/* ============================================================================
   7. TABLAS
   ============================================================================ */
.padel-table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--sp-r-lg); border:1px solid var(--sp-line); box-shadow: var(--sp-shadow-xs); }
.padel-table {
    width: 100%; border-collapse: collapse; background: var(--sp-surface);
    font-size: .92rem; overflow: hidden;
}
.padel-table thead th {
    background: var(--sp-ink);
    color: #fff; font-weight: 700; text-align: left;
    padding: 14px 16px; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em;
    position: sticky; top: 0;
}
.padel-table tbody td { padding: 13px 16px; border-top: 1px solid var(--sp-line-soft); color: var(--sp-ink-soft); }
.padel-table tbody tr:nth-child(even) td { background: var(--sp-surface-2); }
.padel-table tbody tr:hover td { background: var(--sp-brand-050); }

/* ============================================================================
   8. FORMULARIOS
   ============================================================================ */
.padel-form, .padel-create-form, .padel-edit-form, .padel-club-registration-form {
    display: grid; gap: 18px;
    background: var(--sp-surface);
    border: 1px solid var(--sp-line);
    border-radius: var(--sp-r-lg);
    padding: clamp(20px, 4vw, 32px);
    box-shadow: var(--sp-shadow-sm);
}
.padel-form label, .padel-create-form label, .padel-edit-form label, .padel-club-registration-form label {
    display: block; font-weight: 600; font-size: .88rem; color: var(--sp-ink-soft); margin-bottom: 7px;
}
.padel-form input, .padel-form select, .padel-form textarea,
.padel-create-form input, .padel-create-form select, .padel-create-form textarea,
.padel-edit-form input, .padel-edit-form select, .padel-edit-form textarea,
.padel-club-registration-form input, .padel-club-registration-form select, .padel-club-registration-form textarea,
.padel-dashboard-frontend input:not([type=checkbox]):not([type=radio]),
.padel-dashboard-frontend select,
.padel-dashboard-frontend textarea {
    width: 100%;
    font-family: var(--sp-font); font-size: .95rem; color: var(--sp-ink);
    padding: .8em 1em;
    background: var(--sp-surface-2);
    border: 1.5px solid var(--sp-line);
    border-radius: var(--sp-r-sm);
    transition: border-color var(--sp-t), box-shadow var(--sp-t), background var(--sp-t);
    -webkit-appearance: none; appearance: none;
}
.padel-form input:focus, .padel-form select:focus, .padel-form textarea:focus,
.padel-create-form input:focus, .padel-edit-form input:focus,
.padel-club-registration-form input:focus,
.padel-dashboard-frontend input:focus, .padel-dashboard-frontend select:focus, .padel-dashboard-frontend textarea:focus {
    outline: none;
    border-color: var(--sp-brand);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(27,111,243,.14);
}
.padel-validation-msg, .padel-error { color: var(--sp-danger); font-size: .82rem; font-weight: 600; }

/* ============================================================================
   9. NOTICES / ALERTS / BADGES
   ============================================================================ */
.padel-notice, .padel-alert, .padel-dashboard-message {
    border-radius: var(--sp-r); padding: 14px 16px 14px 18px;
    font-size: .92rem; font-weight: 500;
    border: 1px solid transparent;
    border-left-width: 4px;
    display: flex; gap: .6em; align-items: flex-start;
}
.padel-notice-info, .padel-info, .padel-dashboard-message { background: var(--sp-info-bg); border-color: #BBD3FB; border-left-color: var(--sp-info); color:#143E8C; }
.padel-notice-success, .padel-success { background: var(--sp-success-bg); border-color:#B9E9C9; border-left-color: var(--sp-success); color:#13683A; }
.padel-notice-warning { background: var(--sp-warning-bg); border-color:#F6D9A8; border-left-color: var(--sp-warning); color:#92560A; }
.padel-notice-error { background: var(--sp-danger-bg); border-color:#F4BFBF; border-left-color: var(--sp-danger); color:#9B1C1C; }

.padel-badge, .padel-status, .padel-tag {
    display:inline-flex; align-items:center; gap:.4em;
    padding:.32em .8em; border-radius: var(--sp-r-pill);
    font-size:.76rem; font-weight:700; letter-spacing:.02em; text-transform:uppercase;
    background: var(--sp-brand-050); color: var(--sp-brand-700);
}
.padel-badge--green, .padel-status-approved, .padel-status-paid { background: var(--sp-accent-050); color: var(--sp-green-700,#009149); }
.padel-badge--warn, .padel-status-pending { background: var(--sp-warning-bg); color: var(--sp-warning); }
.padel-badge--red, .padel-status-rejected { background: var(--sp-danger-bg); color: var(--sp-danger); }

/* ============================================================================
   10. MODALES
   ============================================================================ */
.padel-modal-overlay, .padel-modal {
    position: fixed; inset: 0; z-index: 99999;
    display: flex; align-items: center; justify-content: center;
    background: rgba(14,23,38,.55);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    padding: 16px;
    animation: sp-fade .2s var(--sp-ease);
}
.padel-modal-content {
    background: var(--sp-surface);
    width: 100%; max-width: 540px; max-height: 90vh; overflow-y: auto;
    border-radius: var(--sp-r-xl);
    box-shadow: var(--sp-shadow-lg);
    animation: sp-pop .26s var(--sp-ease);
}
.padel-modal-header {
    display:flex; align-items:center; justify-content:space-between;
    padding: 20px 24px; border-bottom: 1px solid var(--sp-line);
}
.padel-modal-header h2, .padel-modal-header h3 { margin:0; font-size:1.2rem; }
.padel-modal-body { padding: 22px 24px; }
.padel-modal-footer, .padel-modal-actions { display:flex; gap:10px; justify-content:flex-end; padding: 16px 24px 22px; flex-wrap: wrap; }
.padel-modal-close {
    width:38px; height:38px; border-radius:50%; border:none; cursor:pointer;
    background: var(--sp-bg); color: var(--sp-muted); font-size:1.2rem; line-height:1;
    display:inline-flex; align-items:center; justify-content:center;
    transition: background var(--sp-t), color var(--sp-t);
}
.padel-modal-close:hover { background: var(--sp-danger-bg); color: var(--sp-danger); }
@keyframes sp-fade { from{opacity:0} to{opacity:1} }
@keyframes sp-pop { from{opacity:0; transform: translateY(12px) scale(.98)} to{opacity:1; transform:none} }

/* ============================================================================
   11. RESERVAS — slots / calendario
   ============================================================================ */
.padel-slots-list { display:grid; gap:10px; grid-template-columns: repeat(auto-fill, minmax(96px,1fr)); }
.padel-slot {
    text-align:center; padding:.7em .4em; font-weight:700; font-size:.9rem;
    border:1.5px solid var(--sp-line); border-radius: var(--sp-r-sm);
    background: var(--sp-surface); color: var(--sp-ink-soft); cursor:pointer;
    transition: all var(--sp-t);
}
.padel-slot:hover { border-color: var(--sp-brand); color: var(--sp-brand); transform: translateY(-2px); box-shadow: var(--sp-shadow-sm); }
.padel-slot.selected, .padel-slot.active { background: var(--gradient-primary); color:#fff; border-color: transparent; box-shadow: var(--sp-shadow-brand); }
.padel-slot.booked, .padel-slot.disabled { background: var(--sp-bg); color: var(--sp-faint); cursor:not-allowed; opacity:.7; }

/* ============================================================================
   12. CUADROS / PARTIDOS
   ============================================================================ */
.padel-result-row, .padel-teams-display {
    display:flex; align-items:center; gap:14px;
    background: var(--sp-surface); border:1px solid var(--sp-line);
    border-radius: var(--sp-r); padding: 14px 16px; box-shadow: var(--sp-shadow-xs);
}
.padel-team { flex:1; font-weight:600; color: var(--sp-ink); }
.padel-vs {
    flex:0 0 auto; width:38px; height:38px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    background: var(--sp-ink); color:#fff; font-weight:800; font-size:.8rem;
}
.padel-winner-display { color: var(--sp-success); font-weight:800; }
.padel-group-header, .padel-section-header, .padel-court-header {
    font-weight:800; color: var(--sp-ink); letter-spacing:-.01em;
    padding-bottom:10px; margin-bottom:14px; border-bottom:2px solid var(--sp-line);
    display:flex; align-items:center; gap:.5em;
}
.padel-section-title { font-size: clamp(1.15rem,3vw,1.45rem); font-weight:800; }

.padel-score-inputs input { width:54px !important; text-align:center; font-weight:700; }

/* ============================================================================
   13. ESTADOS DE ACCESO / VACÍOS
   ============================================================================ */
.padel-login-required, .padel-no-content {
    text-align:center; padding: clamp(32px,7vw,64px) 20px;
    background: var(--sp-surface); border:1px dashed var(--sp-line);
    border-radius: var(--sp-r-xl); color: var(--sp-muted);
    box-shadow: var(--sp-shadow-xs);
}
.padel-login-required h2, .padel-no-content h2 { color: var(--sp-ink); }

/* ============================================================================
   14. UTILIDADES / GRIDS RESPONSIVE
   ============================================================================ */
.padel-action-buttons { display:flex; flex-wrap:wrap; gap:10px; }
.padel-tournaments-list { display:grid; gap:18px; grid-template-columns: 1fr; }

/* ============================================================================
   15. RESPONSIVE (mobile-first → escalado)
   ============================================================================ */
@media (min-width: 600px) {
    .padel-tournaments-list { grid-template-columns: repeat(2, 1fr); }
    .padel-modal-footer, .padel-modal-actions { justify-content:flex-end; }
}
@media (min-width: 900px) {
    .padel-tournaments-list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 560px) {
    .padel-action-buttons { flex-direction: column; }
    .padel-action-buttons .padel-button,
    .padel-action-buttons .padel-btn { width: 100%; }
    .padel-modal-footer, .padel-modal-actions { flex-direction: column-reverse; }
    .padel-modal-footer .padel-button, .padel-modal-actions .padel-button { width:100%; }
    .padel-hero-header { border-radius: var(--sp-r-lg); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ============================================================================
   16. POLISH DE CLASES GENÉRICAS (scopeado a contenedores del plugin)
   ----------------------------------------------------------------------------
   Algunos templates usan clases sin prefijo (.btn, .button-primary, .search-*).
   Las elevamos al estándar SuitePadel SOLO dentro de los contenedores del plugin
   para no afectar el resto del sitio. !important para vencer al CSS heredado.
   ============================================================================ */
.padel-club-finder-container .btn, .padel-club-finder-container .button,
.padel-tournaments-container .btn, .padel-tournaments-container .button,
.padel-reservations-container .btn, .padel-reservations-container .button,
.padel-registration-form-container .btn, .padel-registration-form-container .button,
.padel-registration-form .btn, .padel-registration-form .button,
.padel-bracket-container .btn, .padel-bracket-container .button,
.padel-dashboard-frontend .btn, .padel-dashboard-frontend .button,
.padel-club-public-page .btn, .padel-club-public-page .button,
.padel-club-finder-container .tournament-btn,
.padel-tournaments-container .tournament-btn {
    display: inline-flex !important; align-items: center; justify-content: center; gap: .5em;
    font-family: var(--sp-font) !important;
    font-weight: 600 !important; font-size: .95rem; line-height: 1;
    padding: .8em 1.5em !important;
    border-radius: var(--sp-r-pill) !important;
    border: 1px solid transparent !important;
    box-shadow: var(--sp-shadow-xs);
    cursor: pointer; text-decoration: none !important;
    transition: transform var(--sp-t), box-shadow var(--sp-t), background var(--sp-t), border-color var(--sp-t), color var(--sp-t) !important;
}
/* Primarios */
.padel-club-finder-container .btn-primary, .padel-club-finder-container .button-primary,
.padel-tournaments-container .btn-primary, .padel-tournaments-container .button-primary,
.padel-reservations-container .btn-primary, .padel-reservations-container .button-primary,
.padel-registration-form-container .btn-primary, .padel-registration-form-container .button-primary,
.padel-registration-form .btn-primary, .padel-registration-form .button-primary,
.padel-dashboard-frontend .btn-primary, .padel-dashboard-frontend .button-primary,
.padel-club-public-page .btn-primary, .padel-club-public-page .button-primary,
.padel-payment-submit, .padel-club-finder-container .tournament-btn {
    background: var(--gradient-primary) !important;
    color: #fff !important;
    box-shadow: var(--sp-shadow-brand) !important;
}
.padel-club-finder-container .btn-primary:hover, .padel-tournaments-container .btn-primary:hover,
.padel-reservations-container .btn-primary:hover, .padel-registration-form .btn-primary:hover,
.padel-dashboard-frontend .btn-primary:hover, .padel-club-public-page .btn-primary:hover,
.padel-tournaments-container .button-primary:hover, .padel-reservations-container .button-primary:hover {
    background: var(--gradient-primary-hover) !important;
    transform: translateY(-2px); box-shadow: 0 14px 30px rgba(27,111,243,.38) !important;
}
/* Secundarios (ghost) */
.padel-club-finder-container .btn-secondary, .padel-club-finder-container .button-secondary,
.padel-tournaments-container .btn-secondary, .padel-tournaments-container .button-secondary,
.padel-reservations-container .btn-secondary, .padel-reservations-container .button-secondary,
.padel-registration-form .btn-secondary, .padel-dashboard-frontend .btn-secondary,
.padel-club-public-page .btn-secondary {
    background: var(--sp-surface) !important;
    color: var(--sp-ink) !important;
    border-color: var(--sp-line) !important;
    box-shadow: var(--sp-shadow-xs) !important;
}
.padel-club-finder-container .btn-secondary:hover, .padel-tournaments-container .btn-secondary:hover,
.padel-reservations-container .btn-secondary:hover {
    border-color: var(--sp-brand) !important; color: var(--sp-brand) !important; transform: translateY(-2px);
}

/* Inputs y selects de búsqueda */
.padel-club-finder-container .search-input, .padel-club-finder-container .search-select,
.padel-tournaments-container input, .padel-tournaments-container select,
.padel-reservations-container input:not([type=radio]):not([type=checkbox]), .padel-reservations-container select, .padel-reservations-container textarea {
    font-family: var(--sp-font) !important; font-size: .95rem !important; color: var(--sp-ink) !important;
    padding: .75em 1em !important;
    background: var(--sp-surface-2) !important;
    border: 1.5px solid var(--sp-line) !important;
    border-radius: var(--sp-r-sm) !important;
    box-shadow: none !important;
    transition: border-color var(--sp-t), box-shadow var(--sp-t) !important;
}
.padel-club-finder-container .search-input:focus, .padel-club-finder-container .search-select:focus,
.padel-tournaments-container input:focus, .padel-tournaments-container select:focus,
.padel-reservations-container input:focus, .padel-reservations-container select:focus, .padel-reservations-container textarea:focus {
    outline: none !important; border-color: var(--sp-brand) !important; background:#fff !important;
    box-shadow: 0 0 0 4px rgba(27,111,243,.14) !important;
}
.padel-club-finder-container .search-actions, .padel-tournaments-container .tournaments-filters .search-actions {
    display: flex; gap: 10px; flex-wrap: wrap;
}

/* Stat cards genéricas */
.padel-dashboard-frontend .stat-card-compact, .padel-club-public-page .stat-card-compact {
    background: var(--sp-surface) !important;
    border: 1px solid var(--sp-line) !important;
    border-left: 4px solid var(--sp-brand) !important;
    border-radius: var(--sp-r-lg) !important;
    box-shadow: var(--sp-shadow-sm) !important;
}
.padel-dashboard-frontend .stat-number, .padel-club-public-page .stat-number { color: var(--sp-ink) !important; font-weight: 800 !important; }

/* Mobile: botones full-width en filtros/acciones */
@media (max-width: 560px) {
    .padel-club-finder-container .search-actions .btn,
    .padel-tournaments-container .tournaments-filters .btn,
    .padel-tournaments-container .tournaments-filters .button,
    .padel-reservations-container .search-actions .btn,
    .padel-reservations-container .search-actions .button,
    .padel-registration-form .btn,
    .padel-registration-form .button { width: 100%; }
    .padel-reservations-container .search-actions,
    .padel-club-finder-container .search-actions { flex-direction: column; }
}