/* SPARK Fluent inputs - authoritative override */

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.spark-input {
  width: 100% !important;
  height: 32px !important;
  border: 1px solid var(--color-gray-300) !important;
  border-radius: 2px !important;
  background-color: #ffffff !important;
  padding: 0 12px !important;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  color: var(--color-gray-800) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  transition: border-color 150ms, box-shadow 150ms !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"])::placeholder,
.spark-input::placeholder {
  color: var(--color-gray-400) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]):focus,
.spark-input:focus {
  border-color: #1e3a5f !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 1px rgba(30, 58, 95, 0.3) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]):disabled,
.spark-input:disabled {
  cursor: not-allowed !important;
  background-color: var(--color-gray-100) !important;
  color: var(--color-gray-600) !important;
}

body select:not([multiple]):not([size]):not([size="1"]),
body .form-select.form-select,
body .spark-select.spark-select,
body .select-spark.select-spark {
  width: 100% !important;
  height: 32px !important;
  border: 1px solid var(--color-gray-300) !important;
  border-radius: 2px !important;
  background-color: #ffffff !important;
  padding: 0 32px 0 12px !important;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  color: var(--color-gray-800) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e") !important;
  background-size: 1.25em !important;
  background-position: right 0.5rem center !important;
  background-repeat: no-repeat !important;
  transition: border-color 150ms, box-shadow 150ms !important;
}

select:focus,
.form-select:focus,
.spark-select:focus,
.select-spark:focus {
  border-color: #1e3a5f !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 1px rgba(30, 58, 95, 0.3) !important;
}

select:disabled,
.form-select:disabled,
.spark-select:disabled,
.select-spark:disabled {
  cursor: not-allowed !important;
  background-color: var(--color-gray-100) !important;
  color: var(--color-gray-600) !important;
}

/* Keep native list UX for multi-selects while preserving SPARK borders/spacing */
select[multiple],
select[size]:not([size="1"]) {
  background-image: none !important;
  padding-right: 12px !important;
  height: auto !important;
  min-height: 64px !important;
}

/* Normalize date-like controls globally to match dropdown/input visual rules */
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="time"] {
  width: 100% !important;
  height: 32px !important;
  border: 1px solid var(--color-gray-300) !important;
  border-radius: 2px !important;
  background-color: #ffffff !important;
  padding: 0 12px !important;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  color: var(--color-gray-800) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  transition: border-color 150ms, box-shadow 150ms !important;
}

input[type="date"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="time"]:focus {
  border-color: #1e3a5f !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 1px rgba(30, 58, 95, 0.3) !important;
}

input[type="date"]:disabled,
input[type="datetime-local"]:disabled,
input[type="month"]:disabled,
input[type="time"]:disabled {
  cursor: not-allowed !important;
  background-color: var(--color-gray-100) !important;
  color: var(--color-gray-600) !important;
}

textarea,
.spark-textarea {
  width: 100% !important;
  min-height: 64px !important;
  border: 1px solid var(--color-gray-300) !important;
  border-radius: 2px !important;
  background-color: #ffffff !important;
  padding: 8px 12px !important;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  color: var(--color-gray-800) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  resize: vertical !important;
  transition: border-color 150ms, box-shadow 150ms !important;
}

textarea:focus,
.spark-textarea:focus {
  border-color: #1e3a5f !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 1px rgba(30, 58, 95, 0.3) !important;
}

textarea:disabled,
.spark-textarea:disabled {
  cursor: not-allowed !important;
  background-color: var(--color-gray-100) !important;
  color: var(--color-gray-600) !important;
}

/* Global symbol/icon field support (left icon + right symbol/toggle) */
.input-wrapper,
.input-icon,
.price-input-wrapper {
  position: relative;
}

.filter-item--search {
  position: relative;
}

.filter-item--search > i,
.filter-item--search > .filter-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-gray-500);
  font-size: 0.875rem;
  pointer-events: none;
  z-index: 1;
}

