/* /Shared/FlatDateControl.razor.rz.scp.css */
/* =========================================================================
   FlatDateControl — Scoped CSS (Blazor-Scoping via ::deep nicht nötig,
   weil alle Kind-Elemente eigene Klassen haben)
   Nutzt ausschliesslich FlowDesk-Design-Tokens.
   ========================================================================= */

.fdc-wrap[b-hby7vos9jj] {
    position: relative;
    display: inline-block;
    width: 100%;
}
.fdc-wrap.fdc-disabled[b-hby7vos9jj] { opacity: 0.65; cursor: not-allowed; }

.fdc-input[b-hby7vos9jj] {
    width: 100%;
    height: 42px;
    padding: 0 44px 0 14px;
    border: 1px solid var(--fd-input-border, rgba(200,220,255,0.20));
    border-radius: var(--fd-radius-sm, 4px);
    background: var(--fd-input-bg, var(--fd-bg-alt));
    color: var(--fd-text);
    font-family: var(--fd-font, inherit);
    font-size: 0.875rem;
    outline: none;
    box-sizing: border-box;
    cursor: pointer;
}
.fdc-input:focus[b-hby7vos9jj] { border-color: var(--fd-primary); box-shadow: var(--fd-focus-ring, 0 0 0 3px rgba(95,168,211,0.25)); }
.fdc-input[b-hby7vos9jj]::placeholder { color: var(--fd-text-tertiary); }

