/* Eingabefelder der Kundenseite (v1 und v2): sichtbare Ränder (mind. 3:1 Kontrast), kein Zoom auf iOS (16 px),
   klarer Fokus, Fehler erst nach Eingabe, ruhiges Autofill, große Tippflächen, native Auswahl-Pfeile. */
:root[data-surface=customer]{--f-line:rgba(30,45,40,.44);--f-line-hover:rgba(30,45,40,.66);--f-bg:#FFFFFF;--f-bg-solid:#FFFFFF;--f-ink:#1E2D28;--f-label:#1E2D28;--f-hint:#56665F;--f-ph:rgba(30,45,40,.48);--f-focus:#173F33;--f-ring:rgba(23,63,51,.16);--f-err:#B44B4B;--f-err-bg:#FFF7F7;
 --f-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%231E2D28' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
:root[data-surface=customer][data-theme=dark]{--f-line:rgba(245,238,229,.46);--f-line-hover:rgba(245,238,229,.7);--f-bg:rgba(245,238,229,.07);--f-bg-solid:#13302A;--f-ink:#F5EEE5;--f-label:#F5EEE5;--f-hint:rgba(245,238,229,.72);--f-ph:rgba(245,238,229,.5);--f-focus:#F3D9D3;--f-ring:rgba(243,217,211,.22);--f-err:#F1A7A7;--f-err-bg:rgba(241,167,167,.08);
 --f-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%23F5EEE5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

:root[data-surface=customer] :is(input:not([type=checkbox],[type=radio],[type=hidden],[type=range],[type=file]),select,textarea){
 -webkit-appearance:none;appearance:none;display:block;width:100%;min-height:54px;margin:0;padding:14px 20px;
 font-size:max(16px,1rem);line-height:1.3;color:var(--f-ink);caret-color:var(--f-focus);
 background-color:var(--f-bg)!important;border:1.5px solid var(--f-line)!important;border-radius:999px;box-shadow:none;
 transition:border-color .2s,box-shadow .2s,background-color .2s;scroll-margin:96px 0 200px;-webkit-tap-highlight-color:transparent}
:root[data-surface=customer] textarea{border-radius:22px;min-height:104px;resize:vertical;line-height:1.45}
:root[data-surface=customer] select{padding-right:48px;background-image:var(--f-chevron)!important;background-repeat:no-repeat!important;background-position:right 20px center!important;background-size:14px 9px!important;cursor:pointer}
:root[data-surface=customer] :is(input,select,textarea)::placeholder{color:var(--f-ph);opacity:1}
@media (hover:hover){:root[data-surface=customer] :is(input:not([type=checkbox],[type=radio]),select,textarea):hover:not(:focus):not(:disabled){border-color:var(--f-line-hover)!important}}
:root[data-surface=customer] :is(input:not([type=checkbox],[type=radio]),select,textarea):focus{outline:none;border-color:var(--f-focus)!important;box-shadow:0 0 0 4px var(--f-ring)!important}
:root[data-surface=customer] :is(input,select,textarea):disabled{opacity:.55;cursor:not-allowed}
/* Fehler erst nach Interaktion (:user-invalid) oder wenn die App sie markiert */
:root[data-surface=customer] :is(input,select,textarea):is(:user-invalid,[aria-invalid=true]){border-color:var(--f-err)!important;background-color:var(--f-err-bg)!important}
:root[data-surface=customer] :is(input,select,textarea):is(:user-invalid,[aria-invalid=true]):focus{box-shadow:0 0 0 4px color-mix(in srgb,var(--f-err) 18%,transparent)!important}
/* Autofill ohne gelbe Fläche */
:root[data-surface=customer] :is(input,textarea,select):-webkit-autofill{-webkit-text-fill-color:var(--f-ink);caret-color:var(--f-ink);-webkit-box-shadow:0 0 0 1000px var(--f-bg-solid) inset!important;transition:background-color 9999s}
/* Datum: linksbündig wie Text, Kalender-Symbol sichtbar */
:root[data-surface=customer] input[type=date]{text-align:left;min-height:54px}
:root[data-surface=customer] input::-webkit-date-and-time-value{text-align:left}
:root[data-surface=customer][data-theme=dark] input::-webkit-calendar-picker-indicator{filter:invert(.9)}
:root[data-surface=customer] input[type=search]::-webkit-search-cancel-button{cursor:pointer}
/* Beschriftung und Hinweise */
:root[data-surface=customer] label:not(.check):not(.glow-extra):not(.glow-opt){display:block;margin:18px 4px 7px;font-size:14px;font-weight:600;line-height:1.3;color:var(--f-label)}
:root[data-surface=customer] label+:is(input,select,textarea){margin-top:0}
:root[data-surface=customer] fieldset{border:1.5px solid var(--f-line);border-radius:24px;padding:4px 16px 16px;margin:18px 0 0}
:root[data-surface=customer] legend{padding:0 8px;font-size:13px;font-weight:600;color:var(--f-hint)}
/* Checkboxen: große Tippfläche, sichtbarer Rand */
:root[data-surface=customer] :is(input[type=checkbox],input[type=radio]){width:24px;height:24px;flex:none;margin:0;accent-color:var(--f-focus);cursor:pointer}
:root[data-surface=customer] .check{display:flex;gap:12px;align-items:flex-start;min-height:52px;padding:14px 16px;border:1.5px solid var(--f-line);border-radius:20px;cursor:pointer;line-height:1.45}
:root[data-surface=customer] .check:has(input:checked){border-color:var(--f-focus)}
:root[data-surface=customer] .check:has(input:user-invalid){border-color:var(--f-err)}
:root[data-surface=customer] .check:has(input:focus-visible){box-shadow:0 0 0 4px var(--f-ring)}
/* Einmal-Code: große Ziffern mit Abstand */
:root[data-surface=customer] .glow-otp{font-size:26px!important;letter-spacing:.42em;text-align:center;font-variant-numeric:tabular-nums;padding-left:calc(20px + .42em)}
/* Tastatur offen: Tab-Leiste ausblenden, Aktionsleiste direkt über der Tastatur */
.kb-open #tabs{display:none!important}
.kb-open :is(.glow-cta,.v2-dock){bottom:calc(var(--kb,0px) + 10px)!important}
.kb-open .dock-hint{display:none}
@media (prefers-reduced-motion:reduce){:root[data-surface=customer] :is(input,select,textarea){transition:none}}
:root[data-surface=customer] :is(input,select,textarea)+:is(p.small,p.hint,.field-hint){margin:8px 6px 0}