/* ============================================================
   ZENTUS — GEO-naptár foglalóoldal (geo-naptar-foglalas.html).
   Önálló, menü nélküli oldal. A .bk-* osztályok a booking.css-ből
   (naptár, lépésjelző, megerősítés); itt a GEO-specifikus extrák.
   ============================================================ */

.geo-booking-body { margin: 0; background: var(--bg, #F2F3F7); font-family: var(--font, "Space Grotesk", sans-serif); color: var(--text); overflow-x: clip; }
.geo-booking { position: relative; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 5vw, 64px) var(--gutter, 24px); overflow-x: clip; }
.geo-booking *, .geo-booking *::before, .geo-booking *::after { box-sizing: border-box; }

/* ---- gradient panel (1 + 2 képernyő) ---- */
.gb-panel {
  position: relative; overflow: hidden; max-width: 1080px; width: 100%; margin-inline: auto;
  background: linear-gradient(135deg, #FAFBFD 0%, #E8EFFA 100%);
  border: 1px solid var(--border); border-radius: var(--r-card-lg, 20px);
  box-shadow: 0 24px 60px rgba(24,132,240,0.12);
  padding: clamp(28px, 4vw, 64px);
  display: flex; flex-direction: column;
}
.gb-decor { position: absolute; top: -70px; right: -50px; width: 340px; height: auto; opacity: 0.07; pointer-events: none; }
.gb-panel > .bk-head, .gb-panel > .bk-card, .gb-panel > .bk-foot { position: relative; z-index: 1; }

/* logó (szimbólum + szóvédjegy) az oldalsávban */
.gb-logo { display: inline-flex; align-items: center; gap: 8px; }
.gb-logo img { width: 26px; height: 26px; }
.gb-logo span { color: var(--navy); font-size: 21px; font-weight: 500; letter-spacing: -0.4px; }

/* a naptár-láb gombja középen (nincs Vissza az 1. képernyőn) */
.gb-foot { justify-content: center; }
.gb-foot .bk-link[data-book-back] { display: none; }

/* "Vissza az időpontválasztáshoz" a 2. képernyő fejlécében */
.gb-back { display: inline-flex; align-items: center; gap: 6px; margin: 6px auto 0; background: none; border: 0; cursor: pointer; font-family: var(--font); font-size: 13px; font-weight: 500; color: var(--navy); }
.gb-back:hover { color: var(--blue-link, #1268C9); }
.gb-back:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: 6px; }
.gb-back i { width: 14px; height: 14px; }

/* ============================================================
   2 · ADATAID — részletek kártya (összegző + form)
   ============================================================ */
.gb-details { display: grid; grid-template-columns: 300px minmax(0, 1fr); }
.gb-aside { background: #F7FAFE; padding: 32px; border-right: 1px solid var(--border); display: flex; flex-direction: column; gap: 20px; }
.gb-aside .bk-aside-title { margin: 0; }
.gb-meta { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.gb-meta li { display: flex; align-items: center; gap: 10px; }
.gb-meta-ic { width: 28px; height: 28px; border-radius: 8px; background: rgba(24,132,240,0.08); color: var(--blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.gb-meta-ic i { width: 14px; height: 14px; }
.gb-meta-l { display: block; color: var(--text-muted); font-size: 11px; font-weight: 600; letter-spacing: 0.4px; }
.gb-meta-v { display: block; color: var(--navy); font-size: 14px; font-weight: 600; }
.gb-tip { display: flex; gap: 10px; align-items: flex-start; background: rgba(24,132,240,0.04); border-radius: 12px; padding: 12px; margin: 0; color: var(--navy); font-size: 12px; line-height: 1.5; }
.gb-tip i { width: 16px; height: 16px; color: var(--blue); flex: none; margin-top: 1px; }

/* form */
.gb-form { padding: 32px; display: flex; flex-direction: column; gap: 14px; }
.gb-form-h { color: var(--navy); font-size: 18px; font-weight: 700; letter-spacing: -0.3px; margin: 0 0 2px; }
.gb-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.gb-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gb-field label { display: inline-flex; align-items: center; gap: 4px; color: var(--navy); font-size: 13px; font-weight: 600; white-space: nowrap; }
.gb-req { color: var(--blue); font-weight: 700; }
.gb-opt { color: var(--text-muted); font-size: 11px; font-weight: 500; }
.gb-field input, .gb-field select, .gb-field textarea { width: 100%; font-family: var(--font); font-size: 14px; color: var(--navy); padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-input, 10px); background: var(--white); }
.gb-field select { cursor: pointer; }
.gb-field textarea { resize: vertical; min-height: 76px; line-height: 1.5; }
.gb-field input::placeholder, .gb-field textarea::placeholder { color: #9aa3b5; }
.gb-field input:focus-visible, .gb-field select:focus-visible, .gb-field textarea:focus-visible { outline: none; border-color: var(--blue); box-shadow: var(--focus-ring); }
.gb-field.has-error input, .gb-field.has-error select, .gb-field.has-error textarea, .gb-field.has-error .gb-input-wrap { border-color: var(--error, #C7382E); }
/* ikonos mező (URL, email, telefon) */
.gb-input-wrap { display: flex; align-items: center; gap: 10px; padding: 0 14px; border: 1px solid var(--border); border-radius: var(--r-input, 10px); background: var(--white); }
.gb-input-wrap:focus-within { border-color: var(--blue); box-shadow: var(--focus-ring); }
.gb-input-wrap i { width: 16px; height: 16px; color: var(--text-muted); flex: none; }
.gb-input-wrap input { border: 0; padding: 12px 0; box-shadow: none; }
.gb-input-wrap input:focus-visible { outline: none; box-shadow: none; }
.gb-help { color: var(--text-muted); font-size: 12px; line-height: 1.4; }
.gb-consent { display: flex; align-items: flex-start; gap: 10px; margin-top: 2px; }
.gb-consent input { margin-top: 3px; width: 18px; height: 18px; flex: none; accent-color: var(--blue); }
.gb-consent-tx { display: flex; flex-direction: column; gap: 2px; }
.gb-consent-tx > span:first-child { color: var(--text); font-size: 13px; line-height: 1.5; }
.gb-consent-tx a { color: var(--blue-link, #1268C9); font-weight: 600; }
.gb-consent-tx a:hover { text-decoration: underline; }
.gb-consent-sub { color: var(--text-muted); font-size: 11px; line-height: 1.4; }
.gb-submit { width: 100%; min-height: 50px; margin-top: 4px; }

/* ============================================================
   3 · MEGERŐSÍTÉS — extrák (a .bk-confirm a booking.css-ből)
   ============================================================ */
.gb-confirm { max-width: 1080px; }
.gb-actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.gb-actions .btn { min-height: 50px; }
.gb-actions .btn i, .gb-actions .btn svg { width: 18px; height: 18px; }

/* ============================================================
   RESZPONZÍV
   ============================================================ */
@media (max-width: 920px) {
  .gb-details { grid-template-columns: 1fr; }
  .gb-aside { border-right: 0; border-bottom: 1px solid var(--border); flex-direction: row; flex-wrap: wrap; align-items: flex-start; }
  .gb-aside .gb-logo, .gb-aside .bk-aside-title { flex: 1 1 100%; }
  .gb-meta { flex: 1 1 100%; }
}
@media (max-width: 620px) {
  .gb-row { grid-template-columns: 1fr; }
  .gb-actions .btn { width: 100%; }
  /* a dekoratív vízjel mobilon a panelen túlnyúlt (right:-50px) → vízszintes
     túlcsordulást okozott; mobilon elrejtjük */
  .gb-decor { display: none; }
}