/* custom-select.css
   Reusable select styling that matches the rest of the UI.
*/

.custom-select { position:relative; display:inline-block; width:100%; max-width:420px; font-family:inherit; }

.custom-select select {
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  width:100%; box-sizing:border-box;
  background-color:var(--select-bg); color:var(--select-color);
  border:1px solid var(--select-border); border-radius:var(--select-radius);
  padding:var(--select-padding-y) var(--select-padding-x);
  padding-right: calc(var(--select-padding-x) + 28px);
  font-size:var(--select-font-size); line-height:1.3;
  transition: border-color .12s ease, box-shadow .12s ease, transform .06s ease;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'><path fill='currentColor' d='M0 0l5 6 5-6z'/></svg>");
  background-repeat:no-repeat; background-position: right var(--select-arrow-gap) center; background-size:12px;
}

.custom-select select:focus,
.custom-select select:focus-visible { outline:none; border-color:var(--select-focus-ring); box-shadow:0 0 0 6px var(--select-focus-ring); transform:translateY(-0.2px); }

.custom-select select:disabled,
.custom-select select[aria-disabled="true"] { background-color:var(--select-disabled-bg); color:#9ca3af; cursor:not-allowed; opacity:0.95; }

.custom-select.select-invalid select { border-color:var(--select-invalid-border); box-shadow:0 0 0 6px rgba(217,83,79,0.06); }

.custom-select.small select { --select-font-size:0.875rem; --select-padding-y:0.4rem; --select-padding-x:0.6rem; }
.custom-select.large select { --select-font-size:1.125rem; --select-padding-y:0.9rem; --select-padding-x:1rem; --select-radius:12px; }

.custom-select label { display:block; margin-bottom:0.35rem; font-weight:600; color:var(--select-color); font-size:0.95rem; }
.custom-select.inline { display:inline-block; width:auto; }
.custom-select select::-ms-expand { display:none; }