body.shop-shell-v2 .shop-dz-voucher-agenda-v2 {
  --shop-dz-agenda-text: var(--shop-v2-secondary-color-text-color, #333333);
  --shop-dz-agenda-muted: color-mix(in srgb, var(--shop-dz-agenda-text) 55%, white);
  --shop-dz-agenda-border: color-mix(in srgb, var(--shop-dz-agenda-text) 14%, transparent);
  --shop-dz-agenda-soft: color-mix(in srgb, var(--shop-v2-main-color) 10%, white);
  --shop-dz-agenda-focus: color-mix(in srgb, var(--shop-v2-main-color) 34%, transparent);
  --shop-dz-agenda-primary-button-background: var(--shop-v2-buy-buttons-bg-color, var(--shop-v2-main-color));
  --shop-dz-agenda-primary-button-text: var(--shop-v2-buy-buttons-text-color, var(--shop-v2-main-color-text-color));
  --shop-dz-agenda-secondary-button-background: var(--shop-v2-other-buttons-bg-color, var(--shop-v2-secondary-color));
  --shop-dz-agenda-secondary-button-text: var(--shop-v2-other-buttons-text-color, var(--shop-v2-secondary-color-text-color));
  color: var(--shop-dz-agenda-text);
  font-size: var(--shop-v2-font-size-base);
}

body.shop-shell-v2 .shop-dz-voucher-agenda-v2__instruction { margin: 0 0 16px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__instruction-title {
  margin: 0;
  color: inherit;
  font-size: var(--shop-v2-font-size-xl);
  font-weight: 700;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__calendar-region { position: relative; min-height: 180px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__loading,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__error {
  display: flex;
  min-height: 180px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-direction: column;
  text-align: center;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2 [hidden] {
  display: none !important;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__spinner {
  width: 24px;
  height: 24px;
  border: 3px solid color-mix(in srgb, var(--shop-v2-main-color) 22%, white);
  border-top-color: var(--shop-v2-main-color);
  border-radius: 50%;
  animation: shop-dz-agenda-spin .8s linear infinite;
}
@keyframes shop-dz-agenda-spin { to { transform: rotate(360deg); } }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__calendar {
  padding: 16px 18px 18px;
  background: #fff;
  border: 1px solid var(--shop-dz-agenda-border);
  border-radius: 16px;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--shop-dz-agenda-text) 8%, transparent);
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-navigator {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  align-items: center;
  gap: 8px;
  min-height: 54px;
  padding: 8px 10px;
  color: var(--shop-v2-main-color-text-color);
  background: var(--shop-v2-main-color);
  border-radius: 9px;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 38px;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
  border-radius: 8px;
  cursor: pointer;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-button:disabled { opacity: .42; cursor: not-allowed; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-button:hover:not(:disabled),
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-button:focus-visible {
  background: color-mix(in srgb, currentColor 14%, transparent);
  border-color: currentColor;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-title {
  margin: 0;
  color: inherit;
  font-size: var(--shop-v2-font-size-xl);
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__calendar-row {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  margin-top: 4px;
  width: 100%;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day {
  box-sizing: border-box;
  display: flex;
  min-width: 0;
  width: 100% !important;
  min-height: 64px;
  height: auto !important;
  margin: 0 !important;
  padding: 8px 5px;
  align-items: center;
  justify-content: center;
  color: var(--shop-dz-agenda-muted);
  background: #fff;
  border: 1px solid var(--shop-dz-agenda-border);
  border-radius: 8px;
  font-weight: 700;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day--weekday {
  min-height: 34px;
  color: var(--shop-dz-agenda-muted);
  background: var(--shop-dz-agenda-soft);
  border-color: transparent;
  font-size: var(--shop-v2-font-size-sm);
  text-transform: uppercase;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day--empty { border-color: transparent; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__calendar-row > .cal-booking-day {
  flex: 0 0 auto;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day.cal-booking-day-available {
  color: var(--shop-dz-agenda-text);
  background: var(--shop-dz-agenda-soft);
  border-color: color-mix(in srgb, var(--shop-v2-main-color) 42%, transparent);
  cursor: pointer;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day.cal-booking-day-available:hover,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day.cal-booking-day-available:focus-visible,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day.is-selected {
  color: var(--shop-v2-main-color-text-color);
  background: var(--shop-v2-main-color);
  border-color: var(--shop-v2-main-color);
  box-shadow: 0 5px 12px color-mix(in srgb, var(--shop-v2-main-color) 24%, transparent);
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day:focus-visible,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__month-button:focus-visible,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__slot:focus-visible,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2 button:focus-visible {
  outline: 3px solid var(--shop-dz-agenda-focus);
  outline-offset: 2px;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day-panel {
  margin-top: 18px;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--shop-dz-agenda-border);
  border-radius: 12px;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day-title,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__current-booking {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day-title span { font-weight: 700; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__current-booking,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__notice {
  display: block;
  padding: 12px 14px;
  margin-bottom: 12px;
  border-radius: 6px;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__current-booking { background: var(--shop-dz-agenda-soft); }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__current-booking span { display: block; margin-top: 4px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__notice { color: #9f2f2f; background: #f8dddd; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__price-group { margin: 18px 0; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__price-group h4 { margin: 0 0 8px; font-size: var(--shop-v2-font-size-md); }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__slots { display: flex; flex-wrap: wrap; gap: 10px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__slot {
  min-width: 74px;
  padding: 10px 14px;
  color: var(--shop-dz-agenda-text);
  background: var(--shop-dz-agenda-soft);
  border: 1px solid var(--shop-dz-agenda-border);
  border-radius: 7px;
  font-weight: 700;
  cursor: pointer;
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__slot:hover:not(:disabled),
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__slot.is-selected {
  color: var(--shop-v2-main-color-text-color);
  background: var(--shop-v2-main-color);
  border-color: var(--shop-v2-main-color);
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__slot:disabled { opacity: .45; cursor: not-allowed; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__actions { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--shop-dz-agenda-border); }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__cancel,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__submit,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__retry { padding: 9px 16px; border-radius: 18px; font-weight: 700; cursor: pointer; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__cancel,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__submit--secondary {
  color: var(--shop-dz-agenda-secondary-button-text);
  background: var(--shop-dz-agenda-secondary-button-background);
  border-color: color-mix(in srgb, var(--shop-dz-agenda-secondary-button-text) 18%, transparent);
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__submit {
  color: var(--shop-dz-agenda-primary-button-text);
  background: var(--shop-dz-agenda-primary-button-background);
  border-color: var(--shop-dz-agenda-primary-button-background);
}
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__submit:disabled { opacity: .45; cursor: not-allowed; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__empty-day { padding: 24px 8px; color: var(--shop-dz-agenda-muted); text-align: center; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton { display: grid; gap: 14px; min-height: 190px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton-line,
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton-chip { display: block; background: var(--shop-dz-agenda-soft); animation: shop-dz-agenda-pulse 1.1s ease-in-out infinite alternate; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton-line { width: 52%; height: 20px; border-radius: 999px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton-line--notice { width: 84%; height: 42px; border-radius: 6px; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton-slots { display: flex; gap: 10px; flex-wrap: wrap; }
body.shop-shell-v2 .shop-dz-voucher-agenda-v2__skeleton-chip { width: 74px; height: 40px; border-radius: 7px; }
@keyframes shop-dz-agenda-pulse { from { opacity: .45; } to { opacity: 1; } }
@media (max-width: 600px) {
  body.shop-shell-v2 .shop-dz-voucher-agenda-v2__calendar { padding: 10px; }
  body.shop-shell-v2 .shop-dz-voucher-agenda-v2__day { min-height: 48px; font-size: var(--shop-v2-font-size-sm); }
  body.shop-shell-v2 .shop-dz-voucher-agenda-v2__actions > * { flex: 1 1 100%; }
}

/* Dropzone voucher booking confirmation page. */
body.shop-shell-v2 .shop-booking-v2--dropzone-confirmation {
  --shop-booking-v2-accent: var(--shop-v2-main-color, #5dc4f1);
}

body.shop-shell-v2 .shop-booking-v2--dropzone-confirmation .panel-success > .panel-heading {
  color: var(--shop-booking-v2-text);
  background: color-mix(in srgb, var(--shop-v2-main-color, #5dc4f1) 10%, white);
}

body.shop-shell-v2 .shop-booking-v2--dropzone-confirmation #acceptCGV {
  accent-color: var(--shop-v2-main-color, #5dc4f1);
}
