/* GORKY STUDIO — виджет онлайн-записи. Использует токены сайта (styles.css): --card, --line, --gold, --muted… */
.gbook { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius, 22px); padding: 22px; max-width: 760px; margin: 0 auto; color: var(--text); }
.gb-titlerow { display: flex; align-items: center; gap: 10px; }
.gb-title { font-family: var(--display); font-weight: 600; font-size: 20px; margin: 0; }
.gb-back { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line-2); background: transparent; color: inherit; font-size: 22px; line-height: 1; cursor: pointer; flex: 0 0 auto; }
.gb-back:hover { border-color: var(--gold); }
.gb-crumbs { color: var(--muted); font-size: 14px; margin: 8px 0 0; }
.gb-body { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.gb-card { display: flex; flex-direction: column; gap: 6px; text-align: left; width: 100%; padding: 16px; border-radius: var(--radius-sm, 12px); border: 1px solid var(--line-2); background: var(--card-2); color: inherit; font: inherit; cursor: pointer; }
button.gb-card:hover { border-color: var(--gold); }
.gb-room { cursor: default; }
.gb-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.gb-price { color: var(--gold-ink); font-weight: 600; white-space: nowrap; }
.gb-muted { color: var(--muted); font-size: 14px; }
.gb-desc { white-space: pre-line; }
.gb-group { margin: 10px 0 0; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.gb-branchwrap { display: flex; gap: 10px; align-items: stretch; }
.gb-branchwrap .gb-card { flex: 1; }
.gb-maplink { align-self: center; color: var(--gold-ink); font-size: 14px; white-space: nowrap; }
.gb-gallery { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; margin: -4px -4px 6px; padding: 4px; }
.gb-gallery img { height: 180px; width: auto; max-width: 85%; border-radius: 10px; object-fit: cover; scroll-snap-align: start; flex: 0 0 auto; }
.gb-choose { align-self: flex-start; margin-top: 6px; }
.gb-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.gb-times { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }
.gb-ends { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.gb-chip { padding: 12px 10px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--card-2); color: inherit; font: inherit; cursor: pointer; text-align: center; }
.gb-chip:hover { border-color: var(--gold); }
.gb-end { display: flex; flex-direction: column; gap: 2px; }
.gb-end span { font-size: 13px; color: var(--muted); }
.gb-nav { justify-content: flex-start; margin-top: 6px; }
.gb-form { display: flex; flex-direction: column; gap: 12px; }
.gb-field { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--muted); }
.gb-field input, .gb-field textarea { font: inherit; color: var(--text); background: var(--card-2); border: 1px solid var(--line-2); border-radius: 12px; padding: 12px 14px; width: 100%; box-sizing: border-box; }
.gb-field input:focus, .gb-field textarea:focus { outline: 2px solid var(--gold); outline-offset: 1px; }
.gb-promo { display: flex; gap: 10px; align-items: flex-end; }
.gb-promo .gb-field { flex: 1; }
.gb-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.gb-summary { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 10px 0; }
.gb-summary p { margin: 4px 0; }
.gb-total { font-family: var(--display); font-weight: 600; font-size: 20px; }
.gb-ok { color: #3fbf6f; font-size: 14px; }
.gb-error { color: #ff6b6b; font-size: 14px; margin: 0; }
.gb-rules summary { cursor: pointer; color: var(--gold-ink); font-size: 14px; }
.gb-pre { white-space: pre-line; font-size: 14px; color: var(--muted); }
.gb-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--muted); }
.gb-check input { margin-top: 3px; width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--gold); }
.gb-check a { color: var(--gold-ink); }
.gb-status span { font-size: 15px; }
.gbook-page { min-height: 100vh; padding: 20px 16px 60px; }
.gbook-top { display: flex; align-items: center; justify-content: space-between; max-width: 760px; margin: 0 auto 18px; }
.gbook-top img { height: 40px; width: auto; }
.gbook-top a { color: var(--muted); font-size: 14px; }
@media (max-width: 560px) {
  .gbook { padding: 16px; border-radius: 16px; }
  .gb-branchwrap { flex-direction: column; }
  .gb-gallery img { height: 150px; }
}
.booking[hidden] { display: none !important; }
.gbook-legal{max-width:760px;margin:18px auto 0;font-size:12px;line-height:1.5;color:var(--muted,#8a8a8a);text-align:center}
.gbook-legal a{color:inherit;text-decoration:underline}
.gb-hint{margin:-8px 0 2px;font-size:13px;line-height:1.4}
.gb-access{margin-top:12px;border-color:var(--gold,#e8c46a)}
.gb-access b{font-size:18px}
.gb-access .btn{align-self:flex-start;margin-top:6px}

/* части суток (вкладки над временем) */
.gb-parts { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; margin: 4px 0 12px; }
.gb-part { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; border-radius: 12px;
  border: 1px solid var(--line-2); background: none; color: inherit; font: inherit; cursor: pointer; min-width: 0; }
.gb-part b { font-size: 15px; }
.gb-part span { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.gb-part.is-on { border-color: var(--gold); background: rgba(227, 185, 90, .12); }
.gb-part:focus-visible, .gb-chip:focus-visible, .gb-more:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
/* быстрый выбор длительности */
.gb-quick { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin-bottom: 10px; }
.gb-end--quick { padding: 16px 8px; border-color: rgba(227, 185, 90, .55); }
.gb-end--quick b { font-size: 20px; }
.gb-more { background: none; border: 0; padding: 8px 0; color: var(--text-2); font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; align-self: flex-start; }
@media (max-width: 400px) { .gb-part span { font-size: 10px; } }
.gb-chips[hidden], .gb-parts[hidden] { display: none; }
/* перенос записи */
.gb-chip.is-on { border-color: var(--gold); background: rgba(227, 185, 90, .16); }
.gb-move { margin-top: 12px; }
.gb-move-go { margin-top: 12px; }
.gb-move-go:disabled { opacity: .5; cursor: default; }
/* сетка времени: получасовые блоки, занятые — серые */
.gb-slots { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
@media (min-width: 700px) { .gb-slots { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
.gb-slots-part { grid-column: 1 / -1; margin: 8px 0 0; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.gb-slot { padding: 11px 4px; border-radius: 10px; border: 1px solid var(--line-2); background: var(--card-2); color: inherit; font: inherit; font-size: 14px; cursor: pointer; }
.gb-slot:hover:not(.is-busy):not(:disabled) { border-color: var(--gold); }
.gb-slot.is-busy { opacity: .35; text-decoration: line-through; cursor: default; }
.gb-slot.is-end-ok { opacity: 1; text-decoration: none; border-color: rgba(227, 185, 90, .55); cursor: pointer; }
.gb-slot.is-range { background: rgba(227, 185, 90, .32); border-color: rgba(227, 185, 90, .8); opacity: 1; text-decoration: none; }
.gb-slot.is-last { background: var(--gold) var(--tex-gold, none) center / cover; color: #111; border-color: transparent; font-weight: 600; }
.gb-slot small { font-size: 11px; opacity: .75; margin-right: 1px; }
.gb-hint-step { font-weight: 500; color: var(--text, #eee); }
.gb-slot.is-start { background: var(--gold) var(--tex-gold, none) center / cover; color: #111; border-color: transparent; font-weight: 600; opacity: 1; text-decoration: none; }
.gb-slot:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.gb-selbar { position: sticky; bottom: 10px; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px;
  padding: 10px 10px 10px 16px; border-radius: 16px; background: var(--card); border: 1px solid rgba(227, 185, 90, .55); box-shadow: 0 10px 30px rgba(0, 0, 0, .4); }
.gb-selbar[hidden] { display: none; }
.gb-seltext { font-weight: 600; }

.gb-login { cursor: default; gap: 8px; }
.gb-login .btn { align-self: flex-start; }
.gb-login > span { font-size: 14px; }
.gb-plain { display: flex; flex-direction: column; gap: 12px; }
.gb-plain--ok { display: none; }
.gb-keep { cursor: default; gap: 8px; border-color: var(--gold); background: rgba(255, 190, 60, .08); margin: 12px 0; }
.gb-keep > span { font-size: 14px; }
.gb-keep .btn { align-self: flex-start; }
.gbook-cal{display:block;max-width:760px;margin:0 auto 14px;padding:12px 16px;border:1px solid var(--gold,#c9a45c);border-radius:14px;color:var(--gold,#c9a45c);font-weight:600;text-decoration:none;line-height:1.35}
.gbook-cal span{font-weight:400;color:var(--muted,#8a8a8a);font-size:14px}
.gbook-cal:hover{background:rgba(201,164,92,.08)}
.gb-door-digits{width:100%;max-width:260px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-2,rgba(255,255,255,.17));background:var(--field,#0b0b0b);color:inherit;font-size:16px;letter-spacing:.2em}
.gb-door-digits[hidden]{display:none}
.gb-door{margin-top:6px}
.gb-door-digits::placeholder{letter-spacing:0}

/* «Как добраться» на странице записи */
.gb-route { gap: 8px; cursor: default; }
.gb-route__info { white-space: pre-line; }
.gb-route__media { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 4px; }
.gb-route__item { flex: 0 0 78%; max-width: 320px; margin: 0; scroll-snap-align: start; display: flex; flex-direction: column; gap: 4px; }
.gb-route__item img, .gb-route__item video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; background: #000; display: block; }
.gb-route__item video { object-fit: contain; }
.gb-route .btn { align-self: flex-start; }