.fdc-trigger[b-hby7vos9jj] {
    position: absolute;
    top: 50%; right: 6px;
    transform: translateY(-50%);
    width: 30px; height: 30px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--fd-border-strong);
    border-radius: var(--fd-radius-sm);
    background: var(--fd-bg-muted);
    color: var(--fd-text-secondary);
    cursor: pointer;
    padding: 0;
    transition: border-color .15s, background .15s, color .15s;
}
.fdc-trigger:hover[b-hby7vos9jj] { border-color: var(--fd-primary); color: var(--fd-text); background: var(--fd-hover); }
.fdc-trigger:focus-visible[b-hby7vos9jj] { outline: none; border-color: var(--fd-primary); box-shadow: var(--fd-focus-ring); }
.fdc-trigger:disabled[b-hby7vos9jj] { opacity: 0.55; cursor: not-allowed; }
.fdc-trigger svg[b-hby7vos9jj] { width: 15px; height: 15px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.fdc-popup[b-hby7vos9jj] {
    /* Positionierung: am Trigger-Button rechts ausgerichtet (UX-Konvention).
       right:0 verankert den Popover am rechten Rand des Wraps — der Trigger
       sitzt dort, also oeffnet sich der Picker direkt darunter, statt
       linksbuendig zum Input. Bei sehr breiten Eingabefeldern erspart das
       das visuelle Springen vom Klick-Punkt zum Popover-Anfang. */
    position: absolute;
    top: calc(100% + 6px); right: 0;
    min-width: 320px;
    background: var(--fd-surface, var(--fd-bg-alt));
    border: 1px solid var(--fd-border-strong);
    border-radius: var(--fd-radius);
    box-shadow: 0 12px 32px rgba(0,0,0,0.55);
    padding: 12px;
    z-index: 1000;
}

.fdc-header[b-hby7vos9jj] { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.fdc-nav[b-hby7vos9jj] {
    width: 30px; height: 30px;
    background: transparent;
    border: 1px solid var(--fd-border);
    color: var(--fd-text-secondary);
    border-radius: var(--fd-radius-sm);
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; line-height: 1; padding: 0;
    transition: all .15s;
}
.fdc-nav:hover[b-hby7vos9jj] { border-color: var(--fd-primary); color: var(--fd-primary-hover); background: var(--fd-hover); }

.fdc-titel[b-hby7vos9jj] { flex: 1; display: flex; gap: 4px; justify-content: center; align-items: center; }
.fdc-select[b-hby7vos9jj] {
    background: var(--fd-input-bg);
    border: 1px solid var(--fd-input-border);
    color: var(--fd-text);
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
}
.fdc-select:focus[b-hby7vos9jj] { outline: none; border-color: var(--fd-primary); box-shadow: var(--fd-focus-ring); }
.fdc-select option[b-hby7vos9jj] { background: var(--fd-bg-alt); color: var(--fd-text); }

/* Grid: 1 KW-Spalte + 7 Tages-Spalten — identisch fuer Header + Zellen → kein Versatz */
.fdc-grid[b-hby7vos9jj] { display: grid; grid-template-columns: 36px repeat(7, 1fr); gap: 2px; }
.fdc-wochentag[b-hby7vos9jj],
.fdc-wochenlabel[b-hby7vos9jj] {
    text-align: center;
    font-size: 10.5px; font-weight: 700;
    color: var(--fd-text-tertiary);
    text-transform: uppercase; letter-spacing: 0.5px;
    padding: 6px 0;
    border-bottom: 1px solid var(--fd-border);
}
.fdc-wochennr[b-hby7vos9jj] {
    text-align: center;
    font-size: 11px; font-weight: 600;
    color: var(--fd-text-tertiary);
    padding: 8px 0;
    border-right: 1px solid var(--fd-border);
    font-variant-numeric: tabular-nums;
}
.fdc-tag[b-hby7vos9jj] {
    text-align: center;
    font-size: 13px;
    padding: 8px 0;
    border-radius: var(--fd-radius-sm);
    cursor: pointer;
    color: var(--fd-text);
    transition: all .1s;
    font-variant-numeric: tabular-nums;
    background: transparent;
    border: 1px solid transparent;
    font-family: inherit;
}
.fdc-tag:hover[b-hby7vos9jj] { background: var(--fd-hover); border-color: var(--fd-border-strong); }
.fdc-tag.andere-monate[b-hby7vos9jj] { color: var(--fd-text-tertiary); opacity: 0.45; }
.fdc-tag.heute[b-hby7vos9jj] { border-color: var(--fd-primary); color: var(--fd-primary-hover); font-weight: 700; }
.fdc-tag.ausgewaehlt[b-hby7vos9jj] {
    background: var(--fd-primary);
    color: var(--fd-on-primary);
    font-weight: 700;
    border-color: var(--fd-primary);
}
.fdc-tag.ausgewaehlt:hover[b-hby7vos9jj] { background: var(--fd-primary-hover); }
.fdc-tag.wochenende[b-hby7vos9jj] { color: var(--fd-text-secondary); }
.fdc-tag.wochenende.andere-monate[b-hby7vos9jj] { color: var(--fd-text-tertiary); }
.fdc-tag.deaktiviert[b-hby7vos9jj] {
    opacity: 0.25;
    cursor: not-allowed;
    pointer-events: none;
    text-decoration: line-through;
}

.fdc-footer[b-hby7vos9jj] {
    display: flex; justify-content: space-between; gap: 8px;
    margin-top: 10px; padding-top: 10px;
    border-top: 1px solid var(--fd-border);
}
.fdc-btn[b-hby7vos9jj] {
    padding: 6px 12px;
    border: 1px solid var(--fd-border-strong);
    background: var(--fd-bg-muted);
    color: var(--fd-text);
    border-radius: var(--fd-radius-sm);
    font-size: 12px;
    cursor: pointer;
    font-family: inherit;
    transition: all .15s;
}
.fdc-btn:hover[b-hby7vos9jj] { border-color: var(--fd-primary); background: var(--fd-hover); }
.fdc-btn.primary[b-hby7vos9jj] {
    background: var(--fd-primary);
    color: var(--fd-on-primary);
    border-color: var(--fd-primary);
    font-weight: 600;
}
.fdc-btn.primary:hover[b-hby7vos9jj] { background: var(--fd-primary-hover); border-color: var(--fd-primary-hover); }
/* /Shared/FlatDateRangeControl.razor.rz.scp.css */
/* =========================================================================
   Layout-Wrapper fuer FlatDateRangeControl + FlatMonthYearRangeControl.
   Beide nutzen den gleichen .fdrc-* Namensraum, damit Optik und Spacing
   einheitlich sind, egal ob Tages- oder Monatsbereich.

   Tokens mit Fallbacks → laeuft auch ohne FlowDesk-Theme.
   ========================================================================= */

.fdrc-wrap[b-beqdbatkuz] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    width: 100%;
}
.fdrc-wrap.vertical[b-beqdbatkuz] {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
}
.fdrc-wrap.vertical .fdrc-feld[b-beqdbatkuz] { width: 100%; }
.fdrc-wrap.vertical .fdrc-sep[b-beqdbatkuz]  { display: none; }

.fdrc-feld[b-beqdbatkuz] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1 1 auto;
    min-width: 0;          /* damit der Inner-Picker in schmalen Spalten nicht ueber den Container hinausragt */
}

