.smart-select {
  position: relative;
  min-width: 0;
  width: 100%;
}

.smart-select.open {
  z-index: 250;
}

.smart-select-native {
  position: absolute !important;
  left: 12px !important;
  bottom: 4px !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.smart-select-trigger {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 8px 11px !important;
  border: 1px solid #ccc6bc !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #333 !important;
  text-align: left !important;
  box-shadow: none !important;
}

.smart-select-trigger:hover {
  border-color: #b58a49 !important;
  background: #fffcf7 !important;
}

.smart-select-trigger:focus-visible,
.smart-select.open .smart-select-trigger {
  outline: none;
  border-color: #cf7f07 !important;
  box-shadow: 0 0 0 3px #cf7f071c !important;
}

.smart-select.invalid .smart-select-trigger {
  border-color: #a33b34 !important;
  box-shadow: 0 0 0 3px #a33b3418 !important;
}

.smart-select-trigger.placeholder .smart-select-value strong {
  color: #777;
  font-weight: 600;
}

.smart-select-value {
  display: block;
  min-width: 0;
  line-height: 1.25;
}

.smart-select-value strong,
.smart-select-value small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.smart-select-value strong {
  color: inherit;
  font-size: 12px;
  font-weight: 700;
}

.smart-select-value small {
  margin-top: 2px;
  color: #8a7660;
  font-size: 9px;
  font-weight: 500;
}

.smart-select-chevron {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #f1ede6;
  color: #6f604e;
  font-size: 17px;
  line-height: 1;
  transition: transform .16s ease, background .16s ease;
}

.smart-select.open .smart-select-chevron {
  transform: rotate(180deg);
  background: #fff0d7;
  color: #9a5d03;
}

.smart-select-panel {
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  width: 100%;
  min-width: 260px;
  border: 1px solid #d5cec3;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 20px 50px #251b0c35;
  overflow: hidden;
}

.smart-select-panel.smart-select-floating {
  position: fixed !important;
  z-index: 2147483000;
  margin: 0;
}

.smart-select.opens-up .smart-select-panel {
  top: auto;
  bottom: calc(100% + 7px);
}

.smart-select-panel[hidden] {
  display: none;
}

.smart-select-search-row {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 5px;
  padding: 9px;
  background: #f5f3ef;
  border-bottom: 1px solid #e1ddd5;
}

.smart-select-search-row > span {
  display: grid;
  place-items: center;
  color: #bd7206;
  font-size: 20px;
}

.fields .smart-select-search,
.smart-select-search {
  width: 100% !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid #d3ccc1 !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #292929 !important;
  font-size: 12px !important;
  outline: none;
}

.fields .smart-select-search:focus,
.smart-select-search:focus {
  border-color: #cf7f07 !important;
  box-shadow: 0 0 0 3px #cf7f0717 !important;
}

.smart-select-result-count {
  padding: 4px 7px;
  border-radius: 10px;
  background: #292c2e;
  color: #fff;
  font-size: 8px;
  font-weight: 800;
  white-space: nowrap;
}

.smart-select-options {
  max-height: 270px;
  overflow: auto;
  padding: 6px;
}

.smart-select-option {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  padding: 8px 9px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #333 !important;
  text-align: left !important;
}

.smart-select-option + .smart-select-option {
  margin-top: 2px;
}

.smart-select-option:hover,
.smart-select-option.active {
  background: #fff5e5 !important;
}

.smart-select-option.selected {
  background: #fff0d4 !important;
}

.smart-select-option:disabled {
  cursor: not-allowed !important;
  background: #f2f1ee !important;
  color: #817d76 !important;
  opacity: 1;
}

.smart-select-check {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid #d5d0c8;
  border-radius: 50%;
  color: transparent;
  font-size: 11px;
}

.smart-select-option.selected .smart-select-check {
  border-color: #cf7f07;
  background: #cf7f07;
  color: #fff;
}

.smart-select-option-text {
  display: block;
  min-width: 0;
}

.smart-select-option-text strong,
.smart-select-option-text small {
  display: block;
}

.smart-select-option-text strong {
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
  font-size: 11px;
  white-space: nowrap;
}

.smart-select-option-text small {
  margin-top: 2px;
  color: #88745a;
  font-size: 9px;
  line-height: 1.3;
}

.smart-select-option:disabled .smart-select-option-text small {
  color: #8b8780;
}

.smart-select-option em {
  padding: 3px 5px;
  border-radius: 3px;
  background: #e2dfda;
  color: #6e6a64;
  font-size: 7px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.smart-select-empty {
  display: grid;
  place-items: center;
  padding: 25px 12px;
  text-align: center;
  color: #777;
}

.smart-select-empty > span {
  color: #cf7f07;
  font-size: 28px;
}

.smart-select-empty b,
.smart-select-empty small {
  display: block;
}

.smart-select-empty b {
  margin-top: 3px;
  color: #444;
  font-size: 12px;
}

.smart-select-empty small {
  margin-top: 2px;
  font-size: 9px;
}

.smart-select-help {
  display: flex;
  justify-content: center;
  gap: 11px;
  padding: 7px 9px;
  border-top: 1px solid #e6e1d9;
  background: #faf9f7;
  color: #999;
  font-size: 7px;
  font-weight: 700;
  text-transform: uppercase;
}

.smart-select-help span {
  white-space: nowrap;
}

@media (max-width: 700px) {
  .smart-select-panel {
    min-width: 100%;
  }

  .smart-select-help {
    display: none;
  }

  .smart-select-options {
    max-height: 220px;
  }
}

/* Customer initials only; the existing text search remains available. */
.smart-select-panel.has-customer-alphabet{overflow-y:auto;overscroll-behavior:contain}
.smart-select-alphabet{display:flex;flex-wrap:wrap;gap:4px;padding:8px 9px;border-bottom:1px solid #e1ddd5;background:#faf9f7}
.smart-select-alphabet button{display:grid;place-items:center;min-width:30px;min-height:30px;margin:0;padding:4px 7px;border:1px solid #ddd7cf;border-radius:4px;background:#fff;color:#3e3c38;font-size:11px;font-weight:700;line-height:1}
.smart-select-alphabet button[aria-pressed="true"]{background:#cf7f07;border-color:#cf7f07;color:#fff}
.smart-select-alphabet button:hover:not(:disabled){background:#fff0d4;color:#704510}
.smart-select-alphabet button:disabled{color:#b7b1a8;background:#f3f1ed;cursor:default}
.smart-select-alphabet button:focus-visible{outline:2px solid #9a5d03;outline-offset:1px}
@media(max-width:700px){.smart-select-alphabet button{min-width:36px;min-height:36px;font-size:12px}}

/* The fleet is an overview rather than a five-row dropdown. */
.smart-select-vehicle-panel{display:flex;flex-direction:column;box-sizing:border-box}
.smart-select-vehicle-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:6px 14px;background:#263746;color:#fff}
.smart-select-vehicle-head>b{font-size:16px}
.smart-select-vehicle-head .smart-select-vehicle-close{display:grid;place-items:center;width:32px;min-height:32px;padding:0;background:transparent;color:#fff;font-size:24px}
.smart-select-vehicle-panel>.smart-select-search-row,.smart-select-vehicle-panel>.smart-select-help,.smart-select-vehicle-panel>.smart-select-vehicle-head{flex:0 0 auto}
.smart-select-vehicle-panel>.smart-select-options{display:flex;flex-direction:column;gap:4px;min-height:0;padding:8px;overscroll-behavior:contain}
.smart-select-vehicle-panel .smart-select-option{flex:0 0 auto;grid-template-columns:18px minmax(0,1fr) auto;gap:8px;min-height:50px;padding:6px 9px!important;border:1px solid #e3dfd8!important;margin:0}
.smart-select-vehicle-panel .smart-select-check{width:17px;height:17px}
.smart-select-vehicle-title{display:flex;align-items:center;gap:8px;min-width:0}
.smart-select-vehicle-title .smart-select-vehicle-number{display:grid;place-items:center;flex:0 0 auto;min-width:35px;min-height:34px;padding:3px 6px;border-radius:5px;background:#263746;color:#fff;font-size:18px;font-weight:900;line-height:1}
.smart-select-vehicle-title strong{font-size:16px;font-weight:800;color:#243646;overflow-wrap:anywhere}
.smart-select-vehicle-panel .smart-select-option-text strong{white-space:normal;overflow:visible;font-size:16px}
.smart-select-vehicle-panel .smart-select-option-text small{font-size:11px;line-height:1.3;color:#5d584f}
.smart-select-vehicle-panel .smart-select-option-text .smart-select-vehicle-meta{font-size:10px;color:#6b6e72}
.smart-select-vehicle-panel .smart-select-option.selected .smart-select-vehicle-number{background:#bd7100}
.smart-select[data-select-name="vehicle_id"] .smart-select-vehicle-title strong{font-size:14px}
.smart-select[data-select-name="vehicle_id"] .smart-select-vehicle-number{min-width:30px;min-height:28px;font-size:16px}
.smart-select-vehicle-panel .smart-select-empty{grid-column:1/-1}
.smart-select-vehicle-panel .vehicle-free{background:#edf8ef!important;border-color:#a6cfae!important;color:#205b32!important}
.smart-select-vehicle-panel .vehicle-free .smart-select-vehicle-title strong,.smart-select-vehicle-panel .vehicle-free .smart-select-option-text small{color:#205b32}
.smart-select-vehicle-panel .vehicle-free .smart-select-vehicle-number,.smart-select-vehicle-panel .vehicle-free.selected .smart-select-vehicle-number{background:#28763d}
.smart-select-vehicle-panel .vehicle-free em{background:#d0ebd6;color:#205b32}
.smart-select-vehicle-panel .vehicle-free.active,.smart-select-vehicle-panel .vehicle-free.selected,.smart-select-vehicle-panel .vehicle-free:hover{background:#d9efdf!important;box-shadow:inset 0 0 0 1px #28763d}
.smart-select-vehicle-panel .vehicle-unavailable{background:#f5f4f2!important;color:#86827c!important}
.smart-select-vehicle-panel .vehicle-unavailable .smart-select-vehicle-title strong,.smart-select-vehicle-panel .vehicle-unavailable .smart-select-option-text small{color:#86827c}
.smart-select-vehicle-panel .vehicle-unavailable .smart-select-vehicle-number{background:#bab7b2;color:#fff}
.smart-select-vehicle-panel .vehicle-reassignment{background:#fff5df!important;border-color:#e3b867!important;color:#704510!important}
.smart-select-vehicle-panel .vehicle-reassignment .smart-select-vehicle-title strong,.smart-select-vehicle-panel .vehicle-reassignment .smart-select-option-text small{color:#704510}
.smart-select-vehicle-panel .vehicle-reassignment .smart-select-vehicle-number{background:#a96b0a;color:#fff}
.smart-select-vehicle-panel .vehicle-reassignment em{background:#ffe3a9;color:#704510}
.smart-select-vehicle-panel .vehicle-reassignment.active,.smart-select-vehicle-panel .vehicle-reassignment:hover{background:#ffebbd!important;box-shadow:inset 0 0 0 1px #a96b0a}
.smart-select-vehicle-panel .smart-select-option.selected{outline:2px solid #a77425;outline-offset:-2px}

/* Driver colors use the same confirmed whole-period availability as the fleet. */
.smart-select-driver-panel .driver-free{background:#edf8ef!important;border:1px solid #a6cfae!important;color:#205b32!important}
.smart-select-driver-panel .driver-free .smart-select-option-text small{color:#205b32}
.smart-select-driver-panel .driver-free em{background:#d0ebd6;color:#205b32}
.smart-select-driver-panel .driver-free.active,.smart-select-driver-panel .driver-free.selected,.smart-select-driver-panel .driver-free:hover{background:#d9efdf!important;box-shadow:inset 0 0 0 1px #28763d}
.smart-select-driver-panel .driver-free.selected .smart-select-check{border-color:#28763d;background:#28763d}
.smart-select-driver-panel .driver-unavailable{background:#f5f4f2!important;color:#86827c!important}
.smart-select-driver-panel .driver-unavailable .smart-select-option-text small{color:#86827c}
.smart-select-driver-panel .smart-select-option.selected{outline:2px solid #a77425;outline-offset:-2px}
