.erp-picker-field { position: relative; display: inline-grid; max-width: 100%; min-width: 0; vertical-align: middle; }
.erp-picker-form { width: 100%; font-size: .875rem; }
.erp-picker-form > .erp-picker-display { padding-inline: .75rem; font-size: .875rem; }
/* 날짜 필터는 실제 표시하는 ISO 날짜의 최대 길이 + 여백으로 고정한다. */
.erp-list-filters .erp-picker-field[data-kind=date] { flex: none; width: max-content; max-width: none; font-size: .875rem; font-variant-numeric: tabular-nums; }
.erp-list-filters .erp-picker-field[data-kind=date]::before {
  content: "0000-00-00"; visibility: hidden; pointer-events: none; white-space: nowrap;
  box-sizing: border-box; height: var(--erp-control-height, 2.25rem); padding: .25rem .5rem;
  border: 1px solid transparent; line-height: 1.25rem;
}
.erp-list-filters .erp-picker-field[data-kind=date] > input { position: absolute; inset: 0; }
.erp-list-filters input[type=date] { padding-left: .5rem; padding-right: .5rem; font-variant-numeric: tabular-nums; }
.erp-list-filters .erp-picker-field[data-kind=date] > .erp-picker-display { padding-inline: .5rem; font-size: .875rem; }
.erp-picker-field[data-kind=time]:not(.erp-picker-form) > .erp-picker-display { padding-inline: .25rem; font-size: inherit; }
.erp-picker-field > input { width: 100% !important; min-width: 0; cursor: pointer; color: transparent !important; -webkit-text-fill-color: transparent; caret-color: transparent; text-shadow: none; }
.erp-picker-field > input::-webkit-datetime-edit { visibility: hidden; }
.erp-picker-field > input::-webkit-date-and-time-value { visibility: hidden; }
.erp-picker-field > input::-webkit-calendar-picker-indicator { display: none; }
.erp-picker-field > input:disabled { cursor: not-allowed; opacity: .5; }
.erp-picker-display { position: absolute; inset: 0; display: flex; align-items: center; overflow: hidden; pointer-events: none; white-space: nowrap; font-variant-numeric: tabular-nums; }
.erp-picker-placeholder { color: #6b7280; }
.erp-picker-field > input:disabled + .erp-picker-display { opacity: .5; }
#erp-time-picker { position: fixed; z-index: 100; width: 20rem; max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow-y: auto; padding: .75rem; border: 1px solid #d1d5db; border-radius: .25rem; background: #fff; color: #111827; box-shadow: 0 4px 12px #0002; font-size: .875rem; }
#erp-time-picker[hidden], #erp-time-picker [hidden], #erp-time-picker [role=option][hidden] { display: none; }
.erp-picker-title { font-weight: 600; margin-bottom: .5rem; }
.erp-picker-date { margin-bottom: .75rem; }
.erp-picker-date label { display: block; margin-bottom: .25rem; }
.erp-picker-date .erp-picker-field { width: 100% !important; }
.erp-picker-date input { padding: .5rem .75rem; border: 1px solid #d1d5db; border-radius: .25rem; background: #fff; }
.erp-time-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.erp-time-heading { text-align: center; color: #6b7280; margin-bottom: .25rem; }
#erp-time-picker [role=listbox] { height: 9rem; overflow-y: auto; overscroll-behavior: contain; border: 1px solid #d1d5db; border-radius: .25rem; }
#erp-time-picker [role=option] { display: block; width: 100%; height: 2.25rem; text-align: center; font-variant-numeric: tabular-nums; }
#erp-time-picker [role=option]:hover { background: #f3f4f6; }
#erp-time-picker [role=option][aria-selected=true] { background: #dbeafe; color: #1e40af; font-weight: 600; }
#erp-time-picker button:focus-visible { outline: 2px solid #3b82f6; outline-offset: -2px; }
.erp-picker-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .75rem; }
.erp-picker-actions button { padding: .25rem .75rem; border: 1px solid #d1d5db; border-radius: .25rem; }
.erp-picker-actions [data-time-action=clear] { margin-right: auto; border: 0; color: #6b7280; }
.erp-picker-actions [data-time-action=apply] { background: #f59e0b; border-color: #f59e0b; color: white; font-weight: 500; }
.erp-picker-actions [data-time-action=apply]:hover { background: #d97706; }
.dark .erp-picker-placeholder, .dark .erp-time-heading, .dark .erp-picker-actions [data-time-action=clear] { color: #9ca3af; }
.dark #erp-time-picker, .dark .erp-picker-date input { background: #1f2937; color: #f3f4f6; border-color: #4b5563; color-scheme: dark; }
.dark #erp-time-picker [role=listbox], .dark .erp-picker-actions [data-time-action=cancel] { border-color: #4b5563; }
.dark #erp-time-picker [role=option]:hover { background: #374151; }
.dark #erp-time-picker [role=option][aria-selected=true] { background: #1e3a5f; color: #bfdbfe; }