@import url("askep-lengkap-dark.css");
@import url("askep-lengkap-desktop.css");
@import url("kasus-responsive.css");

/* Dibuat/diperbarui otomatis oleh scripts/sync-page-settings.mjs */

/* Elemen formulir mengikuti warna tema aplikasi. */
:where(input, textarea, select) {
  background-color: var(--card);
  color: var(--text);
  border-color: var(--border);
  caret-color: var(--primary);
}

:where(input, textarea, select)::placeholder {
  color: var(--muted);
  opacity: 1;
}

:where(input, textarea, select):focus {
  border-color: var(--primary);
  outline: 3px solid color-mix(in srgb, var(--primary) 18%, transparent);
}

/* Mencegah browser mempertahankan latar putih pada autofill. */
:where(input, textarea, select):-webkit-autofill,
:where(input, textarea, select):-webkit-autofill:hover,
:where(input, textarea, select):-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text);
  caret-color: var(--text);
  box-shadow: 0 0 0 1000px var(--card) inset;
  transition: background-color 9999s ease-out 0s;
}

/* Perbaikan eksplisit untuk mode gelap. */
html[data-resolved-theme="dark"] :where(
  input,
  textarea,
  select,
  .search-input,
  .search-box input,
  .form-control,
  .input-field,
  .textarea-field
) {
  background: var(--card) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  -webkit-text-fill-color: var(--text);
}

html[data-resolved-theme="dark"] :where(
  input,
  textarea,
  select,
  .search-input,
  .search-box input,
  .form-control,
  .input-field,
  .textarea-field
)::placeholder {
  color: var(--muted) !important;
  opacity: 1;
}

html[data-resolved-theme="dark"] textarea[readonly],
html[data-resolved-theme="dark"] input[readonly],
html[data-resolved-theme="dark"] textarea:disabled,
html[data-resolved-theme="dark"] input:disabled {
  background: color-mix(in srgb, var(--card) 88%, var(--bg)) !important;
  color: var(--text) !important;
  opacity: 1;
}

/* Search cancel button pada browser WebKit. */
html[data-resolved-theme="dark"] input[type="search"]::-webkit-search-cancel-button {
  filter: invert(1);
}
