.fflb-page { background:#f5f7f8; }
.fflb-page #wrapper { background:#f5f7f8; }
.fflb-page .product-container { align-items:flex-start; }
.fflb-page .product-container > .col-md-6 { min-width:0; }
.fflb-page h1 { font-size:clamp(24px,2.3vw,34px); line-height:1.2; text-transform:none; color:#182a35; }
.fflb-config { --fflb-accent:#147d8b; --fflb-ink:#182a35; --fflb-muted:#62737d; border:1px solid #dce4e8; border-radius:18px; background:#fff; color:var(--fflb-ink); box-shadow:0 10px 35px #17343f08; overflow:hidden; margin:22px 0; text-align:left; }
.fflb-config *, .fflb-config *::before, .fflb-config *::after { box-sizing:border-box; }
.fflb-header { background:#eff6f7; padding:24px 24px 20px; border-bottom:1px solid #dce7e9; }
.fflb-eyebrow { display:block; font-size:10px; font-weight:750; letter-spacing:1.6px; color:var(--fflb-accent); margin-bottom:9px; }
.fflb-header h2 { font-size:24px; line-height:1.25; margin:0 0 8px; color:var(--fflb-ink); text-transform:none; }
.fflb-header p, .fflb-intro p { font-size:13px; line-height:1.5; color:var(--fflb-muted); margin:0; }
.fflb-preview-note { margin:0!important; padding:10px 24px; background:#fff7df; color:#6d5015; font-size:12px; line-height:1.5; }
.fflb-steps { display:flex; padding:18px 20px; gap:6px; border-bottom:1px solid #edf0f2; }
.fflb-step { min-width:0; flex:1; display:flex; align-items:center; gap:7px; padding:9px 5px; border:0; border-radius:8px; background:transparent; color:#65727a; font:inherit; font-size:12px; text-align:left; cursor:pointer; }
.fflb-step-number { display:flex; align-items:center; justify-content:center; flex:0 0 26px; width:26px; height:26px; border-radius:50%; background:#edf1f3; color:#52636d; font-weight:700; }
.fflb-step[aria-current="step"] { color:var(--fflb-accent); font-weight:700; background:#eff6f7; }
.fflb-step[aria-current="step"] .fflb-step-number { background:var(--fflb-accent); color:white; }
.fflb-step.is-complete .fflb-step-number { background:#ddf0e9; color:#18754c; }
.fflb-step:disabled { cursor:default; opacity:.5; }
.fflb-intro { padding:22px 24px 12px; }
.fflb-intro h3, .fflb-summary h3 { font-size:17px; line-height:1.4; margin:0 0 6px; color:var(--fflb-ink); text-transform:none; }
.fflb-config #dp_product { margin:0; padding:0 24px 18px; width:100%; }
.fflb-config .dp_steps { display:none!important; }
.fflb-config .dp_step_next { display:none!important; }
.fflb-config .dp_steps_buttons { margin:12px 0 0; }
.fflb-config .dp_step_prev { background:transparent!important; border:0!important; color:var(--fflb-muted)!important; box-shadow:none!important; padding:8px 0!important; font-size:13px; }
.fflb-config .dp_group { border:0; padding:12px 0; margin:0; min-width:0; }
.fflb-config .dp_group + .dp_group { border-top:1px solid #edf1f3; }
.fflb-config .dp_field_container { min-width:0; }
.fflb-config .dp_field_container[data-name="profilfarbe_auswahl_text"],
.fflb-config .dp_field_container[data-name="beschriftung_preis"] { display:none!important; }
.fflb-config .dp_group_format > div { display:flex; flex-wrap:wrap; gap:14px; }
.fflb-config .dp_group_format .dp_field_container { flex:1 1 120px; }
.fflb-config .fflb-numeric > .dp_label, .fflb-config .fflb-numeric > .dp_field_label,
.fflb-config .fflb-numeric > .dp_input_container, .fflb-config .fflb-native-label { display:none!important; }
.fflb-number { margin:5px 0 10px; width:100%; max-width:260px; }
.fflb-number > label { display:block; font-size:13px; font-weight:700; color:var(--fflb-ink); margin-bottom:8px; text-align:left; }
.fflb-number-line { display:flex; align-items:center; border:1px solid #cbd7dc; border-radius:9px; min-height:48px; overflow:hidden; background:#fff; }
.fflb-number-line:focus-within { border-color:var(--fflb-accent); box-shadow:0 0 0 3px #147d8b20; }
.fflb-number input { min-width:0; width:100%; border:0!important; border-radius:0!important; background:transparent!important; color:var(--fflb-ink); padding:12px!important; font-size:17px; line-height:1.3; box-shadow:none!important; outline:0; -moz-appearance:textfield; }
.fflb-number input::-webkit-inner-spin-button, .fflb-number input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.fflb-number input:invalid { color:#b42318; }
.fflb-unit { padding-right:12px; color:var(--fflb-muted); font-size:12px; }
.fflb-limit { display:block; margin-top:6px; font-size:11px; color:var(--fflb-muted); }
.fflb-quantity-button { align-self:stretch; min-width:42px; border:0; background:#f3f6f7; color:var(--fflb-accent); font-size:21px; cursor:pointer; }
.fflb-config .dp-radio-option { display:flex!important; align-items:center; gap:10px; width:100%; margin:7px 0!important; padding:13px 14px!important; min-height:48px; border:1px solid #dce4e8!important; border-radius:9px; background:#fff!important; color:var(--fflb-ink); font-size:14px; line-height:1.4; text-align:left!important; cursor:pointer; float:none!important; }
.fflb-config .dp-radio-option input[type="radio"] { position:static!important; opacity:1!important; width:17px!important; height:17px!important; flex:0 0 17px; margin:0!important; accent-color:var(--fflb-accent); }
.fflb-config .dp-radio-option.fflb-selected { border-color:var(--fflb-accent)!important; background:#eff7f8!important; box-shadow:inset 0 0 0 1px var(--fflb-accent); font-weight:600; }
.fflb-config .dp-radio-option::before, .fflb-config .dp-radio-option::after { display:none!important; }
.fflb-config .dp_group_label { font-size:15px; color:var(--fflb-ink); margin-bottom:9px; }
.fflb-config .dp_field_container > label { text-align:left; font-size:14px; font-weight:700; }
.fflb-native-ral { display:none!important; }
.fflb-ral { display:grid; grid-template-columns:repeat(auto-fill,minmax(86px,1fr)); gap:9px; margin:12px 0; }
.fflb-swatch { min-width:0; border:1px solid #d6dfe3; border-radius:9px; padding:6px; background:white; color:var(--fflb-ink); font:inherit; font-size:11px; cursor:pointer; }
.fflb-swatch img { width:100%; height:45px; object-fit:cover; border-radius:5px; display:block; margin-bottom:6px; }
.fflb-swatch[aria-pressed="true"] { outline:2px solid var(--fflb-accent); outline-offset:1px; font-weight:700; }
.fflb-config .ffral-picker { padding:0!important; border:0!important; background:transparent!important; }
.fflb-summary { padding:23px 24px; background:#f6f9fa; border-top:1px solid #dce4e8; }
.fflb-summary-list { display:grid; grid-template-columns:95px minmax(0,1fr); gap:8px 14px; margin:16px 0 22px; font-size:12px; line-height:1.5; }
.fflb-summary-list dt { color:var(--fflb-muted); font-weight:400; }
.fflb-summary-list dd { margin:0; font-weight:600; color:var(--fflb-ink); overflow-wrap:anywhere; }
.fflb-price-row { border-top:1px solid #dce4e8; padding-top:18px; display:flex; justify-content:space-between; gap:14px; align-items:center; }
.fflb-price-row small { display:block; margin-top:4px; font-size:11px; color:var(--fflb-muted); line-height:1.4; }
.fflb-total { white-space:nowrap; font-size:27px; letter-spacing:-.8px; color:var(--fflb-ink); }
.fflb-action { width:100%; padding:15px 12px; min-height:50px; margin-top:18px; border:0; border-radius:9px; background:var(--fflb-accent); color:white; font:inherit; font-size:14px; font-weight:700; cursor:pointer; }
.fflb-action:hover:not(:disabled) { filter:brightness(.92); }
.fflb-action:disabled { opacity:.6; cursor:wait; }
.fflb-message { margin:12px 0 0; font-size:13px; line-height:1.5; color:#18754c; }
.fflb-message.is-error { color:#b42318; }
.fflb-config [hidden] { display:none!important; }
.fflb-config button:focus-visible, .fflb-config label:focus-within { outline:3px solid #e89829; outline-offset:3px; }
.fflb-page .product-actions > form > .product-add-to-cart { display:none!important; }
.fflb-page .product-cover { border-radius:16px; overflow:hidden; }
@media(min-width:992px) { .fflb-page .product-container > .col-md-6:first-child { position:sticky; top:20px; } }
@media(max-width:767px) {
  .fflb-config { border-radius:12px; margin-top:15px; }
  .fflb-header, .fflb-summary { padding:20px 16px; }
  .fflb-header h2 { font-size:22px; }
  .fflb-intro { padding:18px 16px 10px; }
  .fflb-config #dp_product { padding:0 16px 15px; }
  .fflb-steps { padding:12px 10px; gap:3px; }
  .fflb-step { flex-direction:column; text-align:center; font-size:11px; gap:6px; }
  .fflb-preview-note { padding:10px 16px; }
  .fflb-summary-list { grid-template-columns:85px minmax(0,1fr); gap:8px; }
  .fflb-total { font-size:24px; }
  .fflb-config input, .fflb-config select { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { .fflb-config *, .fflb-config *::before, .fflb-config *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* ORACAL 8500: use native option IDs, with a touch-friendly selector. */
.fflb-config .fflb-native-oracal { display:none !important; }
.fflb-oracal { margin:12px 0; }
.fflb-oracal h4 { font-size:17px; margin:0 0 8px; }
.fflb-oracal-count { font-size:14px; color:#405a62; }
.fflb-oracal-search { width:100%; padding:11px 12px; border:1px solid #cbd9df; border-radius:6px; margin-bottom:14px; }
.fflb-oracal-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(105px,1fr)); gap:10px; max-height:440px; overflow:auto; padding:4px; }
.fflb-oracal-swatch { display:flex; flex-direction:column; gap:6px; align-items:stretch; padding:7px; background:white; border:1px solid #cbd9df; border-radius:7px; font-size:12px; line-height:1.4; color:#253841; text-align:left; min-width:0; cursor:pointer; }
.fflb-oracal-swatch[hidden] { display:none !important; }
.fflb-oracal-chip { height:42px; border:1px solid rgba(0,0,0,.15); border-radius:4px; position:relative; }
.fflb-oracal-swatch[aria-pressed="true"] { outline:2px solid var(--fflb-accent,#147d8b); border-color:var(--fflb-accent,#147d8b); }
.fflb-oracal-swatch[aria-pressed="true"] .fflb-oracal-chip::after { content:'✓'; position:absolute; right:4px; top:4px; background:#fff; color:#154d58; border-radius:50%; width:24px; height:24px; line-height:24px; text-align:center; font-weight:bold; }
.fflb-oracal-swatch:disabled { opacity:.45; cursor:default; }
.fflb-oracal-swatch:focus-visible { outline:3px solid #147d8b; outline-offset:2px; }
.fflb-oracal-note { display:block; margin-top:12px; color:#65777f; line-height:1.5; }
@media(max-width:480px) { .fflb-oracal-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
