/* Editable surfaces shared by the workbench and its embedded inventory pages.
   This sheet loads last so older page-specific resets cannot hide field borders. */
:is(html[data-surface="staff"], body.warehouse-mobile) {
  --field-search-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364776d' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m15.5 15.5 4.5 4.5'/%3E%3C/svg%3E");
}

:is(html[data-surface="staff"], body.warehouse-mobile, :where(#login-form)) :is(
  input:not([type]), input:is([type="text"],[type="search"],[type="tel"],[type="email"],[type="number"],[type="password"],[type="url"],[type="date"],[type="datetime-local"],[type="time"],[type="month"]),
  textarea, select, .medical-choose-empty, .mobile-picking-choose
):not(:disabled,[readonly],.invalid,[aria-invalid="true"],:is(.mobile-tools-search,.mobile-choice-search,.stock-adjust-quantity,.mobile-picking-quantity,.picking-plan-amount) input) {
  border: 1px solid var(--app-field-border) !important;
  border-radius: 10px !important;
  background-color: var(--app-field-bg) !important;
}
:is(html[data-surface="staff"], body.warehouse-mobile, :where(#login-form)) :is(
  input:not([type]), input:is([type="text"],[type="search"],[type="tel"],[type="email"],[type="number"],[type="password"],[type="url"],[type="date"],[type="datetime-local"],[type="time"],[type="month"]),
  textarea, select, .medical-choose-empty, .mobile-picking-choose
):is(:focus,:focus-visible):not(:disabled,[readonly],.invalid,[aria-invalid="true"],:is(.mobile-tools-search,.mobile-choice-search,.stock-adjust-quantity,.mobile-picking-quantity,.picking-plan-amount) input) {
  border-color: var(--app-field-focus) !important;
  box-shadow: var(--app-field-ring) !important;
  outline: none;
}

:is(html[data-surface="staff"], body.warehouse-mobile, :where(#login-form)) :is(input,textarea)::placeholder {
  color: var(--app-field-placeholder) !important;
  opacity: 1;
}

/* Searches with their own icon and clear button use a single outside edge. */
body.warehouse-mobile :is(.mobile-tools-search,.mobile-choice-search,.picking-plan-amount,.mobile-picking-quantity) {
  border: 1px solid var(--app-field-border) !important;
  background-color: var(--app-field-bg) !important;
}
body.warehouse-mobile :is(.mobile-tools-search,.mobile-choice-search,.stock-adjust-quantity,.picking-plan-amount,.mobile-picking-quantity):focus-within {
  border-color: var(--app-field-focus) !important;
  box-shadow: var(--app-field-ring) !important;
}
body.warehouse-mobile :is(.mobile-tools-search,.mobile-choice-search,.stock-adjust-quantity,.picking-plan-amount,.mobile-picking-quantity) input:focus {
  outline: none;
  box-shadow: none !important;
}

/* Standalone search fields need an icon inside the editable surface. */
html[data-surface="staff"] input[type="search"],
body.warehouse-mobile input[type="search"]:not(:is(.mobile-tools-search,.mobile-choice-search) input) {
  border-radius: var(--app-search-radius) !important;
  background-image: var(--field-search-icon) !important;
  background-repeat: no-repeat;
  background-position: left 11px center;
  background-size: 18px;
  padding-inline-start: 36px !important;
  min-height: 44px;
}
html[data-surface="staff"] .medical-search #medical-search { min-height: 44px; }
html[data-surface="staff"] .medical-search > button { min-height: 44px; }