/* ─────────────────────────────────────────────────────────────────────────────
   DΛREΛKT_ UI ATOM — ui.form
   Version: 2.0.0 | Genesis-Final • BEM-Locked • Token-Driven • Motion-Safe
   File: /tools/modules/ui.form/ui.form.css
   Maintainer: DΛREΛKT_ UI TEAM
   ───────────────────────────────────────────────────────────────────────────── */

@layer ui.form {

  :root {
    --ui-form-gap:         16px;
    --ui-form-gap-field:   12px;

    --ui-form-btn-h:       38px;
    --ui-form-btn-radius:  8px;
    --ui-form-btn-pad-x:   18px;

    --ui-form-btn-fg:      var(--theme-text-inverse, #fff);
    --ui-form-btn-bg:      var(--theme-accent, #005cff);
    --ui-form-btn-hover:   var(--theme-accent-hover, #0047d9);
    --ui-form-btn-focus:   var(--theme-accent-focus, #003bb3);
    --ui-form-btn-disabled: rgba(255,255,255,0.4);

    --ui-form-border:      var(--theme-border, currentColor);
  }

  /* Host Root */
  .ui-form[data-mod="ui_form"] {
    display: grid;
    gap: var(--ui-form-gap);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Fieldset Wrapper */
  .ui-form[data-mod="ui_form"] .ui-form__fields {
    display: grid;
    gap: var(--ui-form-gap-field);
  }

  /* Row (BEM base) */
  .ui-form[data-mod="ui_form"] .ui-form__row {
    display: grid;
    gap: 4px;
  }

  /* Per-field error message */
  .ui-form[data-mod="ui_form"] .ui-form__msg {
    font-size: 0.85em;
    color: var(--theme-error, #ff6060);
    line-height: 1.2;
  }

  /* Global message area */
  .ui-form[data-mod="ui_form"] .ui-form__global-msg {
    font-size: 0.9em;
    color: var(--theme-error, #ff6060);
    padding-top: 4px;
  }

  /* Actions Row */
  .ui-form[data-mod="ui_form"] .ui-form__actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
  }

  /* Submit Button (geometry-locked) */
  .ui-form[data-mod="ui_form"] .ui-form__submit {
    -webkit-appearance: none;
    appearance: none;
    font: inherit;
    line-height: var(--ui-form-btn-h);
    height: var(--ui-form-btn-h);
    padding: 0 var(--ui-form-btn-pad-x);
    border: 1px solid var(--ui-form-border);
    border-radius: var(--ui-form-btn-radius);
    color: var(--ui-form-btn-fg);
    background: var(--ui-form-btn-bg);
    cursor: pointer;
    user-select: none;
    transition: background .2s ease, color .2s ease, opacity .2s ease;
  }

  .ui-form[data-mod="ui_form"] .ui-form__submit:hover {
    background: var(--ui-form-btn-hover);
  }

  .ui-form[data-mod="ui_form"] .ui-form__submit:focus-visible {
    outline: 2px solid var(--ui-form-btn-focus);
    outline-offset: 1px;
  }

  .ui-form[data-mod="ui_form"] .ui-form__submit:active {
    filter: none;
    transform: none;
  }

  .ui-form[data-mod="ui_form"][data-loading="1"] .ui-form__submit,
  .ui-form[data-mod="ui_form"] .ui-form__submit[aria-disabled="true"],
  .ui-form[data-mod="ui_form"] .ui-form__submit:disabled {
    opacity: .6;
    cursor: not-allowed;
    background: var(--ui-form-btn-disabled);
  }

  /* Error state highlight */
  .ui-form[data-mod="ui_form"] .has-error .ui-field__input {
    border-color: var(--theme-error, #ff6060);
  }

  /* Reduced-motion users */
  @media (prefers-reduced-motion: reduce) {
    .ui-form[data-mod="ui_form"] .ui-form__submit {
      transition: none;
    }
  }
}