.fdrc-label[b-beqdbatkuz] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--fd-text-tertiary, rgba(120, 130, 150, 0.85));
}

.fdrc-sep[b-beqdbatkuz] {
    flex: 0 0 auto;
    align-self: center;
    padding: 0 4px;
    color: var(--fd-text-tertiary, rgba(120, 130, 150, 0.85));
    font-size: 16px;
    line-height: 1;
    /* nimmt den Label-Hoehenunterschied auf, damit der Bindestrich auf
       Input-Hoehe sitzt, nicht auf Label-Hoehe */
    margin-bottom: 11px;
}
/* /Shared/FlatDateTimeControl.razor.rz.scp.css */
/* ============================================================================
   FlatDateTimeControl · Scoped CSS
   Layout: Datum + Zeit nebeneinander (horizontal). Auf engen Containern
   bricht es per CSS-Grid auf zwei Zeilen um.
   ============================================================================ */

.fdtc-wrap[b-juqxl5g22h] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}

.fdtc-labels[b-juqxl5g22h] {
    display: grid;
    grid-template-columns: 1fr 110px;
    gap: 8px;
}

.fdtc-label[b-juqxl5g22h] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--fd-text-tertiary, rgba(120, 130, 150, 0.85));
}

.fdtc-inputs[b-juqxl5g22h] {
    display: grid;
    grid-template-columns: 1fr 110px;
    gap: 8px;
    align-items: stretch;
}

.fdtc-date[b-juqxl5g22h] {
    min-width: 0;
}

/* Time-Input: Background = transparent (FlowDesk-Konvention).
   Begruendung: erbt vom Container — theme-robust, keine Variable verbraucht,
   keine Doppelung von Surface-Werten zwischen Modal und Input. Sichtbarkeit
   kommt vom Border. Text explizit auf --fd-text (#e4eaf4 in Government Dark). */
