:root{
  --primary: #0072CE;        /* brand blue */
  --primary-600:#0b63b5;
  --text: #111827;
  --muted:#6b7280;
  --border:#e5e7eb;
  --bg:#f7f9fc;
  --card:#ffffff;
  --radius:14px;
  --shadow: 0 8px 28px rgba(16,24,40,.08);
}

/* ---------- Base ---------- */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  margin:0;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  transition: background .25s ease, color .25s ease;
}
body::before{
  content:"";
  position:fixed; inset:0;
  background-image:url("assets/dumbell-art.png");
  background-size:180px; background-repeat:repeat;
  opacity:.05; pointer-events:none; z-index:-1;
}

/* Dark */
body.dark{
  --text:#e5e7eb;
  --muted:#9aa4b2;
  --border:#2a3342;
  --bg:#111418;
  --card:#171a20;
  --shadow: 0 10px 34px rgba(0,0,0,.45);
}
body.dark::before{ opacity:.03; }

/* ---------- Page wrapper ---------- */
.page-wrapper{
  max-width:1100px;
  margin:24px auto;
  padding:0 18px 36px;
}
.form-container{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:22px;
}

/* ---------- Title / subtitles ---------- */
.title{
  display:flex; align-items:center; gap:10px;
  font-size:clamp(22px, 2.8vw, 32px);
  font-weight:800;
  letter-spacing:.2px;
  color:var(--primary);
  margin:6px 2px 14px;
}
.subtitle{
  margin:0 2px 18px;
  color:var(--muted);
}

