/* ──────── Inputs / buttons ──────── */

/* input:not([type]) covers server-rendered fields emitted as a bare <input>
   (AdminServlet input()/inputPh() helpers) — a plain <input> has no type
   attribute, so input[type="text"] would miss it. Checkboxes/radios all carry
   an explicit type, so they are unaffected. */
input[type="text"], input[type="search"], input[type="password"], input:not([type]), select {
  font: inherit;
  font-size: 14px;
  color: var(--bfc-ink);
  background: var(--bfc-surface);
  border: 1px solid var(--bfc-line-strong);
  border-radius: 10px;
  padding: 9px 12px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
input:focus, select:focus {
  outline: none;
  border-color: var(--bfc-teal);
  box-shadow: 0 0 0 3px rgba(35, 177, 165, 0.18);
}

/* A native <select> keeps the OS control chrome (square corners, its own
   padding + arrow) even though it shares the input rule above. appearance:none
   lets the shared border-radius/border apply, then we supply a matching chevron
   as an inline SVG data URI (no external asset) and a touch more padding so it
   reads as a slightly roomier sibling of the text inputs. */
select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  padding: 10px 38px 10px 14px;
  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.5 6 6.5 11 1.5' fill='none' stroke='%235d6c7b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 12px 8px;
}
select::-ms-expand { display: none; }

/* Date inputs render their internal edit fields with a browser default face on
   some engines; pin them (and the WebKit edit fields) to the app sans family so
   they match the rest of the app rather than a system serif/mono default. */
input[type="date"],
input[type="date"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit-fields-wrapper {
  font-family: var(--font-sans);
}

.btn {
  font: inherit;
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.005em;
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 9px 16px;
  cursor: pointer;
  transition: transform 0.08s ease, filter 0.15s ease, background 0.12s ease;
}
.btn:active:not([disabled]) { transform: translateY(1px); }
.btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(35, 177, 165, 0.3); }
.btn-primary {
  background: linear-gradient(135deg, var(--bfc-teal), var(--bfc-teal-soft));
  color: #fff;
  box-shadow: 0 8px 18px rgba(35, 177, 165, 0.22);
}
.btn-primary:hover { filter: brightness(1.05); }
.btn-indigo {
  background: linear-gradient(135deg, var(--bfc-indigo), var(--bfc-indigo-dark));
  color: #fff;
}
.btn-ghost {
  background: transparent;
  color: var(--bfc-navy);
  border-color: var(--bfc-line-strong);
}
.btn-ghost:hover { background: var(--bfc-soft); }
.btn[disabled] { opacity: 0.45; cursor: default; }
/* Size + width modifiers (front-door CTAs lean larger than in-app buttons). */
.btn-lg { padding: 13px 18px; font-size: 15px; border-radius: var(--radius-md); }
.btn-block { width: 100%; display: block; }

/* ──────── Alerts / flash messages ──────── */

/* Shared inline status banner — used by the gateway admin (save ok / error)
   and the login error. On-palette with the status tokens so success reads as
   the brand teal rather than a one-off green. */
.alert {
  border-radius: var(--radius-md);
  padding: 12px 14px;
  margin: 0 0 16px;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.45;
}
.alert-ok { background: var(--bfc-success-bg); color: var(--bfc-success-text); border: 1px solid rgba(35, 177, 165, 0.22); }
.alert-err { background: var(--bfc-danger-bg); color: var(--bfc-danger-text); border: 1px solid var(--bfc-danger-line); }
.alert-info { background: rgba(63, 83, 216, 0.08); color: var(--bfc-indigo-dark); border: 1px solid rgba(63, 83, 216, 0.18); }

/* ──────── Search card ──────── */

.search-row {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.search-row input[type="search"] {
  flex: 1 1 320px;
  font-size: 15px;
  padding: 12px 16px;
}
.search-row select { min-width: 150px; }
.search-row input[type="date"] {
  font: inherit;
  font-family: var(--font-sans);
  color: var(--bfc-navy);
  padding: 9px 10px;
  border: 1px solid var(--bfc-line-strong);
  border-radius: 10px;
  background: var(--bfc-surface);
}
.checkline {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--bfc-muted);
  font-weight: 650;
  white-space: nowrap;
}
.staging-filters input[type="search"] { flex-basis: 260px; }