.customSelect { position: relative; } .customSelect>* { margin: 0; } .selectTrigger .selectArrow { transition: rotate 0.6s ease; } table input { height: 38px; } .selectTrigger, .selectTriggerBulk { background: none; border: none; padding: 0; display: flex; justify-content: space-between; align-items: center; cursor: pointer; } .selectOptions, .selectOptionsBulk { position: absolute; top: calc(100% + 4px); left: 0; right: 0; padding: 4px; list-style: none; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; z-index: 1000; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); opacity: 0; transform: scaleY(0); transform-origin: top; pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease; } .customSelect.open .selectOptions, .customSelect.open .selectOptionsBulk { opacity: 1; transform: scaleY(1); pointer-events: auto; } .customSelect.open .selectArrow { rotate: 180deg } .selectOptions li, .selectOptionsBulk li { padding: 10px 14px; cursor: pointer; border-radius: 8px; margin-bottom: 2px; transition: background-color 0.15s ease; } .selectOptions li:last-child, .selectOptionsBulk li:last-child { margin-bottom: 0; } .selectOptions li:hover, .selectOptionsBulk li:hover { background-color: #eee; } .selectOptions li.selected, .selectOptionsBulk li.selected { background-color: #ccc; color: #000; font-weight: 500; } .selectLabel { font-size: 1rem; }