.input-wrapper > .input-icon,
.input-icon > i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-gray-500);
  font-size: 0.875rem;
  pointer-events: none;
  z-index: 1;
}

.input-wrapper > input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.input-wrapper > .spark-input,
.filter-item--search > input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.filter-item--search > .spark-input,
.input-icon > i + input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.input-icon > i + .spark-input,
.input-icon > input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.input-icon > .spark-input {
  padding-left: 2.5rem !important;
}

.input-wrapper > input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.input-wrapper > .spark-input {
  padding-right: 2.75rem !important;
}

.price-input-wrapper > input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="reset"]):not([type="hidden"]),
.price-input-wrapper > .spark-input {
  padding-right: 3.25rem !important;
}

/* SPARK Fluent inputs */
.spark-input,
.spark-select,
.spark-textarea {
  width: 100%;
  height: 32px;
  padding: 0 12px;
  font-size: 0.875rem;
  color: #1f2937;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 2px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  box-shadow: none;
}

.spark-input:focus,
.spark-select:focus,
.spark-textarea:focus {
  outline: none;
  border-color: #1e3a5f;
  box-shadow: 0 0 0 1px rgba(30, 58, 95, 0.3);
}

.spark-input::placeholder {
  color: #94a3b8;
}

.spark-textarea {
  height: auto;
  min-height: 64px;
  padding: 8px 12px;
  resize: vertical;
}

.spark-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 32px;
}

.spark-field-label {
  display: block;
  margin-bottom: 0.375rem;
  color: #334155;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.4;
}

.spark-form-control,
.spark-form-control--select,
.spark-form-control--textarea {
  width: 100% !important;
  min-width: 0;
  box-shadow: none !important;
}

.spark-form-control--select {
  appearance: none !important;
}

.spark-form-control--textarea {
  min-height: 64px !important;
}

.spark-form-control--readonly {
  background-color: #f8fafc !important;
  color: #475569 !important;
  cursor: not-allowed !important;
}

/* --------------------------------------------------------------------------
   GLOBAL DROPDOWN FINAL OVERRIDE (matches designrules/spark-fluent-showcase)
   -------------------------------------------------------------------------- */
body select:not([multiple]):not([size]):not([size="1"]),
body .form-select.form-select,
body .spark-select.spark-select,
body .select-spark.select-spark {
  height: 32px !important;
  min-height: 32px !important;
  border: 1px solid #bfc7d1 !important;
  border-radius: 2px !important;
  background-color: #ffffff !important;
  color: #111827 !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  line-height: 1.25rem !important;
  padding: 0 34px 0 12px !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 5.5L7 9l3.5-3.5' fill='none' stroke='%23111827' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 14px 14px !important;
  transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease !important;
}

body select:not([multiple]):not([size]):not([size="1"]):hover,
body .form-select.form-select:hover,
body .spark-select.spark-select:hover,
body .select-spark.select-spark:hover {
  border-color: #9aa7b8 !important;
}

body select:not([multiple]):not([size]):not([size="1"]):focus,
body .form-select.form-select:focus,
body .spark-select.spark-select:focus,
body .select-spark.select-spark:focus {
  border-color: #1e3a5f !important;
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 1px rgba(30, 58, 95, 0.26) !important;
  background-color: #ffffff !important;
}

body select:not([multiple]):not([size]):not([size="1"]):disabled,
body .form-select.form-select:disabled,
body .spark-select.spark-select:disabled,
body .select-spark.select-spark:disabled {
  border-color: #d1d5db !important;
  background-color: #f3f4f6 !important;
  color: #6b7280 !important;
}

/* --------------------------------------------------------------------------
   Chat Input Exemption (keep SPARK chat custom field styling)
   -------------------------------------------------------------------------- */
#spark-chat-widget .spark-chat-input,
.spark-chat-widget .spark-chat-input {
  height: auto !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0.625rem 0.75rem !important;
}

#spark-chat-widget .spark-chat-input:focus,
.spark-chat-widget .spark-chat-input:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}