/* =====================================================================
   Страница врача — поверх service.css (те же блоки, что у страницы услуги)
   ===================================================================== */

/* hero: фото врача в вырезе панели, как иллюстрация у услуги */
.thero__bg .thero__doc { position: absolute; left: 872px; top: 88px; width: 470px; height: 470px; border-radius: 20px; overflow: hidden; background: var(--white); }
.thero__bg .thero__doc img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.thero__badge { color: var(--red); pointer-events: none; }
.thero--doctor .thero__text { width: 560px; }

/* достижения: карточки «Как проходит процедура» без бейджей */
.proc--ach { padding-top: 90px; }
.proc--ach .pcard-p h3 { font-size: 40px; font-weight: 600; letter-spacing: -0.03em; }
.proc--ach .pcard-p p { width: 100%; padding-right: 10px; }
.doctor-page .detail { margin-top: 90px; }

/* «О враче»: строки аккордеона без нумерации шагов */
.dstep__num--wide { width: auto; color: var(--ink); font-weight: 500; }

/* блок записи: сетка внутри тёмного блока «Стоимость сервиса» */
.cost--booking { height: auto; margin-top: 90px; padding: 50px 47px 56px; }
.doctor-page .footer { margin-top: 110px; }
.cost--booking .cost__input { position: static; }
.cost--booking .cost__form { position: static; }
.cost--booking .cost__title, .cost--booking .cost__note { position: static; }
.cost--booking .cost__note { margin-top: 18px; width: 560px; font-size: 20px; line-height: 1.1; }
.booking__form { display: grid; grid-template-columns: minmax(0, 1fr) 620px; gap: 60px; margin-top: 44px; }
.booking__form[hidden], .booking__head[hidden], .booking__done[hidden] { display: none; }
.booking__left, .booking__right { min-width: 0; }
.booking__label { margin-bottom: 14px; font-size: 20px; line-height: .95; letter-spacing: -0.03em; opacity: .7; }
.booking__slots-label { margin-top: 30px; }
.bbranches { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.bbranches[hidden] { display: none; }
.bbranch { height: 38px; padding: 0 16px; border: 1px solid rgba(217, 217, 217, .17); border-radius: 19px; background: #16171a; color: var(--white); font-size: 14px; letter-spacing: -0.02em; transition: background .2s, color .2s; }
.bbranch:hover { background: #222327; }
.bbranch.is-active { background: var(--white); color: var(--dark); border-color: var(--white); }
.bdays { display: flex; gap: 8px; width: 100%; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.bdays::-webkit-scrollbar { display: none; }
.bdays__loading { font-size: 16px; opacity: .6; }
.bday { flex: none; display: flex; flex-direction: column; align-items: center; gap: 3px; width: 88px; padding: 12px 6px 10px; border: 1px solid rgba(217, 217, 217, .17); border-radius: 18px; background: #16171a; color: var(--white); transition: background .2s, color .2s; }
.bday:hover { background: #222327; }
.bday.is-active { background: var(--white); color: var(--dark); border-color: var(--white); }
.bday.is-full { opacity: .4; }
.bday__wd { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; opacity: .6; }
.bday__d { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
.bday__n { font-size: 12px; opacity: .6; }
.bday.is-active .bday__n { color: var(--red); opacity: 1; }
.bslots { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.bslot { height: 48px; border: 1px solid rgba(217, 217, 217, .17); border-radius: 14px; background: #16171a; color: var(--white); font-size: 16px; font-weight: 500; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; transition: background .2s; }
.bslot:hover { background: #222327; }
.bslot.is-active { background: var(--red); border-color: var(--red); }
.bslots__empty { grid-column: 1 / -1; padding: 14px 0; font-size: 16px; opacity: .6; }
.booking__chosen { margin-top: 22px; font-size: 16px; opacity: .8; }
.booking__chosen b { font-weight: 600; }
.bfield__select { -webkit-appearance: none; appearance: none; background-image: url(../img/chevron-dark.svg); background-repeat: no-repeat; background-position: right 28px center; padding-right: 60px; cursor: pointer; }
.bfield__static { display: flex; align-items: center; color: #a4a8af; }
.bfield__date { color-scheme: light; }
.bfield__date.is-empty { color: #a4a8af; }
.booking__hint { margin-top: 6px; font-size: 15px; line-height: 1.3; opacity: .65; }
.booking__error { margin: 4px 0 12px; padding: 12px 18px; border-radius: 12px; background: rgba(237, 50, 55, .18); color: #ffb3b5; font-size: 15px; line-height: 1.3; }
.booking__submit:disabled { opacity: .6; cursor: default; }
.booking__done .booking__done-text { margin-top: 22px; font-size: 24px; font-weight: 600; line-height: 1.15; letter-spacing: -0.02em; }
.booking__done .cost__note { position: static; width: 560px; margin-top: 16px; line-height: 1.2; }
.booking__done .cost__note a { color: #ff777b; }

@media (max-width: 767px) {
  .thero__bg .thero__doc { left: 0; top: 0; width: 100%; height: 100%; border-radius: 0; }
  .thero--doctor .thero__text { width: 100%; }
  .thero__badge { margin-top: 8px; }
  .proc--ach { padding-top: 56px; }
  .proc--ach .pcard-p h3 { font-size: 28px; }
  .doctor-page .detail { margin-top: 40px; }
  .cost--booking { margin-top: 40px; padding: 30px 20px 30px; }
  .doctor-page .footer { margin-top: 40px; }
  .cost--booking .booking__form { position: relative; z-index: 1; }
  .cost--booking .cost__note { width: 100%; font-size: 15px; line-height: 1.25; }
  .booking__form { grid-template-columns: 1fr; gap: 28px; margin-top: 24px; }
  .booking__label { font-size: 16px; }
  .bday { width: 78px; }
  .bslots { grid-template-columns: repeat(4, 1fr); }
  .booking__done .booking__done-text { font-size: 20px; }
  .booking__done .cost__note { width: 100%; }
}
