/* Cyber Armor Systems — Form inputs.  Requires cas-tokens.css.
   Style: filled ground + bottom rule (Option B). The bottom border is a non-text
   element carrying identification, so it needs 3:1 vs the field bg — --cas-input-border
   clears it (light 3.95, dark 6.59). Focus reuses --cas-theme-focus, the same ring
   as buttons and links, so every interactive element focuses identically. */

.cas-input {
  width: 100%;
  padding: 9px 12px;
  font-family: var(--cas-font-body);
  font-size: var(--cas-text-body);
  line-height: 1.4;
  color: var(--cas-theme-text);
  background: var(--cas-input-bg);
  border: 0;
  border-bottom: 2px solid var(--cas-input-border);
  border-radius: var(--cas-radius-sm) var(--cas-radius-sm) 0 0;
  transition: border-color 0.15s ease;
}
.cas-input::placeholder { color: var(--cas-theme-text-body); opacity: 0.75; }

.cas-input:focus,
.cas-input:focus-visible {
  outline: 3px solid var(--cas-theme-focus);
  outline-offset: 2px;
  border-bottom-color: var(--cas-theme-focus);
}

.cas-input:disabled {
  opacity: 0.55;
  cursor: not-allowed;   /* disabled is WCAG-exempt from contrast */
}

/* Label + field grouping helper */
.cas-field { display: block; margin-bottom: var(--cas-space-12); }
.cas-field > label {
  display: block;
  margin-bottom: var(--cas-space-4);
  font: 500 var(--cas-text-caption)/1.4 var(--cas-font-body);
  color: var(--cas-theme-text-body);
}