/* =========================================================
   Dewandaru — FORM SYSTEM (override layer)
   Unify: border, radius, typography, placeholder, focus,
   disabled. Tinggi input TIDAK diubah (memengaruhi layout).
   Hanya Design Token.
   ========================================================= */

/* ---------- BASE: input, select, textarea ---------- */
input.form-control,
select.form-control,
textarea.form-control,
.banner-search .form-control {
  font-family: var(--ab-font-body);
  font-weight: var(--ab-font-body-weight);
  color: var(--ab-text);
  background-color: var(--ab-white);
  border-radius: var(--ab-radius);
  border: 1px solid var(--ab-border);
  transition: border-color var(--ab-transition), box-shadow var(--ab-transition),
    background-color var(--ab-transition);
}

/* banner-search adalah pill putih — biarkan ramping tanpa border dinding,
   cukup separator halus antar field */
.banner-search .form-control {
  border: 0;
  border-radius: 0;
  background-color: transparent;
  font-family: var(--ab-font-body);
  color: var(--ab-text);
}
.banner-search .form-control:hover,
.banner-search .form-control:focus,
.banner-search .form-control.active {
  box-shadow: none !important; /* template: hilangkan ring bootstrap */
}

/* ---------- DROPDOWN (select custom) ---------- */
.drop-menu {
  border-left-color: var(--ab-border);
}
.drop-menu .select {
  color: var(--ab-text);
  font-family: var(--ab-font-body);
}
.drop-menu .select i {
  color: var(--ab-accent);
}
.drop-menu .dropeddown {
  border: 1px solid var(--ab-border);
  border-radius: var(--ab-radius);
  box-shadow: var(--ab-shadow-sm);
}
.drop-menu .dropeddown li:hover {
  color: var(--ab-white);
  background-color: var(--ab-accent);
}

/* ---------- Placeholder ---------- */
.banner-search .form-control::placeholder,
input::placeholder,
textarea::placeholder {
  color: var(--ab-text-muted);
}

/* ---------- FOCUS ---------- */
input:focus,
select:focus,
textarea:focus {
  outline: none;
}
input.form-control:focus,
select.form-control:focus,
textarea.form-control:focus {
  border-color: var(--ab-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ab-accent) 20%, transparent);
}

/* ---------- DISABLED ---------- */
input:disabled,
select:disabled,
textarea:disabled,
.form-control[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  background-color: var(--ab-bg-surface);
}

/* ---------- Item terpilih pada dropdown ---------- */
.selected {
  color: var(--ab-accent) !important; /* template memakai !important — ikuti */
}

/* ---------- Pesan error (validasi) ---------- */
.error {
  background-color: var(--ab-accent);
  outline: 1px solid var(--ab-accent);
}