/* Configurator page /anfrage: slim top bar, image card (60 %) + selection card (40 %), fixed cost bar.
   Built on the page tokens of home.css (scheme-1, buttons, inputs) and festbox.css. */
.fbq-page { --fbq-top: 68px; --fbq-bar: 84px; margin: 0; background: var(--scheme-background-secondary); color: var(--scheme-text); font-family: var(--font-family-body); }
.fbq-page [hidden] { display: none !important; }
.fbq-page *, .fbq-page *::before, .fbq-page *::after { box-sizing: border-box; }

/* top bar */
.fbq-top { position: sticky; top: 0; z-index: 40; height: var(--fbq-top); display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 clamp(1rem, 3vw, 2rem); background: var(--scheme-background); border-bottom: 1px solid var(--scheme-border); }
.fbq-logo { display: inline-flex; flex: none; }
.fbq-logo img { height: 36px; width: auto; display: block; }
.fbq-top-actions { display: flex; align-items: center; gap: 0.5rem; }
.fbq-top .fb-nav-link .fb-svg { font-size: 1.25rem; }
.fbq-back-site { min-height: 44px; padding: 0 1rem !important; gap: 0.375rem; white-space: nowrap; }
.fbq-back-site .fb-svg { font-size: 1.125rem; }
@media (max-width: 1199px) { .fbq-top-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .fbq-top .fb-nav-link { width: 44px; padding: 0; } }
@media (max-width: 479px) {
  .fbq-page { --fbq-top: 60px; }
  .fbq-logo img { height: 30px; }
  .fbq-top-actions { gap: 0.375rem; }
  .fbq-back-site span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .fbq-back-site { width: 44px; padding: 0 !important; justify-content: center; }
}
.fbq-noscript { max-width: 40rem; margin: 2rem auto; padding: 1rem; background: var(--scheme-background); border-radius: 12px; }

/* layout */
.fbq-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: clamp(1rem, 2vw, 1.5rem); max-width: 1600px; margin: 0 auto; padding: clamp(1rem, 2vw, 1.5rem) clamp(1rem, 2vw, 1.5rem) calc(var(--fbq-bar) + 1.5rem); align-items: start; }
.fbq-media { position: sticky; top: calc(var(--fbq-top) + 1.5rem); height: calc(100vh - var(--fbq-top) - var(--fbq-bar) - 3rem); min-height: 360px; border-radius: var(--radius-large, 24px); overflow: hidden; background: var(--scheme-background); }
.fbq-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity 0.25s ease; }
.fbq-media img.is-fading { opacity: 0.35; }
.fbq-panel { background: var(--scheme-background); border-radius: var(--radius-large, 24px); padding: clamp(1.25rem, 2.5vw, 2rem); display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; scroll-margin-top: calc(var(--fbq-top) + 1rem); box-shadow: 0 1px 2px rgba(17, 17, 17, 0.04); }
@media (max-width: 991px) {
  .fbq-layout { grid-template-columns: minmax(0, 1fr); padding-left: 0.75rem; padding-right: 0.75rem; }
  .fbq-media { position: relative; top: auto; height: 200px; min-height: 0; border-radius: var(--radius-medium, 20px); }
}
@media (prefers-reduced-motion: reduce) { .fbq-media img { transition: none; } }

