/* ==========================================================================
   NSRL COMPAT — same look in Chrome/Edge (Blink), Firefox (Gecko), Safari (WebKit)
   Path: assets/common/css/foundation/compat.css

   1. Native extras each engine adds to fields (Edge eye, search ×, iOS shading)
   2. Drop-downs: one arrow everywhere instead of each browser's own
   3. Autofill colour in Firefox
   ========================================================================== */

/* 1. NATIVE FIELD EXTRAS -------------------------------------------------- */

/* Edge draws its own show-password eye (and a clear ×) next to ours */
input::-ms-reveal,
input::-ms-clear {
  display: none;
}

/* Safari rounds search boxes; Chrome and Safari add a × that Firefox lacks.
   Escape still clears every search box (search-behavior.js). */
.nsrl-org-manage__search,
.nsrl-rsv .rsv-search,
input[type="search"].nsrl-input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.nsrl-org-manage__search::-webkit-search-decoration,
.nsrl-org-manage__search::-webkit-search-cancel-button,
.nsrl-rsv .rsv-search::-webkit-search-decoration,
.nsrl-rsv .rsv-search::-webkit-search-cancel-button,
input[type="search"].nsrl-input::-webkit-search-decoration,
input[type="search"].nsrl-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

/* iOS Safari adds an inner shadow and its own rounding to text fields */
input.nsrl-input:not([type="checkbox"]):not([type="radio"]):not([type="date"]):not([type="time"]):not([type="datetime-local"]),
textarea.nsrl-input,
#nsrl-signin .um-form input[type="text"],
#nsrl-signin .um-form input[type="email"],
#nsrl-signin .um-form input[type="password"],
#sign-in-left-subcontainer .um-form input[type="text"],
#sign-in-left-subcontainer .um-form input[type="email"],
#sign-in-left-subcontainer .um-form input[type="password"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* 2. DROP-DOWNS ----------------------------------------------------------- */
select.nsrl-input:not([multiple]):not([size]),
.nsrl-users-field select:not([multiple]),
.nsrl-schedule-admin .sched-form select:not([multiple]),
.nsrl-schedule-admin .sched-select:not([multiple]),
#nsrl-add-user-modal select:not([multiple]),
#nsrl-add-staff-modal select:not([multiple]) {
  -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='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2364748b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 12px 8px !important;
  padding-right: 38px !important;
  text-overflow: ellipsis;
  cursor: pointer;
}
select.nsrl-input::-ms-expand {
  display: none;
}
/* Compact selects inside the billing table */
#nsrl-bm table.nsrl-data-table td select.nsrl-input:not([multiple]) {
  background-position: right 6px center !important;
  background-size: 10px 7px !important;
  padding-right: 22px !important;
}
/* 3. AUTOFILL (Firefox) ----------------------------------------------------
   validation.css covers Chrome/Safari with :-webkit-autofill. Firefox paints its
   own yellow fill; the inset shadow covers it. Kept in a separate rule so
   browsers that don't know :autofill still read the rest of this file. */
.nsrl-input:autofill {
  filter: none;
  box-shadow: 0 0 0 1000px var(--nsrl-v-field, #f1f3f4) inset !important;
}
.nsrl-input:autofill:focus {
  box-shadow: 0 0 0 1000px #fff inset !important;
}