/**
 * CLERK CSS OVERRIDES - NÃO PASSAR PELO TAILWIND
 * Este arquivo é carregado diretamente via <link> no layout
 * para garantir que não seja purgado pelo Tailwind
 */

/* Forçar layout flex no row de campos (Nome + Sobrenome) */
div.cl-rootBox div.cl-cardBox div.cl-card div.cl-main form.cl-form div.cl-formFieldRow,
div[class*="cl-rootBox"] div[class*="cl-cardBox"] div[class*="cl-card"] div[class*="cl-main"] form[class*="cl-form"] div[class*="cl-formFieldRow"],
.cl-formFieldRow {
  display: flex !important;
  flex-direction: row !important;
  gap: 1.5rem !important;
  width: 100% !important;
  align-items: flex-start !important;
}

/* Cada campo ocupa 50% do espaço */
div.cl-rootBox div.cl-cardBox div.cl-card div.cl-main form.cl-form div.cl-formFieldRow div.cl-formField,
div[class*="cl-rootBox"] div[class*="cl-cardBox"] div[class*="cl-card"] div[class*="cl-main"] form[class*="cl-form"] div[class*="cl-formFieldRow"] div[class*="cl-formField"],
.cl-formFieldRow .cl-formField,
.cl-formField {
  flex: 1 1 50% !important;
  min-width: 0 !important;
  max-width: 50% !important;
}

/* Container do formulário - largura total */
div.cl-rootBox,
div.cl-cardBox,
div.cl-card,
div[class*="cl-rootBox"],
div[class*="cl-cardBox"],
div[class*="cl-card"] {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}