/* ============================================================
   D-Klinic — premium-booking.css
   v1.4.0 — Убран резерв высоты (конфликтовал с grid-анимацией); плавный рост слотов через grid 0fr→1fr
   ============================================================
   Палитра: золото #E8B94A, кофе #413F3B, бирюза #008080, беж #FDFDF7
   ============================================================ */

/* ---------- Раскладка: календарь + слоты рядом ---------- */
.pb-booking-grid {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  margin-top: 12px;
}
.pb-booking-col-cal { flex: 0 0 300px; max-width: 300px; }
.pb-booking-col-slots { flex: 1; min-width: 0; }

/* ---------- Календарь ---------- */
.pb-calendar {
  background: #FFFFFF;
  border-radius: 14px;
  border: 1px solid #ECE7DA;
  box-shadow: 0 10px 30px rgba(65,63,59,0.10);
  overflow: hidden;
}

/* Шапка */
.pb-cal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px;
  background: linear-gradient(135deg, #413F3B 0%, #2a2826 100%);
}
.pb-cal-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px; font-weight: 700;
  color: #FFFFFF; letter-spacing: 0.3px;
}
.pb-cal-title .pb-cal-year { color: #E8B94A; margin-left: 5px; }
.pb-cal-nav { display: flex; gap: 6px; }
.pb-cal-nav button {
  width: 28px; height: 28px;
  border: none; border-radius: 7px;
  background: rgba(255,255,255,0.08);
  color: #E8B94A; font-size: 12px;
  cursor: pointer; transition: all 0.2s ease;
  display: flex; align-items: center; justify-content: center;
}
.pb-cal-nav button:hover { background: rgba(232,185,74,0.2); }
.pb-cal-nav button:disabled { opacity: 0.3; cursor: not-allowed; }

/* Дни недели */
.pb-cal-weekdays {
  display: grid; grid-template-columns: repeat(7, 1fr);
  padding: 10px 10px 2px; gap: 2px;
}
.pb-cal-weekdays span {
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 9px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.3px;
  color: #B0AEA4;
}
.pb-cal-weekdays span.pb-wd-sun { color: #C98B8B; }

/* Сетка дней */
.pb-cal-grid {
  display: grid; grid-template-columns: repeat(7, 1fr);
  padding: 2px 10px 10px; gap: 2px;
}
.pb-cal-day {
  position: relative;
  height: 38px;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px; font-weight: 500;
  color: #413F3B;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.18s ease;
  user-select: none;
}
.pb-cal-day:hover:not(.pb-disabled):not(.pb-selected) {
  background: rgba(0,128,128,0.1);
  color: #008080;
}
.pb-cal-day.pb-other-month { color: #D8D5CC; pointer-events: none; }
.pb-cal-day.pb-disabled { color: #D2CFC6; cursor: not-allowed; }
.pb-cal-day.pb-disabled.pb-past { text-decoration: line-through; }
.pb-cal-day.pb-sunday:not(.pb-disabled) { color: #C16C6C; }
.pb-cal-day.pb-today { box-shadow: inset 0 0 0 1.5px #E8B94A; }
.pb-cal-day.pb-selected {
  background: linear-gradient(135deg, #E8B94A, #d4a838);
  color: #2a2826; font-weight: 700;
  box-shadow: 0 3px 10px rgba(232,185,74,0.4);
}

/* Индикатор доступности дня (точка под числом) */
.pb-cal-day .pb-dot {
  position: absolute;
  bottom: 5px; left: 50%;
  transform: translateX(-50%);
  width: 5px; height: 5px;
  border-radius: 50%;
}
.pb-cal-day.pb-free  .pb-dot { background: #2E9E6B; }
.pb-cal-day.pb-busy  .pb-dot { background: #E8B94A; }
.pb-cal-day.pb-busy  { color: #A8A29A; }          /* всё занято — число приглушено, но кликабельно */
.pb-cal-day.pb-selected .pb-dot { display: none; } /* на выбранном точку не показываем */

/* Быстрые кнопки */
.pb-cal-quick { display: flex; gap: 8px; padding: 0 10px 10px; }
.pb-cal-quick button {
  flex: 1; padding: 7px;
  border: 1px solid #ECE7DA; border-radius: 8px;
  background: #FBFAF5;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px; font-weight: 600;
  color: #875A26; cursor: pointer; transition: all 0.2s ease;
}
.pb-cal-quick button:hover { background: #E8B94A; color: #2a2826; border-color: #E8B94A; }
.pb-cal-quick button:disabled { opacity: 0.35; cursor: not-allowed; }

/* Легенда обозначений */
.pb-cal-legend {
  display: flex; justify-content: center; gap: 16px;
  padding: 0 10px 12px;
  font-family: 'Montserrat', sans-serif;
  font-size: 10px; font-weight: 600;
  color: #9A968C;
}
.pb-cal-legend span { display: inline-flex; align-items: center; gap: 5px; }
.pb-cal-legend i {
  width: 7px; height: 7px; border-radius: 50%;
  display: inline-block; font-style: normal;
}
.pb-cal-legend .pb-lg-free { background: #2E9E6B; }
.pb-cal-legend .pb-lg-busy { background: #E8B94A; }

/* ---------- Блок слотов ---------- */
.pb-slots-label {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  color: #413F3B; margin-bottom: 10px;
}
.pb-slots-body {
  max-height: none;
  overflow: visible;
}

/* Группа периода */
.pb-slot-group { margin-bottom: 14px; }
.pb-slot-group:last-child { margin-bottom: 0; }
.pb-slot-group-title {
  display: flex; align-items: center; gap: 8px;
  font-family: 'Montserrat', sans-serif;
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  color: #A8946A; margin-bottom: 8px;
}
.pb-slot-group-title::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(90deg, #ECE7DA, transparent);
}

/* Таблетки слотов */
.pb-slot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(62px, 1fr));
  gap: 7px;
}
.pb-slot {
  padding: 9px 4px;
  border: 1.5px solid #E8B94A; border-radius: 9px;
  background: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px; font-weight: 600;
  color: #875A26; text-align: center;
  cursor: pointer; transition: all 0.18s ease;
  user-select: none;
}
.pb-slot:hover { background: rgba(232,185,74,0.12); transform: translateY(-1px); }
.pb-slot.pb-selected {
  background: linear-gradient(135deg, #E8B94A, #d4a838);
  border-color: #E8B94A; color: #2a2826;
  box-shadow: 0 4px 12px rgba(232,185,74,0.4);
}
.pb-slot.pb-busy {
  border-color: #E5E2DA; background: #F4F2EC;
  color: #B8B4AA; cursor: not-allowed;
  text-decoration: line-through; text-decoration-thickness: 1px;
}
.pb-slot.pb-busy:hover { transform: none; background: #F4F2EC; }

/* Акцентная заглушка "сначала выберите дату" */
.pb-slots-prompt {
  text-align: center;
  padding: 30px 18px;
  border: 1.5px dashed #CDBF94;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(232,185,74,0.06), rgba(0,128,128,0.04));
}
.pb-slots-prompt .pb-prompt-icon {
  font-size: 30px; color: #008080;
  margin-bottom: 12px; display: block;
  animation: pb-pulse 2s ease-in-out infinite;
}
.pb-slots-prompt .pb-prompt-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 700;
  color: #008080; margin-bottom: 6px;
}
.pb-slots-prompt .pb-prompt-sub {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px; color: #9A968C; line-height: 1.5;
}
@keyframes pb-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.12); opacity: 0.75; }
}

.pb-slots-spinner {
  width: 28px; height: 28px; margin: 0 auto 12px;
  border: 3px solid #ECE7DA; border-top-color: #E8B94A;
  border-radius: 50%; animation: pb-spin 0.8s linear infinite;
}
@keyframes pb-spin { to { transform: rotate(360deg); } }

.pb-slots-hint {
  display: block; margin-top: 10px;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px; color: #B0AEA4; text-align: center;
}

/* Скрытые поля */
.pb-hidden-input { display: none; }

/* ---------- Адаптив ---------- */
@media (max-width: 619px) {
  .pb-booking-grid { flex-direction: column; gap: 14px; }
  .pb-booking-col-cal { flex: none; max-width: 100%; width: 100%; }
}
@media (max-width: 420px) {
  .pb-slot-grid { grid-template-columns: repeat(3, 1fr); }
  .pb-slot { font-size: 12px; padding: 8px 3px; }
}


/* ---------- Двухколоночная раскладка тела модалки ---------- */
.pb-two-col {
  display: flex;
  gap: 22px;
  align-items: flex-start;
}
.pb-two-col .pb-col-left  { flex: 0 0 38%; max-width: 38%; display: flex; flex-direction: column; }
.pb-two-col .pb-col-right { flex: 1; min-width: 0; }

/* В правой колонке календарь и слоты — рядом */
.pb-col-right .pb-booking-grid { margin-top: 0; }

/* Кнопка записи в левой колонке: во всю ширину колонки, прижата книзу */
.pb-submit-left {
  display: block;
  width: 100%;
  margin-top: auto;
}

/* На узких экранах — одна колонка, дата/время выше контактов */
@media (max-width: 760px) {
  .pb-two-col { flex-direction: column; gap: 0; }
  .pb-two-col .pb-col-left,
  .pb-two-col .pb-col-right { flex: none; max-width: 100%; width: 100%; }
  .pb-two-col .pb-col-right { order: -1; }
}


/* ---------- Слоты на всю ширину (под колонками) ---------- */
.pb-slots-wide { margin-top: 18px; }
.pb-slots-wide .pb-slots-prompt { padding: 22px 18px; }
.pb-slots-wide .pb-slot-group { margin-bottom: 12px; }

/* Адаптив сетки слотов на узких экранах */
@media (max-width: 760px) {
  .pb-slot-grid { grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 520px) {
  .pb-slot-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 380px) {
  .pb-slot-grid { grid-template-columns: repeat(3, 1fr); }
}


/* ---------- Плавный рост высоты слотов (grid 0fr→1fr) ---------- */
/* Единственный механизм высоты блока слотов. Резерв min-height убран —
   он не давал высоте реально меняться, поэтому роста не было видно. */
.pb-slots-anim {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s ease;
}
.pb-slots-anim > .pb-slots {
  overflow: hidden;
  min-height: 0;
}
.pb-slots-anim.pb-open {
  grid-template-rows: 1fr;
  opacity: 1;
}

/* ---------- Заметные состояния (ошибка / выходной / нет мест) ---------- */
.pb-slots-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 34px 20px;
  border: 1.5px dashed #E3DCC8;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(232,185,74,0.05), rgba(0,128,128,0.03));
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  line-height: 1.6;
  text-align: center;
  color: #7A766C;
}
.pb-slots-state .pb-state-icon {
  font-size: 34px;
  margin-bottom: 14px;
  color: #008080;
}
.pb-slots-state.pb-state-dayoff {
  border-color: #E6C9C9;
  background: linear-gradient(135deg, rgba(193,108,108,0.06), rgba(193,108,108,0.02));
  color: #B05B5B;
}
.pb-slots-state.pb-state-dayoff .pb-state-icon { color: #C16C6C; }
.pb-slots-state.pb-state-error {
  border-color: #E0B8B0;
  background: linear-gradient(135deg, rgba(200,80,60,0.06), rgba(200,80,60,0.02));
  color: #A65442;
}
.pb-slots-state.pb-state-error .pb-state-icon { color: #C8503C; }
.pb-slots-state b { color: inherit; font-weight: 700; white-space: nowrap; }