select.ui-sel-nativ {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  background-color: var(--card, #fff);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d8a90' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 16px 16px;
  padding-right: 2.25rem; cursor: pointer;
}
select.ui-sel-nativ:disabled { cursor: not-allowed; opacity: 0.6; }
input.ui-datum-nativ::-webkit-calendar-picker-indicator { display: none; -webkit-appearance: none; }
input.ui-datum-nativ { cursor: pointer; padding-right: 2.25rem;
  background-color: var(--card, #fff);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d8a90' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 0.75rem center; background-size: 16px 16px; }
input.ui-datum-nativ:disabled { cursor: not-allowed; opacity: 0.6; }
.ui-pop { position: fixed; z-index: 800; background: var(--card, #fff); color: var(--ink, #172125);
  border: 1px solid var(--line, #e6e1d6); border-radius: 14px; padding: 6px;
  box-shadow: 0 18px 44px rgba(16, 24, 40, 0.2); font-family: inherit; font-size: 0.93rem;
  max-height: min(320px, 60vh); overflow-y: auto; overscroll-behavior: contain; }
.ui-liste { list-style: none; margin: 0; padding: 0; min-width: 180px; }
.ui-opt { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; padding: 0.5rem 0.65rem;
  border-radius: 9px; cursor: pointer; line-height: 1.35; user-select: none; }
.ui-opt:hover, .ui-opt.hervor { background: var(--card2, #f3efe6); }
.ui-opt.aktiv { color: var(--brand-1, #12806a); font-weight: 650; }
.ui-opt.aus { opacity: 0.4; cursor: not-allowed; }
.ui-opt .ui-haken { width: 16px; height: 16px; flex: 0 0 auto; color: var(--brand-1, #12806a); }
.ui-opt:focus-visible, .ui-tag:focus-visible, .ui-kopf-knopf:focus-visible, .ui-fuss-knopf:focus-visible {
  outline: 2px solid var(--brand-1, #12806a); outline-offset: 1px; }
.ui-cal { width: 296px; padding: 12px; }
.ui-cal-kopf { display: flex; align-items: center; justify-content: space-between; gap: 0.4rem; margin-bottom: 0.6rem; }
.ui-cal-titel { font-size: 0.98rem; font-weight: 680; letter-spacing: -0.01em; }
.ui-kopf-knopf { width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--line, #e6e1d6); background: var(--card, #fff);
  color: var(--ink, #172125); cursor: pointer; font: inherit; font-size: 1.05rem; line-height: 1; display: inline-grid; place-items: center; }
.ui-kopf-knopf:hover { border-color: var(--brand-1, #12806a); color: var(--brand-1, #12806a); }
.ui-wochentage, .ui-raster { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.ui-wochentage span { text-align: center; font-size: 0.7rem; font-weight: 720; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--muted, #66767d); padding: 0.25rem 0 0.4rem; }
.ui-tag { aspect-ratio: 1; border: 0; border-radius: 9px; background: none; color: var(--ink, #172125); font: inherit;
  font-size: 0.86rem; font-variant-numeric: tabular-nums; cursor: pointer; display: grid; place-items: center; padding: 0; }
.ui-tag:hover:not(:disabled) { background: var(--card2, #f3efe6); }
.ui-tag.anderer { color: var(--muted, #66767d); opacity: 0.55; }
.ui-tag.heute { box-shadow: inset 0 0 0 1.5px var(--brand-1, #12806a); font-weight: 680; }
.ui-tag.gewaehlt { background: var(--brand-1, #12806a); color: var(--hell, #fff); font-weight: 680; }
.ui-tag.gewaehlt:hover { background: var(--brand-1, #12806a); }
.ui-tag:disabled { opacity: 0.25; cursor: not-allowed; }
.ui-fuss { display: flex; justify-content: space-between; gap: 0.5rem; margin-top: 0.7rem; padding-top: 0.6rem; border-top: 1px solid var(--line, #e6e1d6); }
.ui-fuss-knopf { border: 0; background: none; color: var(--brand-1, #12806a); font: inherit; font-size: 0.86rem; font-weight: 650; cursor: pointer; padding: 0.3rem 0.4rem; border-radius: 8px; }
.ui-fuss-knopf:hover { background: var(--card2, #f3efe6); }
@media (prefers-reduced-motion: no-preference) { .ui-pop { animation: ui-auf 0.14s ease-out; } }
@keyframes ui-auf { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
