/**
 * Host-seitige Marken-Anpassungen für Urlaubszeit Widget V2.
 * Per Checkbox auf den Testseiten abschaltbar (siehe widget-theme-toggle.js).
 */

[data-widget],
[data-urlaubszeit],
[data-uzw-widget],
.widget-slot {
  --uzw-color-text: #3b0764;
  --uzw-color-muted: #6b21a8;
  --uzw-color-muted-2: #581c87;
  --uzw-color-border: #ddd6fe;
  --uzw-color-border-strong: #c4b5fd;
  --uzw-color-surface: #ffffff;
  --uzw-color-surface-soft: #faf5ff;
  --uzw-color-btn-bg: #7c3aed;
  --uzw-color-btn-text: #ffffff;
  --uzw-color-btn-ghost-bg: #ede9fe;
  --uzw-color-btn-ghost-text: #3b0764;
  --uzw-color-accent: #7c3aed;
  --uzw-color-accent-2: #4c1d95;
  --uzw-color-link: #7c3aed;
  --uzw-radius-sm: 10px;
  --uzw-radius-md: 12px;
  --uzw-radius-lg: 14px;
  --uzw-radius-pill: 999px;
}

/* ——— Suchformular & Felder ——— */

.uzw-v2-search {
  color: var(--uzw-color-text, #3b0764);
}

.uzw-v2-field label,
.uzw-v2-results .uzw-v2-field label {
  color: var(--uzw-color-muted-2, #581c87) !important;
}

.uzw-v2-field input,
.uzw-v2-field select,
.uzw-v2-field textarea {
  border-color: var(--uzw-color-border) !important;
  border-radius: var(--uzw-radius-sm) !important;
}

/* Textfelder explizit — sonst gewinnt ggf. Browser-UA-`appearance`/`border` gegen die Markenfarbe */
.uzw-v2-field input[type='text'],
.uzw-v2-field input[type='search'],
.uzw-v2-field input[type='email'],
.uzw-v2-field input[type='tel'],
.uzw-v2-field input[type='url'] {
  /* Wie Date/Guest: gleiche „Marken“-Kante wie Trigger, nicht nur generisches Border-Token */
  border: 1px solid #a78bfa !important;
  border-radius: var(--uzw-radius-sm) !important;
  background: var(--uzw-color-surface) !important;
}

.uzw-v2-guest-toggle {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-sm) !important;
}

.uzw-v2-guest-toggle:hover {
  border-color: color-mix(in oklab, var(--uzw-color-accent) 45%, var(--uzw-color-border-strong)) !important;
}

.uzw-v2-guest-panel {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-md) !important;
  box-shadow: 0 14px 36px rgb(76 29 149 / 16%) !important;
}

.uzw-v2-date-range__trigger {
  border-color: #a78bfa !important;
  border-radius: var(--uzw-radius-sm) !important;
  background: #ffffff !important;
}

.uzw-v2-date-range__trigger:hover:not(:disabled) {
  border-color: var(--uzw-color-accent) !important;
}

.uzw-v2-date-range__panel {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-lg) !important;
  box-shadow: 0 18px 44px rgb(76 29 149 / 18%) !important;
}

.uzw-v2-date-range__day--sel-edge {
  background: var(--uzw-color-accent) !important;
  color: #fff !important;
}

.uzw-v2-date-range__day--in-range {
  background: #ede9fe !important;
  color: var(--uzw-color-accent-2) !important;
}

.uzw-v2-submit {
  background: var(--uzw-color-btn-bg) !important;
  border-color: #6d28d9 !important;
  color: var(--uzw-color-btn-text) !important;
  border-radius: var(--uzw-radius-pill) !important;
  font-weight: 600 !important;
}

.uzw-v2-submit:hover:not(:disabled) {
  background: #6d28d9 !important;
}

.uzw-v2-submit:disabled {
  background: color-mix(in oklab, var(--uzw-color-surface-soft) 86%, #fff) !important;
  border-color: var(--uzw-color-border-strong) !important;
  color: var(--uzw-color-muted) !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

/* Slidebox-Navigation (nicht Primary-CTA, aber soll zur Markenlinie passen) */
.uzw-v2-slidebox-btn {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-sm) !important;
  background: var(--uzw-color-surface) !important;
  color: var(--uzw-color-text) !important;
}

.uzw-v2-slidebox-btn:hover:not(:disabled) {
  background: var(--uzw-color-surface-soft) !important;
}

.uzw-v2-slidebox-btn:disabled {
  opacity: 1 !important;
  border-color: var(--uzw-color-border) !important;
  background: var(--uzw-color-surface-soft) !important;
  color: var(--uzw-color-muted) !important;
  cursor: not-allowed !important;
}

/* Advanced Search / Filterblöcke */

.uzw-v2-results {
  background: var(--uzw-color-surface-soft) !important;
  padding: 14px !important;
  border-radius: var(--uzw-radius-md) !important;
  border: 1px solid var(--uzw-color-border) !important;
}

.uzw-v2-results-grid-filters + .uzw-v2-results-actions {
  border-top-color: var(--uzw-color-border) !important;
}

.uzw-v2-dyn-group--accordion {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-md) !important;
  background: var(--uzw-color-surface) !important;
}

.uzw-v2-dyn-group-title {
  color: var(--uzw-color-accent-2) !important;
}

/* Liste & Paginierung */

.uzw-v2-list .uzw-v2-meta {
  color: var(--uzw-color-muted) !important;
}

.uzw-v2-item {
  border-color: var(--uzw-color-border) !important;
  border-radius: var(--uzw-radius-md) !important;
  transition:
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

.uzw-v2-items--boxes .uzw-v2-item:hover {
  border-color: var(--uzw-color-border-strong) !important;
  box-shadow: 0 10px 28px rgb(76 29 149 / 12%);
}

a.uzw-v2-item-link:hover .uzw-v2-item-title {
  color: var(--uzw-color-link) !important;
}

.uzw-v2-page-btn {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-sm) !important;
}

.uzw-v2-page-btn:hover {
  background: var(--uzw-color-surface-soft) !important;
}

.uzw-v2-page-num--active {
  border-color: var(--uzw-color-accent) !important;
  background: var(--uzw-color-accent) !important;
  color: #fff !important;
}

/* Detailseite */

.uzw-v2-detail-title {
  color: var(--uzw-color-accent-2) !important;
}

.uzw-v2-detail-aside {
  border-color: var(--uzw-color-border-strong) !important;
  border-radius: var(--uzw-radius-lg) !important;
  box-shadow: 0 8px 32px rgb(76 29 149 / 12%) !important;
}

.uzw-v2-detail-section-title {
  color: var(--uzw-color-accent-2) !important;
}

.uzw-v2-detail-chip {
  border-color: var(--uzw-color-border-strong) !important;
  background: var(--uzw-color-surface-soft) !important;
}

.uzw-v2-detail-back {
  color: var(--uzw-color-link) !important;
}

