/* Werstok — Kalendarz testowy v5. Wyłącznie ta podstrona. */

/* Identyczna geometria sekcji tytułowej jak w zatwierdzonym Cenniku. */

@media (min-width:781px) {
  .werstok-modern.wm-calendar-v2 .wm-intro {
    padding-top: 31px !important;
  }
}

@media (max-width:780px) {
  .werstok-modern.wm-calendar-v2 .wm-intro {
    padding-top: 15px !important;
  }
}

/* Pozostawiamy wspólne marginesy h1 i odstępy sekcji z werstok-modern-test.css. */

.werstok-modern.wm-calendar-v2 .wm-intro h1 {
  margin-top: 14px !important;
  margin-bottom: 14px !important;
}

/* Dyskretne oko. */

.werstok-modern.wm-calendar-v2 .wm-eye-icon {
  width: 24px !important;
  height: 24px !important;
  max-width: 24px !important;
  object-fit: contain;
  border-radius: 0 !important;
  vertical-align: middle;
  margin: 0 7px 0 0;
}

.werstok-modern.wm-calendar-v2 .wm-room-link {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}

/* Kluczowa poprawka: wspólny CSS zmienia KAŻDY tbody w .calendar-wrapper
   na display:table;width:auto. To powoduje zwężenie tabeli dni do treści.
   Przywracamy natywne zachowanie tbody w generowanych tabelach. */

.werstok-modern.wm-calendar-v2 .wm-kalendarz .calendar-wrapper {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: visible !important;
  margin: 16px 0 28px !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz .calendar-wrapper > div[id^="calendar"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz .availability-calendar-toolbar {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar {
  display: table !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
  box-sizing: border-box !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar > tbody {
  display: table-row-group !important;
  width: auto !important;
  min-width: 0 !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar > thead {
  display: table-header-group !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar tr {
  display: table-row !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar th,
.werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar td {
  box-sizing: border-box !important;
  width: 14.285714% !important;
}

.werstok-modern.wm-calendar-v2 .wm-kalendarz {
  padding-bottom: 35px !important;
}

@media (max-width:780px) {
  .werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar th,
  .werstok-modern.wm-calendar-v2 .wm-kalendarz table.availability-calendar td {
    padding: 5px 2px !important;
    font-size: clamp(11px,2.9vw,15px) !important;
  }

  .werstok-modern.wm-calendar-v2 .wm-kalendarz {
    padding-bottom: 22px !important;
  }
}

/* v7 — na dużych ekranach kalendarz zajmuje 60% szerokości treści.
   Zachowujemy pełną szerokość na telefonach i mniejszych tabletach. */

@media (min-width: 1101px) {
  .werstok-modern.wm-calendar-v2 .wm-kalendarz .calendar-wrapper {
    width: 60% !important;
    max-width: 60% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}