/* ---------- Sections ---------- */
.section{
  margin:22px 0 10px;
  font-weight:800;
  color:#1f2937;
  font-size:1.05rem;
}
body.dark .section{ color:#dbe1ea; }

.hr{
  border:0; height:1px;
  background:var(--border);
  margin:14px 0 6px;
  opacity:.8;
}

/* ---------- Inputs ---------- */
.field{ margin:12px 0 14px; }
.field label{
  display:flex; justify-content:space-between; align-items:center;
  gap:10px; margin:0 0 6px;
  font-weight:700; color:#334155;
}
body.dark .field label{ color:#c7d2fe; }

.input, .field input[type="text"], .field input[type="email"],
.field input[type="password"], .field input[type="tel"],
.field input[type="date"], .field input[type="number"],
.field select, .field textarea, .form input[type="file"]{
  width:100%;
  border:1px solid var(--border);
  background:var(--card);
  color:inherit;
  height:48px; padding:0 14px;
  border-radius:var(--radius);
  outline:none; transition:border-color .15s, box-shadow .15s, background .15s;
}
.field textarea{ height:120px; padding:12px 14px; resize:vertical; }
.form input[type="file"]{ height:auto; padding:10px 12px; }

.input:focus, .field input:focus, .field select:focus, .field textarea:focus{
  border-color:rgba(0,114,206,.85);
  box-shadow:0 0 0 3px rgba(0,114,206,.18);
}

/* Invalid/help text (optional classes your script can toggle) */
.is-invalid{ border-color:#ef4444 !important; }
.invalid-msg{ color:#ef4444; font-size:.88rem; margin-top:6px; }
.hint{ color:var(--muted); font-size:.9rem; margin-top:4px; }

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

/* ---------- Chip checkboxes (specializations, languages) ---------- */
.checkbox-group{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
  gap:12px; margin-top:8px;
}
.checkbox-group label{
  display:flex; align-items:center; gap:12px;
  padding:11px 12px;
  border:1px solid var(--border);
  background:linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,.6));
  border-radius:14px; cursor:pointer;
  transition:transform .08s ease, border-color .14s ease, background .2s ease;
}
.checkbox-group label:hover{ transform:translateY(-1px); }
.checkbox-group input{ width:18px; height:18px; accent-color:var(--primary); }
body.dark .checkbox-group label{
  background:linear-gradient(180deg, #191e25, #171b21);
}

/* ---------- Buttons ---------- */
.actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:48px; padding:0 18px; border-radius:var(--radius);
  border:1px solid transparent; font-weight:800; cursor:pointer;
  transition:transform .08s ease, filter .12s ease, box-shadow .15s ease;
}
.btn:active{ transform:translateY(1px); }

.btn-primary{
  background:var(--primary); color:#fff;
  box-shadow:0 6px 18px rgba(0,114,206,.28);
}
.btn-primary:hover{ filter:brightness(1.05); }

.btn-ghost{
  background:var(--card); border:1px solid var(--border); color:var(--text);
}
.btn-ghost:hover{ filter:brightness(1.02); }

/* Loading state (optional) */
.btn.loading{ opacity:.85; cursor:not-allowed; }
.btn.loading::before{
  content:""; width:1em; height:1em; margin-right:.55em; border:.18em solid currentColor;
  border-right-color:transparent; border-radius:50%; display:inline-block; animation:spin .8s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ---------- Profile preview ---------- */
#profilePreview{
  width:190px; height:190px; object-fit:cover; border-radius:16px;
  border:1px solid var(--border); background:#f9fafb;
}
body.dark #profilePreview{ background:#0f1217; }

/* ---------- Map picker block ---------- */
.rt-mapbox{
  margin: 12px 0 6px;
  padding: 14px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
}
.map-legend{
  font-weight:700;
  color:#374151;
  margin:0 0 6px;
}
body.dark .map-legend{ color:#dbe1ea; }

/* search input above map */
.map-field{ display:grid; gap:6px; margin-bottom:10px; }
.map-field span{ font-size:.9rem; color:var(--muted); }
.map-field input{
  height:46px; border-radius:12px; padding:0 12px;
  border:1px solid var(--border); background:var(--card); color:inherit;
  outline:none; transition:border-color .15s, box-shadow .15s;
}
.map-field input:focus{
  border-color:rgba(0,114,206,.8);
  box-shadow:0 0 0 3px rgba(0,114,206,.18);
}

/* actual map canvas */
.map-picker{
  height:320px; width:100%;
  border-radius:12px; overflow:hidden;
  color-scheme: light;        /* dual-mode MapID support */
}
body.dark .map-picker{ color-scheme: dark; }
@media (max-width:600px){ .map-picker{ height:240px; } }

/* Google Places dropdown on top of everything */
.pac-container{
  z-index: 3000 !important;
  border-radius:12px; overflow:hidden;
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}
body.dark .pac-container{ background:#12161d; color:#fff; border:1px solid #233143; }

/* under-map toggles */
.map-toggles{
  display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin:10px 0;
}
.map-precision{ display:flex; gap:14px; }
.map-precision label{ display:flex; gap:8px; align-items:center; font-weight:600; }

/* auto fields (city/region) */
.map-meta{
  display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:8px;
}
.field-small{ display:grid; gap:6px; }
.field-small input{
  height:44px; border-radius:10px;
  border:1px solid var(--border); background:var(--card); color:inherit; padding:0 10px;
}

/* ---------- Footer small note ---------- */
.ur-foot{
  text-align:center; color:var(--muted);
  margin:12px auto 0; max-width:900px;
}
.ur-foot a{ color:var(--primary); font-weight:800; text-decoration:none; }
.ur-foot a:hover{ text-decoration:underline; }

/* ---------- Toast (keep your existing JS) ---------- */
.rt-toast{
  position:fixed; bottom:18px; right:18px; z-index:9999;
  background:#0b1220; color:#fff; padding:.75rem 1rem; border-radius:12px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  opacity:0; transform:translateY(8px); pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
  max-width:min(420px, 90vw);
}
.rt-toast.show{ opacity:1; transform:translateY(0); }
body.dark .rt-toast{ background:#161c26; }

/* Utility */
.text-muted{ color:var(--muted); }
.hide{ display:none !important; }

/* ====== Small UI polish for register page ====== */

/* Buttons (generic so it catches your current ones) */
button, .ur-btn, input[type="submit"] {
  -webkit-appearance: none;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 18px;
  border-radius: 12px;
  border: 1px solid transparent;
  font-weight: 700;
  cursor: pointer;
  transition: filter .12s ease, box-shadow .15s ease, transform .06s ease;
}
button:active, .ur-btn:active, input[type="submit"]:active { transform: translateY(1px); }

/* Primary submit */
#registerSubmit, /* if you have an ID */
button[type="submit"],
.ur-btn-primary {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 6px 18px rgba(0,114,206,.25);
}
#registerSubmit:hover,
button[type="submit"]:hover,
.ur-btn-primary:hover {
  filter: brightness(1.06);
}

/* Ghost / secondary buttons (e.g., Back link if styled as button) */
.ur-btn-ghost,
button.ghost {
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
}
.ur-btn-ghost:hover,
button.ghost:hover { filter: brightness(1.03); }

/* Map toggles: “Zobrazit na mapě”, “Přesná / Přibližná” */
.map-toggles,
.map-precision {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
}
.map-toggles label,
.map-precision label {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  font-weight: 600;
}
.map-toggles input[type="checkbox"],
.map-precision input[type="radio"] {
  width: 18px; height: 18px;
  accent-color: var(--primary);
}

/* “Souhlasím se smluvními podmínkami…” block */
.consent, .legal, .terms-block {
  margin-top: 10px;
  color: var(--muted);        /* make it a bit quieter */
  font-size: 0.96rem;
}
.consent label, .legal label, .terms-block label {
  display: flex;
  align-items: center;
  gap: 10px;
}
.consent input[type="checkbox"],
.legal input[type="checkbox"],
.terms-block input[type="checkbox"] {
  width: 18px; height: 18px;
  accent-color: var(--primary);
}
.consent a, .legal a, .terms-block a {
  color: inherit;             /* keep grey tone */
  text-decoration: underline;
}
.consent a:hover, .legal a:hover, .terms-block a:hover {
  color: var(--text);         /* readable on hover */
}

/* The “Back to registration choice” link next to submit */
.form-actions, .actions {
  display: flex; gap: 12px; flex-wrap: wrap; margin-top: 14px;
}
.actions .link-muted, .form-actions .link-muted {
  align-self: center;
  color: var(--muted);
  text-decoration: none;
  font-weight: 700;
}
.actions .link-muted:hover, .form-actions .link-muted:hover {
  color: var(--text);
  text-decoration: underline;
}

/* Make the Google map picker look crisp in both themes (already present but keep here) */
.map-picker { color-scheme: light; }
body.dark .map-picker { color-scheme: dark; }

/* Inputs inside the “auto city/region” part to match the rest */
.map-meta .field-small input {
  height: 44px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card);
  color: inherit;
  padding: 0 10px;
}

/* Gallery preview grid */
.gallery-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:10px;margin-top:10px;}
.gallery-preview .g-thumb{position:relative;border-radius:10px;overflow:hidden;border:1px solid rgba(0,0,0,.06);background:#f8fafc;}
.gallery-preview img{display:block;width:100%;height:88px;object-fit:cover;}
.gallery-preview .g-meta{position:absolute;left:6px;bottom:6px;font-size:11px;padding:2px 6px;border-radius:999px;background:rgba(0,0,0,.55);color:#fff}

.rt-loading .rt-spin{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-bottom-color:transparent;border-radius:50%;margin-right:8px;vertical-align:-2px;animation:rtspin .8s linear infinite}@keyframes rtspin{to{transform:rotate(360deg)}}
/* success card buttons */
.rt-success-card .rt-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid var(--panel-border,#d1d5db);background:#fff;color:#111827;text-decoration:none;font-weight:600}
body.dark .rt-success-card .rt-btn{background:#0f172a;color:#e5e7eb;border-color:#334155}
.rt-success-card .rt-btn-primary{background:#0072CE;border-color:#0072CE;color:#fff}
.rt-success-card .rt-btn:hover{filter:brightness(1.04)}
.rt-success-card .rt-btn:active{transform:none}

/* disabled/busy submit state */
#submitBtn[disabled],#submitBtn.rt-loading{opacity:.7;cursor:not-allowed}
.rt-loading .rt-spin{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-bottom-color:transparent;border-radius:50%;margin-right:8px;vertical-align:-2px;animation:rtspin .8s linear infinite}
@keyframes rtspin{to{transform:rotate(360deg)}}

/* Google Places in dark mode */
body.dark .pac-target-input{color:#e5e7eb!important;caret-color:#e5e7eb}
body.dark .pac-target-input::placeholder{color:#9CA3AF}
body.dark .pac-container{background:#0b1220;border:1px solid #334155;color:#e5e7eb;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:10000}
body.dark .pac-item{color:#e5e7eb}
body.dark .pac-item:hover{background:#1f2937}
body.dark .pac-matched{color:#93c5fd}