/*
  forms.css — tema visual compartilhado de formularios (wave 1a)
  ================================================================
  Contrato:
  - Carregado no kernel/base.html (cliente, administrativo, auth/site).
  - Escopo: form / .pcs-form / .painel-form + controles Bootstrap padrao.
  - Tokens locais (--form-*) com fallback nos tokens do design system.
  - Sem !important. Sem :has() como dependencia critica. Labels visiveis.
  - Controles mobile: fonte >= 16px; alvo de toque >= 44px.
  - Auth/landing com classes proprias (landing-auth*) nao dependem deste arquivo.
*/

/* ------------------------------------------------------------------
   Tokens do formulario (escopo local; herda do tema global)
   ------------------------------------------------------------------ */
form,
.pcs-form,
.painel-form,
.landing-auth__form,
.landing-auth__box,
.manifestacao-form {
  --form-space-1: var(--space-1, 0.25rem);
  --form-space-2: var(--space-2, 0.5rem);
  --form-space-3: var(--space-3, 0.75rem);
  --form-space-4: var(--space-4, 1rem);
  --form-space-5: var(--space-5, 1.25rem);
  --form-space-6: var(--space-6, 1.5rem);
  --form-space-8: var(--space-8, 2rem);

  --form-radius-sm: var(--radius-sm, 0.375rem);
  --form-radius-md: var(--radius-md, 0.5rem);
  --form-radius-lg: var(--radius-lg, 0.625rem);

  --form-border-color: var(--color-border, var(--border, var(--bs-border-color, #dee2e6)));
  --form-border-hover: var(--color-border-hover, var(--form-border-color));
  --form-border-focus: var(--color-border-focus, var(--ring, var(--primary, #01536b)));
  --form-border-width: 1px;

  --form-surface: var(--color-bg-surface, var(--surface, var(--bs-body-bg, #fff)));
  --form-surface-muted: var(--color-bg-muted, var(--muted, var(--bs-secondary-bg, #f8f9fa)));
  --form-text: var(--color-text-primary, var(--foreground, var(--bs-body-color, #212529)));
  --form-text-muted: var(--color-text-secondary, var(--muted-foreground, var(--bs-secondary-color, #6c757d)));
  --form-text-placeholder: var(--color-text-placeholder, var(--form-text-muted));

  --form-control-bg: var(--form-surface);
  --form-control-fg: var(--form-text);
  --form-control-height: 2.75rem; /* 44px alvo de toque */
  --form-control-padding-y: 0.625rem;
  --form-control-padding-x: 0.875rem;
  --form-control-font-size: 1rem; /* >=16px: evita zoom iOS */
  --form-control-line-height: 1.5;

  --form-focus-ring: var(--focus-ring, var(--ring, rgba(1, 83, 107, 0.35)));
  --form-focus-ring-offset: var(--focus-ring-offset, 2px);

  --form-help-color: var(--form-text-muted);
  --form-error-color: var(--color-danger, var(--destructive, var(--bs-danger, #dc3545)));
  --form-error-bg: var(--color-danger-bg, color-mix(in oklab, var(--form-error-color) 10%, transparent));
  --form-error-border: var(--color-danger-border, var(--form-error-color));

  --form-disabled-opacity: 0.64;
  --form-readonly-bg: var(--form-surface-muted);

  --form-actions-gap: var(--form-space-2);
  --form-field-gap: var(--form-space-3);
  --form-label-gap: var(--form-space-2);
  --form-shell-padding: var(--form-space-8);
  --form-shell-max-width: 57.5rem; /* 920px */
}

/* ------------------------------------------------------------------
   Shell do formulario (card/container de pagina)
   ------------------------------------------------------------------ */
.painel-form,
.pcs-form-shell {
  max-width: var(--form-shell-max-width);
  background: var(--form-surface);
  border: var(--form-border-width) solid var(--form-border-color);
  border-radius: var(--form-radius-lg);
  padding: var(--form-shell-padding);
  box-shadow: var(--shadow-sm, 0 1px 2px 0 rgba(0, 0, 0, 0.05));
  color: var(--form-text);
}

form,
.pcs-form,
.painel-form form,
.landing-auth__form,
.manifestacao-form form,
.manifestacao-form {
  display: block;
  color: var(--form-text);
}

/* ------------------------------------------------------------------
   Fieldset / legenda
   ------------------------------------------------------------------ */
form fieldset,
.pcs-form fieldset,
.painel-form fieldset {
  min-width: 0;
  margin: 0 0 var(--form-space-6);
  padding: 0;
  border: 0;
}

form legend,
.pcs-form legend,
.painel-form legend {
  display: block;
  width: 100%;
  float: left;
  margin: 0 0 var(--form-space-4, 1rem);
  padding: 0 0 var(--form-space-2, 0.5rem);
  font-size: var(--font-size-xs, 0.75rem);
  font-weight: var(--font-weight-semibold, 600);
  letter-spacing: 0.07em;
  text-transform: uppercase;
  line-height: 1.3;
  color: color-mix(in oklab, var(--form-text) 78%, transparent);
  border-bottom: 1px solid var(--form-border-color);
}

/* Clearfix: o float do legend nao vaza para o grid .row seguinte */
form fieldset::after,
.pcs-form fieldset::after,
.painel-form fieldset::after {
  content: "";
  display: table;
  clear: both;
}

/* ------------------------------------------------------------------
   Grupos de campo (Bootstrap / Crispy)
   ------------------------------------------------------------------ */
form .mb-3,
.pcs-form .mb-3,
.painel-form .mb-3,
form .form-group,
.pcs-form .form-group,
.painel-form .form-group {
  margin-bottom: var(--form-field-gap);
}

form .form-label,
.pcs-form .form-label,
.painel-form .form-label,
form label.form-label,
.pcs-form label.form-label,
.painel-form label.form-label {
  display: inline-block;
  margin-bottom: var(--form-label-gap);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--form-text);
}

/* Labels permanecem visiveis — nao colapsar nem sr-only por padrao. */
form label.visually-hidden-skip,
.pcs-form label.visually-hidden-skip,
.painel-form label.visually-hidden-skip {
  position: static;
  width: auto;
  height: auto;
  margin: 0 0 var(--form-label-gap);
  overflow: visible;
  clip: auto;
}

/* ------------------------------------------------------------------
   Controles de texto, select e textarea
   ------------------------------------------------------------------ */
form .form-control,
.pcs-form .form-control,
.painel-form .form-control,
form .form-select,
.pcs-form .form-select,
.painel-form .form-select {
  display: block;
  width: 100%;
  min-height: var(--form-control-height);
  padding: var(--form-control-padding-y) var(--form-control-padding-x);
  font-size: var(--form-control-font-size);
  font-weight: 400;
  line-height: var(--form-control-line-height);
  color: var(--form-control-fg);
  background-color: var(--form-control-bg);
  background-clip: padding-box;
  border: var(--form-border-width) solid var(--form-border-color);
  border-radius: var(--form-radius-md);
  transition:
    border-color var(--transition-fast, 150ms ease),
    box-shadow var(--transition-fast, 150ms ease),
    background-color var(--transition-fast, 150ms ease);
}

form textarea.form-control,
.pcs-form textarea.form-control,
.painel-form textarea.form-control {
  min-height: 7.5rem;
  resize: vertical;
}

form .form-control::placeholder,
.pcs-form .form-control::placeholder,
.painel-form .form-control::placeholder {
  color: var(--form-text-placeholder);
  opacity: 1;
}

form .form-control:hover:not(:disabled):not([readonly]),
.pcs-form .form-control:hover:not(:disabled):not([readonly]),
.painel-form .form-control:hover:not(:disabled):not([readonly]),
form .form-select:hover:not(:disabled),
.pcs-form .form-select:hover:not(:disabled),
.painel-form .form-select:hover:not(:disabled) {
  border-color: var(--form-border-hover);
}

form .form-control:focus,
.pcs-form .form-control:focus,
.painel-form .form-control:focus,
form .form-select:focus,
.pcs-form .form-select:focus,
.painel-form .form-select:focus,
form .form-control:focus-visible,
.pcs-form .form-control:focus-visible,
.painel-form .form-control:focus-visible,
form .form-select:focus-visible,
.pcs-form .form-select:focus-visible,
.painel-form .form-select:focus-visible {
  color: var(--form-control-fg);
  background-color: var(--form-control-bg);
  border-color: var(--form-border-focus);
  outline: var(--form-focus-ring-offset) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset) var(--form-focus-ring);
}

/* ------------------------------------------------------------------
   Readonly / disabled
   ------------------------------------------------------------------ */
form .form-control:disabled,
.pcs-form .form-control:disabled,
.painel-form .form-control:disabled,
form .form-select:disabled,
.pcs-form .form-select:disabled,
.painel-form .form-select:disabled,
form .form-check-input:disabled,
.pcs-form .form-check-input:disabled,
.painel-form .form-check-input:disabled,
form .form-control[disabled],
.pcs-form .form-control[disabled],
.painel-form .form-control[disabled],
form .form-select[disabled],
.pcs-form .form-select[disabled],
.painel-form .form-select[disabled] {
  opacity: var(--form-disabled-opacity);
  cursor: not-allowed;
}

form .form-control[readonly],
.pcs-form .form-control[readonly],
.painel-form .form-control[readonly] {
  background-color: var(--form-readonly-bg);
  opacity: 1;
  cursor: default;
}

/* ------------------------------------------------------------------
   Help e erro
   ------------------------------------------------------------------ */
form .form-text,
.pcs-form .form-text,
.painel-form .form-text,
form .help-block,
.pcs-form .help-block,
.painel-form .help-block {
  display: block;
  margin-top: var(--form-space-1);
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--form-help-color);
}

form .invalid-feedback,
.pcs-form .invalid-feedback,
.painel-form .invalid-feedback,
form .errorlist,
.pcs-form .errorlist,
.painel-form .errorlist {
  display: block;
  margin-top: var(--form-space-1);
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--form-error-color);
}

form .errorlist,
.pcs-form .errorlist,
.painel-form .errorlist {
  padding-left: 1.1rem;
  margin-bottom: 0;
}

form .form-control.is-invalid,
.pcs-form .form-control.is-invalid,
.painel-form .form-control.is-invalid,
form .form-select.is-invalid,
.pcs-form .form-select.is-invalid,
.painel-form .form-select.is-invalid {
  border-color: var(--form-error-border);
  background-color: color-mix(in oklab, var(--form-error-bg) 55%, var(--form-control-bg));
}

form .form-control.is-invalid:focus,
.pcs-form .form-control.is-invalid:focus,
.painel-form .form-control.is-invalid:focus,
form .form-select.is-invalid:focus,
.pcs-form .form-select.is-invalid:focus,
.painel-form .form-select.is-invalid:focus,
form .form-control.is-invalid:focus-visible,
.pcs-form .form-control.is-invalid:focus-visible,
.painel-form .form-control.is-invalid:focus-visible,
form .form-select.is-invalid:focus-visible,
.pcs-form .form-select.is-invalid:focus-visible,
.painel-form .form-select.is-invalid:focus-visible {
  border-color: var(--form-error-border);
  box-shadow: 0 0 0 var(--form-focus-ring-offset)
    color-mix(in oklab, var(--form-error-color) 35%, transparent);
}

/* ------------------------------------------------------------------
   Checkbox / radio
   ------------------------------------------------------------------ */
form .form-check,
.pcs-form .form-check,
.painel-form .form-check {
  display: flex;
  align-items: flex-start;
  gap: var(--form-space-2);
  min-height: var(--form-control-height);
  padding: var(--form-space-2) 0;
  margin-bottom: var(--form-space-2);
}

form .form-check-input,
.pcs-form .form-check-input,
.painel-form .form-check-input {
  width: 1.15rem;
  height: 1.15rem;
  margin-top: 0.2rem;
  flex-shrink: 0;
  border: var(--form-border-width) solid var(--form-border-color);
  background-color: var(--form-control-bg);
}

form .form-check-input:focus,
.pcs-form .form-check-input:focus,
.painel-form .form-check-input:focus,
form .form-check-input:focus-visible,
.pcs-form .form-check-input:focus-visible,
.painel-form .form-check-input:focus-visible {
  border-color: var(--form-border-focus);
  outline: var(--form-focus-ring-offset) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset) var(--form-focus-ring);
}

form .form-check-label,
.pcs-form .form-check-label,
.painel-form .form-check-label {
  font-size: var(--form-control-font-size);
  line-height: 1.4;
  color: var(--form-text);
}

/* ------------------------------------------------------------------
   Input group e file
   ------------------------------------------------------------------ */
form .input-group,
.pcs-form .input-group,
.painel-form .input-group {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  width: 100%;
  gap: 0;
}

form .input-group .form-control,
.pcs-form .input-group .form-control,
.painel-form .input-group .form-control,
form .input-group .form-select,
.pcs-form .input-group .form-select,
.painel-form .input-group .form-select {
  position: relative;
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
}

form .input-group-text,
.pcs-form .input-group-text,
.painel-form .input-group-text {
  display: flex;
  align-items: center;
  padding: var(--form-control-padding-y) var(--form-control-padding-x);
  font-size: var(--form-control-font-size);
  font-weight: 500;
  line-height: var(--form-control-line-height);
  color: var(--form-text-muted);
  background-color: var(--form-surface-muted);
  border: var(--form-border-width) solid var(--form-border-color);
  border-radius: var(--form-radius-md);
}

form input[type="file"].form-control,
.pcs-form input[type="file"].form-control,
.painel-form input[type="file"].form-control {
  padding: 0.5rem var(--form-control-padding-x);
  line-height: 1.5;
}

form input[type="file"].form-control::file-selector-button,
.pcs-form input[type="file"].form-control::file-selector-button,
.painel-form input[type="file"].form-control::file-selector-button {
  margin-inline-end: var(--form-space-3);
  padding: 0.45rem 0.85rem;
  color: var(--form-text);
  background-color: var(--form-surface-muted);
  border: 0;
  border-inline-end: var(--form-border-width) solid var(--form-border-color);
  border-radius: 0;
}

/* ------------------------------------------------------------------
   Acoes do formulario
   ------------------------------------------------------------------ */
.form-actions,
.pcs-form__actions,
form .form-actions,
form .pcs-form__actions,
.pcs-form .form-actions,
.pcs-form .pcs-form__actions,
.painel-form .form-actions,
.painel-form .pcs-form__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--form-actions-gap);
  margin-top: var(--form-space-6);
  padding-top: var(--form-space-4);
  border-top: var(--form-border-width) solid var(--form-border-color);
}

.form-actions-end,
.pcs-form__actions-end {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--form-actions-gap);
  margin-left: auto;
}

.form-actions .btn,
.pcs-form__actions .btn,
.form-actions-end .btn,
.pcs-form__actions-end .btn,
.painel-form .form-actions .btn,
.painel-form .pcs-form__actions .btn {
  min-height: var(--form-control-height);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--form-space-2);
  padding-inline: var(--form-space-4);
  border-radius: var(--form-radius-md);
}

.pcs-form .pcs-form__inline-btn {
  min-height: var(--form-control-height);
  min-width: var(--form-control-height);
  height: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-inline: calc(var(--form-control-padding-x) - 0.25rem);
}

.form-actions .btn:focus-visible,
.pcs-form__actions .btn:focus-visible,
.form-actions-end .btn:focus-visible,
.pcs-form__actions-end .btn:focus-visible {
  outline: var(--form-focus-ring-offset) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset) var(--form-focus-ring);
}

/* ------------------------------------------------------------------
   Linhas Crispy (row/col) — so espaco, sem layout de grid novo
   ------------------------------------------------------------------ */
form .row,
.pcs-form .row,
.painel-form .row {
  --bs-gutter-x: var(--form-space-4);
  --bs-gutter-y: var(--form-space-3);
}

/* ------------------------------------------------------------------
   Mobile / touch
   ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
  .painel-form,
  .pcs-form-shell {
    padding: var(--form-space-4);
    border-radius: var(--form-radius-lg);
  }

  form .form-control,
  .pcs-form .form-control,
  .painel-form .form-control,
  form .form-select,
  .pcs-form .form-select,
  .painel-form .form-select,
  form .form-check-label,
  .pcs-form .form-check-label,
  .painel-form .form-check-label {
    font-size: 1rem; /* trava >=16px no mobile */
  }

  form .form-control,
  .pcs-form .form-control,
  .painel-form .form-control,
  form .form-select,
  .pcs-form .form-select,
  .painel-form .form-select,
  .form-actions .btn,
  .pcs-form__actions .btn,
  .form-actions-end .btn,
  .pcs-form__actions-end .btn {
    min-height: 2.75rem; /* 44px */
  }

  .form-actions,
  .pcs-form__actions,
  form .form-actions,
  form .pcs-form__actions,
  .pcs-form .form-actions,
  .pcs-form .pcs-form__actions,
  .painel-form .form-actions,
  .painel-form .pcs-form__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .form-actions-end,
  .pcs-form__actions-end {
    width: 100%;
    margin-left: 0;
  }

  .form-actions .btn,
  .pcs-form__actions .btn,
  .form-actions-end .btn,
  .pcs-form__actions-end .btn {
    width: 100%;
  }
}

/* ------------------------------------------------------------------
   Dark theme — alinha com tokens Bootstrap/tema quando presentes
   ------------------------------------------------------------------ */
[data-bs-theme="dark"] form,
[data-bs-theme="dark"] .pcs-form,
[data-bs-theme="dark"] .painel-form,
[data-bs-theme="dark"] .landing-auth__form,
[data-bs-theme="dark"] .landing-auth__box,
[data-bs-theme="dark"] .manifestacao-form {
  --form-surface: var(--color-bg-surface, var(--surface, var(--bs-body-bg, #1a1d21)));
  --form-surface-muted: var(--color-bg-muted, var(--muted, var(--bs-secondary-bg, #2b3035)));
  --form-text: var(--color-text-primary, var(--foreground, var(--bs-body-color, #e9ecef)));
  --form-text-muted: var(--color-text-secondary, var(--muted-foreground, var(--bs-secondary-color, #adb5bd)));
  --form-border-color: var(--color-border, var(--border, var(--bs-border-color, #495057)));
  --form-control-bg: var(--form-surface);
  --form-control-fg: var(--form-text);
  --form-readonly-bg: var(--form-surface-muted);
}


/* ------------------------------------------------------------------
   Auth / publico — composicao com landing-auth* e manifestacao
   ------------------------------------------------------------------
   Nao substitui autenticacao.css / landing.css. Harmoniza labels,
   controles, erros, foco, disabled e alvo de toque via --form-*.
   ------------------------------------------------------------------ */

.landing-auth__form.pcs-form,
.manifestacao-form.pcs-form,
.landing-auth__form,
.manifestacao-form {
  width: 100%;
}

.landing-auth__field,
.manifestacao-form__field {
  display: flex;
  flex-direction: column;
  gap: var(--form-label-gap, 0.5rem);
  margin-bottom: 0;
}

.landing-auth__label,
.landing-auth__label.form-label,
.manifestacao-form__field > label,
.manifestacao-form__field > label.form-label {
  display: inline-block;
  margin-bottom: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--form-text, var(--foreground, #212529));
}

/* Controles bare (allauth) e manuais no contrato auth/publico */
.landing-auth__field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
.landing-auth__field select,
.landing-auth__field textarea,
.landing-auth__select,
.manifestacao-form__field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
.manifestacao-form__field select,
.manifestacao-form__field textarea {
  display: block;
  width: 100%;
  min-height: var(--form-control-height, 2.75rem);
  padding: var(--form-control-padding-y, 0.625rem) var(--form-control-padding-x, 0.875rem);
  font-size: var(--form-control-font-size, 1rem);
  font-weight: 400;
  line-height: var(--form-control-line-height, 1.5);
  color: var(--form-control-fg, var(--form-text, #212529));
  background-color: var(--form-control-bg, var(--form-surface, #fff));
  background-clip: padding-box;
  border: var(--form-border-width, 1px) solid var(--form-border-color, #dee2e6);
  border-radius: var(--form-radius-md, 0.5rem);
  transition:
    border-color var(--transition-fast, 150ms ease),
    box-shadow var(--transition-fast, 150ms ease),
    background-color var(--transition-fast, 150ms ease);
}

.landing-auth__field textarea,
.manifestacao-form__field textarea {
  min-height: 7.5rem;
  resize: vertical;
}

.landing-auth__field input::placeholder,
.manifestacao-form__field input::placeholder,
.manifestacao-form__field textarea::placeholder {
  color: var(--form-text-placeholder, var(--form-text-muted, #6c757d));
  opacity: 1;
}

.landing-auth__field input:hover:not(:disabled):not([readonly]),
.landing-auth__field select:hover:not(:disabled),
.landing-auth__field textarea:hover:not(:disabled):not([readonly]),
.landing-auth__select:hover:not(:disabled),
.manifestacao-form__field input:hover:not(:disabled):not([readonly]),
.manifestacao-form__field select:hover:not(:disabled),
.manifestacao-form__field textarea:hover:not(:disabled):not([readonly]) {
  border-color: var(--form-border-hover, var(--form-border-color, #dee2e6));
}

.landing-auth__field input:focus,
.landing-auth__field input:focus-visible,
.landing-auth__field select:focus,
.landing-auth__field select:focus-visible,
.landing-auth__field textarea:focus,
.landing-auth__field textarea:focus-visible,
.landing-auth__select:focus,
.landing-auth__select:focus-visible,
.manifestacao-form__field input:focus,
.manifestacao-form__field input:focus-visible,
.manifestacao-form__field select:focus,
.manifestacao-form__field select:focus-visible,
.manifestacao-form__field textarea:focus,
.manifestacao-form__field textarea:focus-visible {
  color: var(--form-control-fg, var(--form-text, #212529));
  background-color: var(--form-control-bg, var(--form-surface, #fff));
  border-color: var(--form-border-focus, var(--primary, #01536b));
  outline: var(--form-focus-ring-offset, 2px) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset, 2px) var(--form-focus-ring, rgba(1, 83, 107, 0.35));
}

.landing-auth__field input:disabled,
.landing-auth__field select:disabled,
.landing-auth__field textarea:disabled,
.landing-auth__select:disabled,
.manifestacao-form__field input:disabled,
.manifestacao-form__field select:disabled,
.manifestacao-form__field textarea:disabled {
  opacity: var(--form-disabled-opacity, 0.64);
  cursor: not-allowed;
}

.landing-auth__field input[readonly],
.manifestacao-form__field input[readonly],
.manifestacao-form__field textarea[readonly] {
  background-color: var(--form-readonly-bg, var(--form-surface-muted, #f8f9fa));
  opacity: 1;
  cursor: default;
}

.landing-auth__field-error,
.landing-auth__field-error.invalid-feedback,
.landing-auth__field-error.form-text,
.manifestacao-form__errors,
.manifestacao-form__errors.invalid-feedback {
  display: block;
  margin-top: var(--form-space-1, 0.25rem);
  font-size: 0.875rem;
  line-height: 1.4;
  color: var(--form-error-color, #dc3545);
  list-style: none;
  padding: 0;
}

.landing-auth__field-error.form-text,
.manifestacao-form__field .form-text {
  color: var(--form-help-color, var(--form-text-muted, #6c757d));
}

.landing-auth__error,
.manifestacao-form .alert-danger {
  display: block;
  margin-bottom: var(--form-space-4, 1rem);
  padding: 0.75rem 1rem;
  border: var(--form-border-width, 1px) solid var(--form-error-border, var(--form-error-color, #dc3545));
  border-radius: var(--form-radius-md, 0.5rem);
  background: var(--form-error-bg, rgba(220, 53, 69, 0.1));
  color: var(--form-error-color, #dc3545);
  font-size: 0.875rem;
  line-height: 1.4;
}

.manifestacao-form .alert-success {
  display: block;
  margin-bottom: var(--form-space-4, 1rem);
  padding: 0.75rem 1rem;
  border-radius: var(--form-radius-md, 0.5rem);
  background: color-mix(in oklab, var(--color-success, #198754) 12%, transparent);
  color: var(--color-success, #0f5132);
  font-size: 0.875rem;
  line-height: 1.4;
}

.landing-auth__btn,
.manifestacao-form__submit {
  min-height: var(--form-control-height, 2.75rem);
}

.landing-auth__btn:focus-visible,
.manifestacao-form__submit:focus-visible {
  outline: var(--form-focus-ring-offset, 2px) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset, 2px) var(--form-focus-ring, rgba(1, 83, 107, 0.35));
}

/* Checkbox / consentimento publico */
.landing-auth__checkbox,
.manifestacao-form__consent {
  display: flex;
  align-items: flex-start;
  gap: var(--form-space-2, 0.5rem);
}

.landing-auth__checkbox input[type="checkbox"],
.manifestacao-form__consent input[type="checkbox"] {
  width: 1.125rem;
  height: 1.125rem;
  min-height: 1.125rem;
  margin-top: 0.2rem;
  flex-shrink: 0;
}

.landing-auth__checkbox input[type="checkbox"]:focus-visible,
.manifestacao-form__consent input[type="checkbox"]:focus-visible {
  outline: var(--form-focus-ring-offset, 2px) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset, 2px) var(--form-focus-ring, rgba(1, 83, 107, 0.35));
}

/* Honeypot: fora da tela, sem display:none (bots ainda veem o campo) */
.manifestacao-form__honeypot,
.pcs-form__honeypot {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Layout especifico do canal publico de manifestacoes */
.manifestacao-form {
  max-width: 45rem; /* 720px */
  margin: 0 auto;
  padding: var(--form-space-8, 2rem) var(--form-space-4, 1rem);
  background: transparent;
  border: 0;
  box-shadow: none;
}

.manifestacao-form__title {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 var(--form-space-2, 0.5rem);
  color: var(--form-text, #212529);
}

.manifestacao-form__intro {
  margin: 0 0 var(--form-space-6, 1.5rem);
  color: var(--form-text-muted, #6c757d);
  line-height: 1.6;
}

.manifestacao-form__field {
  margin-bottom: var(--form-field-gap, 0.75rem);
}

.manifestacao-form__actions {
  margin-top: var(--form-space-6, 1.5rem);
  display: flex;
  flex-wrap: wrap;
  gap: var(--form-actions-gap, 0.5rem);
  align-items: center;
}

.manifestacao-form__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--form-space-2, 0.5rem);
  padding: 0.7rem 1.5rem;
  border: none;
  border-radius: var(--form-radius-md, 0.5rem);
  background: var(--secondary, #011f3b);
  color: var(--secondary-foreground, #f5f5f7);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--transition-fast, 150ms ease);
}

.manifestacao-form__submit:hover,
.manifestacao-form__submit:focus {
  background: var(--primary, #01536b);
  color: var(--primary-foreground, #ffffff);
}

.manifestacao-indisponivel {
  max-width: 40rem;
  margin: 0 auto;
  padding: 3rem 1rem;
  text-align: center;
  color: var(--form-text, #212529);
}

.manifestacao-indisponivel__icon {
  font-size: 3.5rem;
  color: var(--form-text-muted, #6c757d);
  margin-bottom: 1rem;
}

.manifestacao-indisponivel__title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.manifestacao-indisponivel__text {
  color: var(--form-text-muted, #555);
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.manifestacao-indisponivel__link {
  color: var(--primary, #01536b);
  text-decoration: none;
  font-weight: 600;
}

.manifestacao-indisponivel__link:hover,
.manifestacao-indisponivel__link:focus {
  text-decoration: underline;
}

@media (max-width: 767.98px) {
  .landing-auth__field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .landing-auth__field select,
  .landing-auth__field textarea,
  .landing-auth__select,
  .landing-auth__btn,
  .manifestacao-form__field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .manifestacao-form__field select,
  .manifestacao-form__field textarea,
  .manifestacao-form__submit,
  .manifestacao-form__field > label,
  .landing-auth__label {
    font-size: 1rem;
  }

  .landing-auth__field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .landing-auth__field select,
  .landing-auth__select,
  .landing-auth__btn,
  .manifestacao-form__field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .manifestacao-form__field select,
  .manifestacao-form__submit {
    min-height: 2.75rem;
  }

  .landing-auth__btn,
  .manifestacao-form__submit {
    width: 100%;
  }

  .manifestacao-form {
    padding: var(--form-space-6, 1.5rem) var(--form-space-4, 1rem);
  }
}

/* ------------------------------------------------------------------
   Variantes fora do shell CRUD
   ------------------------------------------------------------------
   Confirmacao destrutiva, filtro GET e action-only reutilizam tokens
   --form-* sem forcar .pcs-form-shell / card de cadastro.
   ------------------------------------------------------------------ */

/* Confirmacao destrutiva (pagina classica BaseDeleteView + modal) */
.pcs-form--confirm {
  max-width: 36rem;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.pcs-form--confirm + .pcs-form__actions,
.pcs-form--confirm .pcs-form__actions,
.pcs-form__actions--confirm {
  justify-content: space-between;
  margin-top: var(--form-space-4);
  padding-top: var(--form-space-3);
  border-top: var(--form-border-width) solid var(--form-border-color);
}

.pcs-form__actions--confirm .btn-danger:focus-visible {
  outline: var(--form-focus-ring-offset) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset)
    color-mix(in oklab, var(--form-error-color) 35%, transparent);
}

.pcs-form__confirm-alert,
.alert.pcs-form__confirm-alert {
  margin-bottom: var(--form-space-4);
}

/* Filtro GET compacto (barra de listagem; nao vira card de cadastro) */
.pcs-form--filter,
form.pcs-form--filter,
.painel-filtros.pcs-form--filter,
.painel-filtros .pcs-form--filter {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--form-space-2) var(--form-space-3);
  max-width: none;
  margin: 0 0 var(--form-space-3);
  padding: var(--form-space-3);
  background: var(--form-surface-muted, var(--bs-tertiary-bg, #f8f9fa));
  border: var(--form-border-width) solid var(--form-border-color);
  border-radius: var(--form-radius-md);
  box-shadow: none;
}

/* Wrapper legado .painel-filtros sem a classe nova ainda herda o visual. */
.painel-filtros:not(.pcs-form--filter) {
  padding: var(--form-space-3);
  background: var(--form-surface-muted, var(--bs-tertiary-bg, #f8f9fa));
  border: var(--form-border-width) solid var(--form-border-color);
  border-radius: var(--form-radius-md);
}

.pcs-form--filter.row,
.painel-filtros.pcs-form--filter.row {
  display: flex;
  --bs-gutter-x: var(--form-space-3);
  --bs-gutter-y: var(--form-space-2);
}

.pcs-form--filter .form-label,
.painel-filtros .form-label {
  margin-bottom: var(--form-space-1);
  font-size: 0.8125rem;
  font-weight: 600;
}

.pcs-form--filter .form-control,
.pcs-form--filter .form-select,
.painel-filtros .form-control,
.painel-filtros .form-select {
  min-height: 2.375rem;
  padding: 0.375rem 0.625rem;
  font-size: 0.9375rem;
}

.pcs-form--filter .btn,
.painel-filtros .btn {
  min-height: 2.375rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--form-space-2);
}

.pcs-form--filter .pcs-form__actions,
.pcs-form--filter .form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--form-space-2);
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  width: 100%;
}

/* Action-only (POST/HTMX pontual com botao real; sem chrome de cadastro) */
.pcs-form--action {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--form-space-2);
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.pcs-form--action.d-inline,
.pcs-form--action.d-inline-flex {
  display: inline-flex;
}

.pcs-form--action .btn {
  min-height: 2.375rem;
}

.pcs-form--action .btn:focus-visible {
  outline: var(--form-focus-ring-offset) solid transparent;
  box-shadow: 0 0 0 var(--form-focus-ring-offset) var(--form-focus-ring);
}

/* Action empilhada quando o dono e um bloco (nao botao de linha) */
.pcs-form--action.pcs-form--action-block {
  display: flex;
  width: 100%;
}

@media (max-width: 767.98px) {
  .pcs-form--filter,
  form.pcs-form--filter,
  .painel-filtros.pcs-form--filter,
  .painel-filtros .pcs-form--filter {
    align-items: stretch;
  }

  .pcs-form--filter .form-control,
  .pcs-form--filter .form-select,
  .pcs-form--filter .btn,
  .painel-filtros .form-control,
  .painel-filtros .form-select,
  .painel-filtros .btn {
    min-height: 2.75rem;
    font-size: 1rem;
  }

  .pcs-form--filter .btn,
  .painel-filtros .btn {
    width: 100%;
  }

  .pcs-form__actions--confirm {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .pcs-form__actions--confirm .pcs-form__actions-end,
  .pcs-form__actions--confirm .btn {
    width: 100%;
    margin-left: 0;
  }
}

/* ------------------------------------------------------------------
   Progresso da geracao de instrucao por IA (barra + estagio)
   Markup criado via JS dentro de #div_id_arquivo (variacao_form).
   ------------------------------------------------------------------ */
.pcs-form__progresso {
  --form-progresso-altura: 0.375rem; /* ~6px */
}

.pcs-form__progresso .progress {
  height: var(--form-progresso-altura);
  border-radius: 50rem; /* pill */
  background-color: var(--form-surface-muted);
}

.pcs-form__progresso .progress-bar {
  transition: width 0.4s ease;
}

.pcs-form__progresso .pcs-form__progresso-estagio {
  margin-top: var(--form-space-1);
  color: var(--form-text-muted);
}

@media (prefers-reduced-motion: reduce) {
  .pcs-form__progresso .progress-bar {
    transition: none;
  }

  .pcs-form__progresso .progress-bar-striped {
    background-image: none;
  }
}