/* progress: 4 labelled segments */
.fbq-progress { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; }
.fbq-progress li { display: flex; flex-direction: column; gap: 0.375rem; font-size: 0.8125rem; color: var(--scheme-text-muted); font-weight: 600; }
.fbq-progress-bar { height: 6px; border-radius: 999px; background: var(--scheme-background-secondary); border: 1px solid var(--scheme-border); }
.fbq-progress li.is-done .fbq-progress-bar { background: #111111; border-color: #111111; }
.fbq-progress li.is-active .fbq-progress-bar { background: var(--button-fill); border-color: #E6B800; }
.fbq-progress li.is-active, .fbq-progress li.is-done { color: var(--scheme-heading); }

/* steps */
.fbq-step { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 1.5rem; }
.fbq-title { font-family: var(--font-family-heading); font-weight: 700; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.15; color: var(--scheme-heading); padding: 0; margin: 0; outline: none; }
.fbq-step .fbq-title { margin-bottom: 0.5rem; }
.fbq-lead { margin: 0; color: var(--scheme-text-muted); line-height: 1.5; }
.fbq-subtitle { font-family: var(--font-family-heading); font-weight: 700; font-size: 1.25rem; color: var(--scheme-heading); margin: 0 0 0.75rem; }
.fbq-block { display: flex; flex-direction: column; gap: 0.625rem; }
.fbq-label { font-weight: 600; color: var(--scheme-heading); margin: 0; font-size: 0.9375rem; }
.fbq-hint { font-size: 0.875rem; color: var(--scheme-text-muted); line-height: 1.5; margin: 0; }
.fbq-hint a, .fbq-check a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.fbq-invalid { color: #b42318; font-size: 0.875rem; font-weight: 600; margin: 0; }
.fbq-error { margin: 0; padding: 0.875rem 1rem; border-radius: var(--radius-small, 12px); background: #fef3f2; color: #912018; border: 1px solid #fecdca; line-height: 1.5; }
.fbq-page .input { min-height: 48px; font-size: 1rem; width: 100%; }
.fbq-page select.input { appearance: auto; }
.fbq-page .input[aria-invalid="true"], .fbq-check.is-invalid .checkbox { border-color: #b42318; }
.fbq-textarea { min-height: 88px; resize: vertical; padding-top: 0.75rem; }
.fbq-short { max-width: 8rem; }
.fbq-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.fbq-field { display: flex; flex-direction: column; gap: 0.375rem; min-width: 0; }
.fbq-wide { grid-column: 1 / -1; }
@media (max-width: 479px) { .fbq-fields { grid-template-columns: 1fr; } }
.fbq-row { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: center; }
.fbq-row .button { min-height: 44px; }
.fbq-check { display: flex; gap: 0.75rem; align-items: flex-start; font-size: 0.9375rem; line-height: 1.45; cursor: pointer; min-height: 44px; padding: 0.625rem 0; }
.fbq-check .checkbox { flex: none; margin-top: 0.1rem; width: 1.25rem; height: 1.25rem; }

/* calendar */
.fbq-cal-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 0.5rem; }
.fbq-cal-title { font-family: var(--font-family-heading); font-weight: 700; font-size: 1.0625rem; color: var(--scheme-heading); }
.fbq-cal-nav { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border-radius: var(--radius-small, 12px); border: 1px solid var(--scheme-border); background: transparent; color: var(--scheme-heading); cursor: pointer; font-size: 1.5rem; }
.fbq-cal-nav:disabled { opacity: 0.3; cursor: default; }
.fbq-week, .fbq-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.3125rem; }
.fbq-week span { text-align: center; font-size: 0.75rem; color: var(--scheme-text-muted); padding-bottom: 0.25rem; }
.fbq-day { min-height: 44px; aspect-ratio: 1 / 0.86; border-radius: var(--radius-small, 10px); border: 1px solid var(--scheme-border); background: var(--scheme-background); color: var(--scheme-text); font-family: var(--font-family-body); font-size: 0.9375rem; cursor: pointer; padding: 0; }
.fbq-day:hover:not(:disabled) { border-color: #111111; }
.fbq-day[aria-pressed="true"] { background: var(--button-fill); border-color: #E6B800; color: #111111; font-weight: 700; }
.fbq-day.is-taken { background: transparent; color: var(--scheme-text-muted); text-decoration: line-through; opacity: 0.5; cursor: not-allowed; }
.fbq-day.is-out { background: transparent; border-color: transparent; color: var(--scheme-text-muted); opacity: 0.35; cursor: default; }
.fbq-day.is-blank { visibility: hidden; }
.fbq-legend { display: flex; flex-wrap: wrap; gap: 1rem; }
.fbq-dot { display: inline-block; width: 0.875rem; height: 0.875rem; border-radius: 4px; border: 1px solid var(--scheme-border); vertical-align: -2px; margin-right: 0.375rem; }
.fbq-dot-taken { opacity: 0.55; background: repeating-linear-gradient(135deg, transparent 0 3px, var(--scheme-text-muted) 3px 4px); }
.fbq-dot-selected { background: var(--button-fill); border-color: #E6B800; }

/* package cards */
.fbq-packages { display: grid; gap: 0.75rem; }
.fbq-pkg { position: relative; display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 0.875rem; align-items: center; padding: 0.625rem; padding-right: 3rem; border: 1px solid var(--scheme-border); border-radius: var(--radius-medium, 16px); background: var(--scheme-background); cursor: pointer; transition: border-color 0.15s ease, box-shadow 0.15s ease; min-height: 44px; }
.fbq-pkg:hover { border-color: #111111; }
.fbq-pkg input { position: absolute; opacity: 0; pointer-events: none; }
.fbq-pkg img { width: 5.5rem; height: 4.5rem; object-fit: cover; border-radius: var(--radius-small, 10px); display: block; }
.fbq-pkg-body { display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; }
.fbq-pkg-name { font-family: var(--font-family-heading); font-weight: 700; color: var(--scheme-heading); display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.fbq-pkg-price { font-weight: 700; color: var(--scheme-heading); }
.fbq-pkg-desc { font-size: 0.875rem; color: var(--scheme-text-muted); line-height: 1.4; }
.fbq-pkg-check { position: absolute; top: 50%; right: 0.75rem; transform: translateY(-50%); width: 1.75rem; height: 1.75rem; border-radius: 50%; border: 1px solid var(--scheme-border); display: inline-flex; align-items: center; justify-content: center; font-size: 1.125rem; color: transparent; }
.fbq-pkg:has(input:checked) { border-color: #E6B800; box-shadow: 0 0 0 2px var(--button-fill); }
.fbq-pkg:has(input:checked) .fbq-pkg-check { background: var(--button-fill); border-color: #E6B800; color: #111111; }
.fbq-pkg:has(input:focus-visible) { outline: 2px solid #111111; outline-offset: 3px; }
.fbq-tag { font-family: var(--font-family-body); font-size: 0.75rem; font-weight: 600; padding: 0.125rem 0.5rem; border-radius: 999px; background: var(--button-fill); color: #111111; }

/* rental period, trust card */
.fbq-infobox { display: flex; gap: 0.625rem; align-items: center; padding: 0.75rem 1rem; border-radius: var(--radius-small, 12px); background: color-mix(in srgb, #FFCC00 22%, var(--scheme-background)); color: var(--scheme-heading); font-weight: 600; }
.fbq-infobox .fb-svg { font-size: 1.375rem; flex: none; }
.fbq-trust { display: flex; align-items: center; gap: 1rem; padding: 0.875rem 1rem; border-radius: var(--radius-medium, 16px); border: 1px solid var(--scheme-border); background: var(--scheme-background-secondary); }
.fbq-trust-faces { display: flex; flex: none; }
.fbq-trust-faces img { width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover; object-position: center 20%; background: #fff; border: 2px solid var(--scheme-background); }
.fbq-trust-faces img + img { margin-left: -0.75rem; }
.fbq-trust ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.25rem; font-weight: 600; color: var(--scheme-heading); font-size: 0.9375rem; }
.fbq-trust li { display: flex; align-items: center; gap: 0.5rem; }
.fbq-trust .fb-svg { font-size: 1.25rem; flex: none; }

/* extras list */
.fbq-inline-ico { display: inline-flex; vertical-align: -0.2em; font-size: 1.125rem; }
.fbq-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.fbq-row-item { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr) auto; gap: 0.75rem; align-items: start; padding: 0.75rem 0; border-bottom: 1px solid var(--scheme-border); }
.fbq-row-item[data-wide] { grid-template-columns: 3.5rem minmax(0, 1fr); }
.fbq-row-item[data-wide] .fbq-row-side { display: none; }
.fbq-thumb { width: 3.5rem; height: 3.5rem; object-fit: cover; border-radius: var(--radius-small, 10px); display: block; }
.fbq-row-main { min-width: 0; display: flex; flex-direction: column; gap: 0.5rem; padding-top: 0.125rem; }
.fbq-row-head { display: flex; align-items: center; gap: 0.25rem; min-height: 2.25rem; }
.fbq-row-name { font-weight: 600; color: var(--scheme-heading); line-height: 1.3; }
.fbq-info { flex: none; width: 44px; height: 44px; margin: -0.375rem 0; border: 0; background: none; padding: 0; border-radius: 50%; color: var(--scheme-text-muted); cursor: pointer; font-size: 1.25rem; display: inline-flex; align-items: center; justify-content: center; }
.fbq-info:hover, .fbq-info[aria-expanded="true"] { color: var(--scheme-heading); }
.fbq-info-text { margin: 0; font-size: 0.875rem; line-height: 1.5; color: var(--scheme-text-muted); padding: 0.5rem 0.75rem; background: var(--scheme-background-secondary); border-radius: var(--radius-small, 10px); }
.fbq-row-side { display: flex; align-items: center; gap: 0.625rem; min-height: 3.5rem; justify-content: flex-end; text-align: right; }
.fbq-price { font-weight: 700; color: var(--scheme-heading); font-size: 0.9375rem; white-space: nowrap; display: flex; flex-direction: column; align-items: flex-end; gap: 0.25rem; }
.fbq-incl { font-size: 0.8125rem; font-weight: 600; padding: 0.25rem 0.625rem; border-radius: 999px; background: var(--scheme-background-secondary); color: var(--scheme-heading); white-space: nowrap; }
.fbq-badge { font-size: 0.75rem; font-weight: 600; padding: 0.125rem 0.5rem; border-radius: 999px; background: color-mix(in srgb, #FFCC00 35%, var(--scheme-background)); color: #111111; white-space: nowrap; }
.fbq-add { flex: none; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid #111111; background: var(--scheme-background); color: #111111; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: 1.375rem; padding: 0; transition: background-color 0.15s ease; }
.fbq-add .fb-svg + .fb-svg { display: none; }
.fbq-add[aria-pressed="true"] { background: var(--button-fill); border-color: #E6B800; }
.fbq-add[aria-pressed="true"] .fb-svg:first-child { display: none; }
.fbq-add[aria-pressed="true"] .fb-svg + .fb-svg { display: inline-block; }
.fbq-add:hover:not(:disabled) { background: var(--scheme-background-secondary); }
.fbq-add[aria-pressed="true"]:hover { background: #E6B800; }
.fbq-add:disabled { opacity: 0.35; cursor: not-allowed; }
.fbq-add:focus-visible, .fbq-info:focus-visible, .fbq-cal-nav:focus-visible, .fbq-day:focus-visible { outline: 2px solid #111111; outline-offset: 2px; }
.fbq-row-item.is-disabled .fbq-row-name, .fbq-row-item.is-disabled .fbq-price { opacity: 0.55; }
.fbq-sep { height: 0.5rem; border-bottom: 1px solid var(--scheme-border); }
.fbq-more { display: flex; flex-direction: column; gap: 0.375rem; }
/* print choice: segmented control */
.fbq-seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--scheme-border); border-radius: var(--radius-small, 12px); overflow: hidden; }
.fbq-seg-opt { position: relative; display: flex; cursor: pointer; }
.fbq-seg-opt + .fbq-seg-opt { border-left: 1px solid var(--scheme-border); }
.fbq-seg-opt input { position: absolute; opacity: 0; pointer-events: none; }
.fbq-seg-opt > span { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.125rem; min-height: 56px; padding: 0.375rem 0.25rem; text-align: center; font-size: 0.8125rem; line-height: 1.25; color: var(--scheme-text); }
.fbq-seg-opt strong { font-weight: 600; color: var(--scheme-heading); }
.fbq-seg-opt:has(input:checked) > span { background: var(--button-fill); }
.fbq-seg-opt:has(input:focus-visible) > span { outline: 2px solid #111111; outline-offset: -3px; }
.fbq-seg-opt.is-disabled { cursor: not-allowed; }
.fbq-seg-opt.is-disabled > span { opacity: 0.4; background: repeating-linear-gradient(135deg, transparent 0 6px, var(--scheme-background-secondary) 6px 8px); }
@media (max-width: 479px) { .fbq-seg { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fbq-seg-opt:nth-child(3) { border-left: 0; } .fbq-seg-opt:nth-child(n+3) { border-top: 1px solid var(--scheme-border); } }

/* place and overview */
.fbq-choices { display: grid; gap: 0.5rem; }
.fbq-choice { display: flex; gap: 0.75rem; align-items: flex-start; min-height: 44px; padding: 0.75rem 0.875rem; border: 1px solid var(--scheme-border); border-radius: var(--radius-small, 12px); background: var(--scheme-background); cursor: pointer; line-height: 1.4; }
.fbq-choice input { margin-top: 0.15rem; accent-color: #111111; width: 1.25rem; height: 1.25rem; flex: none; }
.fbq-choice strong { display: block; color: var(--scheme-heading); }
.fbq-choice-text { display: block; font-size: 0.875rem; color: var(--scheme-text-muted); margin-top: 0.125rem; }
.fbq-choice:has(input:checked) { border-color: #E6B800; box-shadow: 0 0 0 2px var(--button-fill); }
.fbq-choice:has(input:focus-visible) { outline: 2px solid #111111; outline-offset: 2px; }
.fbq-page .fb-map { aspect-ratio: 16 / 10; }
.fbq-overview { border-top: 1px solid var(--scheme-border); padding-top: 1.25rem; }
.fbq-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem 1rem; margin: 0 0 1rem; }
.fbq-facts dt { font-size: 0.8125rem; color: var(--scheme-text-muted); }
.fbq-facts dd { margin: 0.125rem 0 0; color: var(--scheme-heading); font-weight: 600; overflow-wrap: anywhere; }
@media (max-width: 479px) { .fbq-facts { grid-template-columns: 1fr; } }
.fbq-sum { list-style: none; margin: 0 0 0.75rem; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.fbq-sum li { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.9375rem; line-height: 1.4; }
.fbq-sum li span:last-child { white-space: nowrap; font-weight: 600; color: var(--scheme-heading); }
.fbq-sum li.is-outside span:last-child { font-weight: 400; color: var(--scheme-text-muted); }
.fbq-sum.is-request li span:last-child { white-space: normal; text-align: right; font-weight: 400; color: var(--scheme-text-muted); font-size: 0.875rem; }
.fbq-sum-total { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin: 0 0 0.5rem; padding-top: 0.75rem; border-top: 1px solid var(--scheme-border); font-family: var(--font-family-heading); font-weight: 700; font-size: 1.25rem; color: var(--scheme-heading); }
.fbq-sum-total small { display: block; font-family: var(--font-family-body); font-weight: 400; font-size: 0.8125rem; color: var(--scheme-text-muted); }
.fbq-sum-sub { margin: 1rem 0 0.5rem; font-weight: 700; color: var(--scheme-heading); }
.fbq-final-note { padding-top: 0.25rem; }

/* fixed cost bar */
.fbq-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--scheme-background); border-top: 1px solid var(--scheme-border); box-shadow: 0 -8px 24px rgba(17, 17, 17, 0.08); padding-bottom: env(safe-area-inset-bottom, 0px); }
.fbq-bar-inner { max-width: 1600px; margin: 0 auto; min-height: var(--fbq-bar); display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.625rem clamp(1rem, 2vw, 1.5rem); }
.fbq-bar-sum { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.fbq-bar-label { font-size: 0.8125rem; color: var(--scheme-text-muted); font-weight: 600; }
.fbq-bar-total { font-family: var(--font-family-heading); font-weight: 700; font-size: clamp(1.125rem, 2vw, 1.5rem); color: var(--scheme-heading); }
.fbq-bar-note { font-size: 0.8125rem; color: var(--scheme-text-muted); }
.fbq-bar-note:empty { display: none; }
.fbq-bar-actions { display: flex; gap: 0.5rem; flex: none; }
.fbq-bar-actions .button { min-height: 48px; white-space: nowrap; }
.fbq-bar-actions .button[disabled] { opacity: 0.7; cursor: progress; }
@media (max-width: 599px) {
  .fbq-page { --fbq-bar: 128px; }
  .fbq-bar-inner { flex-direction: column; align-items: stretch; gap: 0.5rem; padding-top: 0.5rem; padding-bottom: 0.625rem; }
  .fbq-bar-sum { flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: 0.5rem; }
  .fbq-bar-actions .button { flex: 1; justify-content: center; padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
  .fbq-bar-actions [data-back] { flex: 0 0 auto; }
}
.fbq-spinner { width: 1rem; height: 1rem; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; display: inline-block; margin-right: 0.5rem; animation: fbq-spin 0.8s linear infinite; vertical-align: -2px; }
@keyframes fbq-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .fbq-spinner { animation-duration: 2.4s; } }

/* done */
.fbq-done { display: flex; flex-direction: column; gap: 1rem; align-items: center; text-align: center; outline: none; }
.fbq-done-icon { font-size: 3.5rem; color: #111111; display: inline-flex; }
.fbq-done-icon .fb-svg { fill: var(--button-fill); stroke: none; }
.fbq-done-body { width: 100%; text-align: left; display: flex; flex-direction: column; gap: 0.75rem; }
.fbq-review { border: 1px solid var(--scheme-border); border-radius: var(--radius-medium, 16px); padding: 1rem 1.25rem; }
.fbq-next { margin: 0; padding-left: 1.25rem; display: flex; flex-direction: column; gap: 0.5rem; line-height: 1.5; }
.fbq-is-done .fbq-layout { padding-bottom: 2rem; }
