/* BookaPadel · sistema de diseño compartido (buscador y panel de clubs).
   Cambiar aquí un color, una tipografía o un icono lo cambia en los dos sitios. */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  /* colores */
  --bg:#fff; --ink:#1d1d1f; --mute:#6e6e73; --line:#e8e8e6; --soft:#f7f6f3;
  --accent:#1f8a4c; --accent-2:#136b39; --ball:#e3f04a; --warn:#b3261e;
  --amber:#fff4c2; --amber-ink:#6b5a00;
  /* sombras y radios */
  --shadow:0 2px 14px rgba(0,0,0,.10); --lift:0 10px 40px rgba(20,60,35,.16); --r:20px;
  /* tipografía */
  --font:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
/* el buscador respeta el modo oscuro; el panel de clubs lo fuerza claro con <html class="force-light"> */
@media (prefers-color-scheme: dark) {
  :root:not(.force-light) { --bg:#141414; --ink:#f2f2f2; --mute:#a0a0a5; --line:#2e2e30; --soft:#1e1e20; --accent:#3dbb73; --accent-2:#2fa261; --ball:#d9e644; --warn:#ff8a80; --amber:#3a3210; --amber-ink:#f0dd7a; --shadow:0 2px 12px rgba(0,0,0,.5); --lift:0 10px 40px rgba(0,0,0,.5); }
}

/* iconos: línea redondeada de 1,9 px que hereda el color del texto (BK.icon / data-ic) */
.bk-ic { display:inline-block; vertical-align:-.2em; width:1.15em; height:1.15em; flex:none; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.bk-ic.fill { fill:currentColor; stroke:none; }

/* componentes compartidos: botones grandes y redondeados (buscador y panel de clubs) */
.bk-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:14px; padding:12px 20px; font:800 15px var(--font); background:var(--accent); color:#fff; cursor:pointer; text-decoration:none; transition:background .12s, transform .12s, box-shadow .12s; white-space:nowrap; }
.bk-btn:hover { background:var(--accent-2); text-decoration:none; } .bk-btn:active { transform:scale(.98); }
.bk-btn.ghost { background:var(--bg); color:var(--ink); border:1.5px solid var(--line); } .bk-btn.ghost:hover { border-color:var(--accent); background:var(--bg); }
.bk-btn.ball { background:var(--ball); color:#1d1d1f; } .bk-btn.ball:hover { filter:brightness(.95); background:var(--ball); }
.bk-btn.sm { padding:9px 16px; font-size:13.5px; border-radius:12px; } .bk-btn.lg { padding:16px 24px; font-size:16.5px; border-radius:16px; }