/* --- Gym Homepage — Light Theme --- */

/* Supprime l’override sombre précédent */
body{ background: var(--bg); }

/* Container spacing */
.container{ padding-top:24px; padding-bottom:24px; }

/* Hero / Header */
.header, .hero{
  position:relative;
  background:
    radial-gradient(1000px 300px at 10% -10%, rgba(88,101,242,.12), rgba(0,0,0,0)),
    linear-gradient(180deg, #ffffff, #fbfdff);
  border:1px solid rgba(0,0,0,.08);
  border-radius:24px;
  padding:24px; margin-bottom:20px; overflow:hidden;
}
.hero h1, .header h1{
  font-size:clamp(1.6rem, 1.1rem + 1.6vw, 2.2rem);
  letter-spacing:.3px; margin:0 0 6px 0; color:#0f172a;
}
.hero p, .header p{ color: var(--muted); margin-top:2px; }
.hero .chips{ display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.hero .chip{
  padding:6px 10px; font-size:.9rem; border-radius:999px;
  border:1px solid rgba(0,0,0,.10);
  background:#f1f5ff; color:#1e293b;
}

/* Stat cards */
.stats{ display:grid; gap:14px; grid-template-columns:repeat(4, minmax(0,1fr)); }
@media (max-width:1100px){ .stats{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:600px){ .stats{ grid-template-columns:1fr; } }

.stat-card{
  background: linear-gradient(180deg, #ffffff, #f9fbff);
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px; padding:16px;
}
.stat-card .label{ color:#475569; font-size:.9rem; }
.stat-card .value{ font-size:1.6rem; font-weight:700; margin-top:4px; color:#0f172a; }

/* Sections */
.section{
  background: var(--panel);
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px; padding:16px;
}
.section + .section{ margin-top:16px; }
.section h2{ margin:0 0 12px 0; font-size:1.2rem; color:#0f172a; }

/* Tabs */
.tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.tab{
  padding:8px 12px; border-radius:12px;
  border:1px solid rgba(0,0,0,.10);
  background:#ffffff; cursor:pointer; user-select:none; color:#0f172a;
}
.tab.active, .tab:hover{
  background: rgba(88,101,242,.10);
  border-color: rgba(88,101,242,.35);
}

/* Cards & lists */
.card{
  background:#ffffff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px; padding:12px;
}
.items{ display:grid; gap:10px; grid-template-columns:repeat(3, minmax(0,1fr)); }
@media (max-width:1000px){ .items{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:640px){ .items{ grid-template-columns:1fr; } }

/* Tables (hérite de base.css, ajout hover plus doux) */
.table tbody tr:hover{ background:#f1f5f9; }

/* Buttons */
button, .btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:12px;
  background:#e2e8f0; border:1px solid rgba(0,0,0,.10);
  cursor:pointer; color:#1e293b;
}
button:hover, .btn:hover{ background:#cbd5e1; }
.btn.primary{
  background: linear-gradient(180deg, #5865f2, #4856de);
  border-color: rgba(88,101,242,.6);
  color:#fff;
}
.btn.primary:hover{ filter:brightness(1.04); }

/* Inputs */
.input, select, textarea{
  background:#fff; border:1px solid rgba(0,0,0,.15);
  padding:10px 12px; border-radius:10px; color:#0f172a; width:100%;
}
label{ color:#334155; font-size:.95rem; }

/* Utilities */
.grid{ display:grid; gap:16px; }
.grid.cols-2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid.cols-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width:900px){ .grid.cols-2, .grid.cols-3{ grid-template-columns:1fr; } }

.hstack{ display:flex; align-items:center; gap:10px; }
.vstack{ display:flex; flex-direction:column; gap:10px; }
.badge{
  padding:4px 8px; border-radius:999px;
  border:1px solid rgba(0,0,0,.10); color:#0f172a; background:#f1f5ff;
}

/* Alerts */
.alert{
  padding:10px 12px; border-radius:12px;
  border:1px solid rgba(0,0,0,.10); background:#ffffff; color:#0f172a;
}
.alert.success{ border-color: rgba(16,185,129,.35); background: rgba(16,185,129,.10); }
.alert.error{ border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.10); }

/* Auth card (si visible sur la page) */
.auth-card{
  max-width:520px;
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  border:1px solid rgba(0,0,0,.10);
  border-radius:20px; padding:20px;
  box-shadow: 0 8px 28px rgba(2,6,23,.08);
}
.auth-header{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.auth-header h3{ margin:0; font-size:1.3rem; color:#0f172a; }
.auth-header p{ margin:0; color: var(--muted); font-size:.95rem; }
.auth-icon{
  width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background: rgba(88,101,242,.12);
}

.visually-hidden{ position:absolute !important; height:1px; width:1px; overflow:hidden; clip: rect(1px,1px,1px,1px); white-space:nowrap; }
.hstack.between{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.remember{ color: var(--muted); font-size:.95rem; display:flex; gap:8px; align-items:center; }
#loginMessage{ margin:8px 0 0; }

/* --- Gym: liste moderne d'exercices (1 ligne) --- */
.wk-container{ padding: 8px 12px; }
.list-group{ display:block; border-radius:12px; overflow:hidden; border:1px solid rgba(0,0,0,.08); background:#fff; }
.list-group-item{ display:block; border-bottom:1px solid rgba(0,0,0,.06); background:#fff; padding-left:16px; padding-right:16px; }
.list-group-item:last-child{ border-bottom:none; }
.wk-row{ display:flex; align-items:center; gap:.75rem; }
.wk-row input[type="checkbox"]{ width:auto; height:auto; margin:0; flex:0 0 auto; }
.wk-main{ display:flex; align-items:center; justify-content:flex-start; gap:.75rem; width:100%; min-width:0; }
.wk-text{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.wk-title, .wk-name{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#0f172a; font-weight:600; }
.wk-desc{ color:#64748b; font-size:.92rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wk-meta{ margin-left:auto; white-space:nowrap; color:#64748b; display:flex; align-items:center; gap:.35rem; }
.badge{ background:#eef2ff; border:1px solid rgba(88,101,242,.35); color:#1e293b; }