.fdtc-time[b-juqxl5g22h] {
    height: 42px;
    padding: 0 10px;
    border: 1px solid var(--fd-border-strong, rgba(255,255,255,0.14));
    border-radius: var(--fd-radius-sm, 8px);
    background-color: transparent;
    color: var(--fd-text, #e4eaf4);
    font-family: var(--fd-font, inherit);
    font-size: 0.875rem;
    font-variant-numeric: tabular-nums;
    outline: none;
    box-sizing: border-box;
}
/* Browser-Pseudo-Elemente fuer time-Input — sonst weisser System-Default
   im Dark-Mode. Analog zum globalen forms-reset-CSS. */
.fdtc-time[b-juqxl5g22h]::-webkit-datetime-edit,
.fdtc-time[b-juqxl5g22h]::-webkit-datetime-edit-fields-wrapper,
.fdtc-time[b-juqxl5g22h]::-webkit-datetime-edit-hour-field,
.fdtc-time[b-juqxl5g22h]::-webkit-datetime-edit-minute-field,
.fdtc-time[b-juqxl5g22h]::-webkit-datetime-edit-text {
    color: var(--fd-text, #e8eef8);
}
.fdtc-time[b-juqxl5g22h]::-webkit-calendar-picker-indicator {
    filter: var(--fd-icon-filter, invert(0.85));
    cursor: pointer;
}
/* Property ShowClockIcon=false: Browser-natives Uhren-Symbol ausblenden. */
.fdtc-time.fdtc-no-icon[b-juqxl5g22h]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
    appearance: none;
}
/* Placeholder „--:--" sichtbar wenn Wert leer (RequireTime=false-Fall).
   WebKit zeigt bei leerem time-Input die Pseudo-Felder als „--:--" an —
   Farbe explizit auf text-tertiary, damit es als Placeholder wirkt. */
.fdtc-time:not(:focus):invalid[b-juqxl5g22h]::-webkit-datetime-edit,
.fdtc-time:not(:focus):placeholder-shown[b-juqxl5g22h]::-webkit-datetime-edit {
    color: var(--fd-text-tertiary, rgba(120,130,150,0.85));
}
.fdtc-time:focus[b-juqxl5g22h] {
    border-color: var(--fd-primary, #5b5bd6);
    box-shadow: var(--fd-focus-ring, 0 0 0 3px rgba(91,91,214,0.25));
}
.fdtc-time:disabled[b-juqxl5g22h], .fdtc-time.fdtc-disabled[b-juqxl5g22h] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* Slot-Dropdown (select) — optisch identisch zum time-Input.
   Aktiv wenn MinTime+MaxTime gesetzt sind. */
select.fdtc-time[b-juqxl5g22h] {
    appearance: none;
    -webkit-appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                      linear-gradient(-45deg, transparent 50%, currentColor 50%);
    background-position: calc(100% - 14px) 50%, calc(100% - 9px) 50%;
    background-size: 5px 5px;
    background-repeat: no-repeat;
    padding-right: 28px;
    cursor: pointer;
}
select.fdtc-time option[b-juqxl5g22h] {
    background-color: var(--fd-surface, #1a2436);
    color: var(--fd-text, #e4eaf4);
}

/* Engere Container: untereinander */
@media (max-width: 380px) {
    .fdtc-labels[b-juqxl5g22h], .fdtc-inputs[b-juqxl5g22h] {
        grid-template-columns: 1fr;
    }
}
/* /Shared/FlatMonthYearControl.razor.rz.scp.css */
/* =========================================================================
   FlatMonthYearControl — Scoped CSS
   Klassen-Namensraum .fmyc-* analog zu .fdc-* von FlatDateControl, damit
   Optik visuell identisch wirkt. Nutzt ausschliesslich FlowDesk-Tokens.
   ========================================================================= */

.fmyc-wrap[b-kyhgd5r9cz] {
    position: relative;
    display: inline-block;
    width: 100%;
}
.fmyc-wrap.fmyc-disabled[b-kyhgd5r9cz] { opacity: 0.65; cursor: not-allowed; }

.fmyc-input[b-kyhgd5r9cz] {
    width: 100%;
    height: 42px;
    padding: 0 44px 0 14px;
    border: 1px solid var(--fd-input-border, rgba(200,220,255,0.20));
    border-radius: var(--fd-radius-sm, 4px);
    background: var(--fd-input-bg, var(--fd-bg-alt));
    color: var(--fd-text);
    font-family: var(--fd-font, inherit);
    font-size: 0.875rem;
    outline: none;
    box-sizing: border-box;
    cursor: pointer;
}
.fmyc-input:focus[b-kyhgd5r9cz] { border-color: var(--fd-primary); box-shadow: var(--fd-focus-ring, 0 0 0 3px rgba(95,168,211,0.25)); }
.fmyc-input[b-kyhgd5r9cz]::placeholder { color: var(--fd-text-tertiary); }

.fmyc-trigger[b-kyhgd5r9cz] {
    position: absolute;
    top: 50%; right: 6px;
    transform: translateY(-50%);
    width: 30px; height: 30px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--fd-border-strong);
    border-radius: var(--fd-radius-sm);
    background: var(--fd-bg-muted);
    color: var(--fd-text-secondary);
    cursor: pointer;
    padding: 0;
    transition: border-color .15s, background .15s, color .15s;
}
.fmyc-trigger:hover[b-kyhgd5r9cz] { border-color: var(--fd-primary); color: var(--fd-text); background: var(--fd-hover); }
.fmyc-trigger:focus-visible[b-kyhgd5r9cz] { outline: none; border-color: var(--fd-primary); box-shadow: var(--fd-focus-ring); }
.fmyc-trigger:disabled[b-kyhgd5r9cz] { opacity: 0.55; cursor: not-allowed; }
.fmyc-trigger svg[b-kyhgd5r9cz] { width: 15px; height: 15px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.fmyc-popup[b-kyhgd5r9cz] {
    position: absolute;
    top: calc(100% + 6px); left: 0;
    min-width: 260px;
    background: var(--fd-surface, var(--fd-bg-alt));
    border: 1px solid var(--fd-border-strong);
    border-radius: var(--fd-radius);
    box-shadow: 0 12px 32px rgba(0,0,0,0.55);
    padding: 12px;
    z-index: 1000;
}

.fmyc-header[b-kyhgd5r9cz] { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.fmyc-nav[b-kyhgd5r9cz] {
    width: 30px; height: 30px;
    background: transparent;
    border: 1px solid var(--fd-border);
    color: var(--fd-text-secondary);
    border-radius: var(--fd-radius-sm);
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; line-height: 1; padding: 0;
    transition: all .15s;
}
.fmyc-nav:hover:not(:disabled)[b-kyhgd5r9cz] { border-color: var(--fd-primary); color: var(--fd-primary-hover); background: var(--fd-hover); }
.fmyc-nav:disabled[b-kyhgd5r9cz] { opacity: 0.35; cursor: not-allowed; }

.fmyc-titel[b-kyhgd5r9cz] { flex: 1; display: flex; gap: 4px; justify-content: center; align-items: center; }
.fmyc-select[b-kyhgd5r9cz] {
    background: var(--fd-input-bg);
    border: 1px solid var(--fd-input-border);
    color: var(--fd-text);
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
}
.fmyc-select:focus[b-kyhgd5r9cz] { outline: none; border-color: var(--fd-primary); box-shadow: var(--fd-focus-ring); }
.fmyc-select option[b-kyhgd5r9cz] { background: var(--fd-bg-alt); color: var(--fd-text); }

/* 3x4-Monatsraster */
.fmyc-grid[b-kyhgd5r9cz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.fmyc-month[b-kyhgd5r9cz] {
    height: 42px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--fd-radius-sm);
    color: var(--fd-text);
    font-size: 13px;
    font-family: inherit;
    cursor: pointer;
    transition: all .1s;
}
.fmyc-month:hover[b-kyhgd5r9cz] { background: var(--fd-hover); border-color: var(--fd-border-strong); }
.fmyc-month.heute[b-kyhgd5r9cz] { border-color: var(--fd-primary); color: var(--fd-primary-hover); font-weight: 700; }
.fmyc-month.ausgewaehlt[b-kyhgd5r9cz] {
    background: var(--fd-primary);
    color: var(--fd-on-primary);
    font-weight: 700;
    border-color: var(--fd-primary);
}
.fmyc-month.ausgewaehlt:hover[b-kyhgd5r9cz] { background: var(--fd-primary-hover); border-color: var(--fd-primary-hover); }
.fmyc-month.deaktiviert[b-kyhgd5r9cz] {
    opacity: 0.25;
    cursor: not-allowed;
    pointer-events: none;
    text-decoration: line-through;
}

.fmyc-footer[b-kyhgd5r9cz] {
    display: flex; justify-content: flex-end; gap: 8px;
    margin-top: 10px; padding-top: 10px;
    border-top: 1px solid var(--fd-border);
}
.fmyc-footer-single[b-kyhgd5r9cz] {
    justify-content: center;
}
.fmyc-footer-single > span[b-kyhgd5r9cz] {
    display: none;
}
/* Wenn nur ein Button im Footer ist (z.B. ShowClearButton=false),
   nimmt er die volle Breite und zentriert seinen Text. */
.fmyc-footer > .fmyc-btn:only-child[b-kyhgd5r9cz] {
    text-align: center;
}
.fmyc-btn[b-kyhgd5r9cz] {
    padding: 6px 12px;
    border: 1px solid var(--fd-border-strong);
    background: var(--fd-bg-muted);
    color: var(--fd-text);
    border-radius: var(--fd-radius-sm);
    font-size: 12px;
    cursor: pointer;
    font-family: inherit;
    transition: all .15s;
}
.fmyc-btn:hover[b-kyhgd5r9cz] { border-color: var(--fd-primary); background: var(--fd-hover); }
.fmyc-btn.primary[b-kyhgd5r9cz] {
    background: var(--fd-primary);
    color: var(--fd-on-primary);
    border-color: var(--fd-primary);
    font-weight: 600;
}
.fmyc-btn.primary:hover[b-kyhgd5r9cz] { background: var(--fd-primary-hover); border-color: var(--fd-primary-hover); }
/* /Shared/FlatMonthYearRangeControl.razor.rz.scp.css */
/* =========================================================================
   Identische Layout-Regeln wie FlatDateRangeControl.razor.css. Blazor-Scoped-
   CSS ist per-Datei gebunden, daher das Duplikat (kein Caching-Vorteil
   verloren — beide Dateien sind klein, gleiche Klassen-Namensraum .fdrc-*).
   ========================================================================= */

.fdrc-wrap[b-zbtwm5dezj] {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    width: 100%;
}
.fdrc-wrap.vertical[b-zbtwm5dezj] {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
}
.fdrc-wrap.vertical .fdrc-feld[b-zbtwm5dezj] { width: 100%; }
.fdrc-wrap.vertical .fdrc-sep[b-zbtwm5dezj]  { display: none; }

.fdrc-feld[b-zbtwm5dezj] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1 1 auto;
    min-width: 0;
}

.fdrc-label[b-zbtwm5dezj] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--fd-text-tertiary, rgba(120, 130, 150, 0.85));
}

.fdrc-sep[b-zbtwm5dezj] {
    flex: 0 0 auto;
    align-self: center;
    padding: 0 4px;
    color: var(--fd-text-tertiary, rgba(120, 130, 150, 0.85));
    font-size: 16px;
    line-height: 1;
    margin-bottom: 11px;
}
/* /Shared/FlatTimeControl.razor.rz.scp.css */
/* ============================================================================
   FlatTimeControl · Scoped CSS
   Time-only picker. Slot-Dropdown wenn MinTime+MaxTime gesetzt, sonst
   natives <input type="time">. Background = transparent (FlowDesk-Konvention).
   ============================================================================ */

.ftc-time[b-2ntbn5xm4k] {
    height: 42px;
    width: 100%;
    padding: 0 10px;
    border: 1px solid var(--fd-border-strong, rgba(255,255,255,0.14));
    border-radius: var(--fd-radius-sm, 8px);
    background-color: transparent;
    color: var(--fd-text, #e4eaf4);
    font-family: var(--fd-font, inherit);
    font-size: 0.875rem;
    font-variant-numeric: tabular-nums;
    outline: none;
    box-sizing: border-box;
}
.ftc-time[b-2ntbn5xm4k]::-webkit-datetime-edit,
.ftc-time[b-2ntbn5xm4k]::-webkit-datetime-edit-fields-wrapper,
.ftc-time[b-2ntbn5xm4k]::-webkit-datetime-edit-hour-field,
.ftc-time[b-2ntbn5xm4k]::-webkit-datetime-edit-minute-field,
.ftc-time[b-2ntbn5xm4k]::-webkit-datetime-edit-text { color: var(--fd-text, #e4eaf4); }
.ftc-time[b-2ntbn5xm4k]::-webkit-calendar-picker-indicator {
    filter: var(--fd-icon-filter, invert(0.85));
    cursor: pointer;
}
.ftc-time.ftc-no-icon[b-2ntbn5xm4k]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
    appearance: none;
}
.ftc-time:not(:focus):invalid[b-2ntbn5xm4k]::-webkit-datetime-edit,
.ftc-time:not(:focus):placeholder-shown[b-2ntbn5xm4k]::-webkit-datetime-edit {
    color: var(--fd-text-tertiary, rgba(120,130,150,0.85));
}
.ftc-time:focus[b-2ntbn5xm4k] {
    border-color: var(--fd-primary, #5b5bd6);
    box-shadow: var(--fd-focus-ring, 0 0 0 3px rgba(91,91,214,0.25));
}
.ftc-time:disabled[b-2ntbn5xm4k], .ftc-time.ftc-disabled[b-2ntbn5xm4k] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* Slot-Dropdown — optisch identisch zum time-Input */
select.ftc-time[b-2ntbn5xm4k] {
    appearance: none;
    -webkit-appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                      linear-gradient(-45deg, transparent 50%, currentColor 50%);
    background-position: calc(100% - 14px) 50%, calc(100% - 9px) 50%;
    background-size: 5px 5px;
    background-repeat: no-repeat;
    padding-right: 28px;
    cursor: pointer;
}
select.ftc-time option[b-2ntbn5xm4k] {
    background-color: var(--fd-surface, #1a2436);
    color: var(--fd-text, #e4eaf4);
}
