/*
 * BANKENE ERP - Cadastro inicial
 * Mantém a linguagem visual original do Mofi.
 * Apenas os estados de destaque utilizam o laranja Bankene.
 */

:root {
  --bankene-orange: #ff7a1a;
  --bankene-orange-dark: #e8650a;
  --mofi-sidebar: #2a3650;
  --mofi-sidebar-hover: #34425f;
  --mofi-page-bg: #f5f6fa;
  --mofi-card-border: #e8ebf1;
  --mofi-text: #2f3342;
  --mofi-muted: #7d8494;
}

body.system-auth-body {
  margin: 0;
  overflow-x: hidden;
  background: var(--mofi-page-bg);
  color: var(--mofi-text);
  font-family: "Outfit", sans-serif;
}

/* Estrutura geral */
.mofi-registration.registration-shell {
  display: grid !important;
  grid-template-columns: 250px minmax(0, 1fr) !important;
  min-height: 100vh;
  background: var(--mofi-page-bg) !important;
}

/* Sidebar: azul original do Mofi */
.mofi-registration .registration-aside {
  position: fixed !important;
  inset: 0 auto 0 0 !important;
  z-index: 100 !important;
  width: 250px !important;
  min-height: 100vh !important;
  padding: 24px 14px 18px !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  color: #fff !important;
  background: var(--mofi-sidebar) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

.mofi-registration .registration-aside::before,
.mofi-registration .registration-aside::after {
  display: none !important;
  content: none !important;
}

.mofi-registration .system-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 56px;
  padding: 0 10px 20px !important;
  margin: 0 0 18px;
  color: #fff !important;
  border-bottom: 1px solid rgba(255, 255, 255, .09) !important;
}

.mofi-registration .system-brand .brand-symbol {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px;
  border-radius: 9px !important;
  display: grid;
  place-items: center;
  background: var(--bankene-orange) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.mofi-registration .system-brand strong {
  color: #fff !important;
  font-family: "Outfit", sans-serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  letter-spacing: .5px !important;
}

.mofi-registration .system-brand small {
  color: #aeb7ca !important;
  font-size: .54rem !important;
  font-weight: 600 !important;
  letter-spacing: 1.25px !important;
}

.mofi-registration .setup-menu-title {
  display: inline-flex;
  align-self: flex-start;
  margin: 0 8px 12px !important;
  padding: 5px 9px;
  border-radius: 5px;
  background: rgba(255, 255, 255, .08);
  color: #f1f3f8 !important;
  font-size: .62rem !important;
  font-weight: 700 !important;
  letter-spacing: .75px !important;
}

/* Etapas com comportamento semelhante ao menu do Mofi */
.mofi-registration .wizard-progress {
  position: relative !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.mofi-registration .wizard-progress::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  left: 27px !important;
  top: 27px !important;
  bottom: 28px !important;
  width: 1px !important;
  background: rgba(255, 255, 255, .14) !important;
}

.mofi-registration .wizard-progress li {
  position: relative !important;
  z-index: 1;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 58px;
  margin: 0 0 4px !important;
  padding: 9px 10px !important;
  border: 0 !important;
  border-left: 3px solid transparent !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: #c8ceda !important;
  box-shadow: none !important;
}

.mofi-registration .wizard-progress li.active {
  border-left-color: var(--bankene-orange) !important;
  background: rgba(255, 255, 255, .08) !important;
}

.mofi-registration .wizard-progress li.done {
  background: rgba(255, 255, 255, .035) !important;
}

.mofi-registration .wizard-progress li > span {
  position: relative;
  z-index: 2;
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-radius: 50% !important;
  background: #34415d !important;
  color: #c5ccda !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

.mofi-registration .wizard-progress li.active > span,
.mofi-registration .wizard-progress li.done > span {
  border-color: var(--bankene-orange) !important;
  background: var(--bankene-orange) !important;
  color: #fff !important;
}

.mofi-registration .wizard-progress li strong,
.mofi-registration .wizard-progress li small {
  display: block !important;
}

.mofi-registration .wizard-progress li strong {
  margin: 0;
  color: #e4e8f0 !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
}

.mofi-registration .wizard-progress li small {
  margin-top: 2px !important;
  color: #a6afc0 !important;
  font-size: .62rem !important;
  line-height: 1.3;
}

.mofi-registration .wizard-progress li.active strong {
  color: #fff !important;
}

.mofi-registration .wizard-progress li.done > span {
  font-size: 0 !important;
}

.mofi-registration .wizard-progress li.done > span::after {
  content: "✓";
  font-size: .78rem;
}

.mofi-registration .aside-security {
  position: relative !important;
  z-index: 1;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-top: auto !important;
  padding: 12px !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  border-radius: 7px !important;
  background: rgba(255, 255, 255, .045) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.mofi-registration .aside-security > i {
  color: var(--bankene-orange) !important;
}

.mofi-registration .aside-security strong {
  color: #fff !important;
  font-size: .69rem !important;
}

.mofi-registration .aside-security small {
  display: block;
  margin-top: 3px;
  color: #aeb7ca !important;
  font-size: .59rem !important;
  line-height: 1.4;
}

/* Área principal no desenho original do Mofi */
.mofi-registration .registration-main {
  grid-column: 2 !important;
  min-width: 0 !important;
  min-height: 100vh !important;
  background: var(--mofi-page-bg) !important;
}

.mofi-registration .registration-topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  height: 84px !important;
  padding: 0 30px !important;
  border: 0 !important;
  border-bottom: 1px solid #eceff4 !important;
  background: #fff !important;
  box-shadow: 0 1px 4px rgba(36, 43, 61, .03) !important;
}

.mofi-registration .registration-page-title h1 {
  margin: 0 0 4px !important;
  color: #333744 !important;
  font-family: "Outfit", sans-serif !important;
  font-size: 1.18rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

.mofi-registration .mofi-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #8990a0 !important;
  font-size: .67rem !important;
}

.mofi-registration .mofi-breadcrumb i {
  color: #596174 !important;
}

.mofi-registration .mofi-breadcrumb strong {
  color: var(--bankene-orange) !important;
  font-weight: 600 !important;
}

.mofi-registration .registration-login-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 9px 12px !important;
  border: 1px solid #eceff4 !important;
  border-radius: 7px !important;
  background: #f7f8fb !important;
  color: #565d6e !important;
  font-size: .74rem !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.mofi-registration .registration-login-link i:first-child,
.mofi-registration .registration-login-link:hover {
  color: var(--bankene-orange) !important;
}

.mofi-registration .registration-content {
  min-width: 0 !important;
  padding: 26px 30px 38px !important;
  background: var(--mofi-page-bg) !important;
}

.mofi-registration .registration-content form.mofi-wizard-card {
  display: block !important;
  width: 100% !important;
  max-width: 1160px !important;
  margin: 0 auto !important;
  padding: 25px 27px !important;
  overflow: visible !important;
  border: 1px solid var(--mofi-card-border) !important;
  border-radius: 11px !important;
  background: #fff !important;
  box-shadow: 0 2px 9px rgba(38, 45, 62, .045) !important;
}

.mofi-registration .wizard-panel {
  display: none !important;
  position: relative !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
}

.mofi-registration .wizard-panel.active {
  display: block !important;
}

.mofi-registration .wizard-heading {
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 0 0 22px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid #eef0f4 !important;
  background: transparent !important;
}

.mofi-registration .wizard-heading h2 {
  margin: 4px 0 4px !important;
  color: #303442 !important;
  font-family: "Outfit", sans-serif !important;
  font-size: 1.36rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

.mofi-registration .wizard-heading p {
  margin: 0 !important;
  color: #7f8696 !important;
  font-size: .77rem !important;
  line-height: 1.45 !important;
}

.mofi-registration .step-label {
  color: var(--bankene-orange) !important;
  font-size: .61rem !important;
  font-weight: 700 !important;
  letter-spacing: 1.1px !important;
}

.mofi-registration .wizard-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 7px 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #fff4eb !important;
  color: var(--bankene-orange) !important;
  font-size: .65rem !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

/* Grelha sem scroll interno e sem cortes */
.mofi-registration .business-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

.mofi-registration .business-card {
  position: relative !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 126px !important;
  margin: 0 !important;
  padding: 15px !important;
  overflow: visible !important;
  border: 1px solid #e5e8ef !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--mofi-text) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

.mofi-registration .business-card:hover {
  border-color: rgba(255, 122, 26, .55) !important;
  background: #fff !important;
  box-shadow: 0 4px 14px rgba(42, 48, 65, .07) !important;
}

.mofi-registration .business-card.selected {
  border-color: var(--bankene-orange) !important;
  background: #fff9f5 !important;
  box-shadow: 0 0 0 1px rgba(255, 122, 26, .1) !important;
}

.mofi-registration .business-card input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none;
}

.mofi-registration .business-icon {
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 8px !important;
  background: #f1f3f7 !important;
  color: var(--bankene-orange) !important;
  font-size: 1rem !important;
}

.mofi-registration .business-card.selected .business-icon {
  background: var(--bankene-orange) !important;
  color: #fff !important;
}

.mofi-registration .business-content {
  display: block !important;
  min-width: 0 !important;
  color: var(--mofi-text) !important;
}

.mofi-registration .business-content strong,
.mofi-registration .business-content small,
.mofi-registration .business-content em {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.mofi-registration .business-content strong {
  margin: 0 0 5px !important;
  padding-right: 18px !important;
  color: #303442 !important;
  font-size: .79rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

.mofi-registration .business-content small {
  color: #7d8494 !important;
  font-size: .64rem !important;
  line-height: 1.42 !important;
}

.mofi-registration .business-content em {
  margin-top: 8px !important;
  color: var(--bankene-orange) !important;
  font-size: .57rem !important;
  font-style: normal !important;
  font-weight: 600 !important;
  text-transform: capitalize !important;
}

.mofi-registration .business-check {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  display: none !important;
  place-items: center !important;
  width: 19px !important;
  height: 19px !important;
  border-radius: 50% !important;
  background: var(--bankene-orange) !important;
  color: #fff !important;
  font-size: .61rem !important;
}

.mofi-registration .business-card.selected .business-check {
  display: grid !important;
}

.mofi-registration .form-label {
  color: #434958 !important;
  font-size: .73rem !important;
  font-weight: 600 !important;
}

.mofi-registration .form-control,
.mofi-registration .form-select {
  min-height: 44px !important;
  border: 1px solid #e1e5ec !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #343846 !important;
  font-size: .79rem !important;
  box-shadow: none !important;
}

.mofi-registration .form-control:focus,
.mofi-registration .form-select:focus {
  border-color: var(--bankene-orange) !important;
  box-shadow: 0 0 0 3px rgba(255, 122, 26, .09) !important;
}

.mofi-registration .wizard-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: 24px !important;
  padding-top: 18px !important;
  border-top: 1px solid #eef0f4 !important;
}

.mofi-registration .wizard-actions .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 40px !important;
  padding: .62rem 1rem !important;
  border-radius: 7px !important;
  font-family: "Outfit", sans-serif !important;
  font-size: .72rem !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.mofi-registration .btn-primary {
  border-color: var(--bankene-orange) !important;
  background: var(--bankene-orange) !important;
}

.mofi-registration .btn-primary:hover {
  border-color: var(--bankene-orange-dark) !important;
  background: var(--bankene-orange-dark) !important;
}

.mofi-registration .btn-outline-secondary {
  border-color: #dce1e9 !important;
  background: #fff !important;
  color: #596174 !important;
}

.mofi-registration .step-dots {
  display: flex !important;
  gap: 5px !important;
}

.mofi-registration .step-dots span {
  width: 6px !important;
  height: 6px !important;
  border-radius: 10px !important;
  background: #e2e5ec !important;
}

.mofi-registration .step-dots span.active {
  width: 20px !important;
  background: var(--bankene-orange) !important;
}

@media (max-width: 1100px) {
  .mofi-registration.registration-shell {
    grid-template-columns: 225px minmax(0, 1fr) !important;
  }
  .mofi-registration .registration-aside {
    width: 225px !important;
  }
  .mofi-registration .business-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  .mofi-registration.registration-shell {
    display: block !important;
  }
  .mofi-registration .registration-aside {
    position: relative !important;
    width: 100% !important;
    min-height: auto !important;
    padding: 15px !important;
  }
  .mofi-registration .system-brand {
    margin-bottom: 12px;
    padding-bottom: 14px !important;
  }
  .mofi-registration .setup-menu-title {
    margin-left: 0 !important;
  }
  .mofi-registration .wizard-progress {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  .mofi-registration .wizard-progress::before {
    display: none !important;
  }
  .mofi-registration .wizard-progress li {
    display: block !important;
    min-height: 0;
    padding: 8px 4px !important;
    text-align: center;
    border-left: 0 !important;
    border-bottom: 2px solid transparent !important;
  }
  .mofi-registration .wizard-progress li.active {
    border-bottom-color: var(--bankene-orange) !important;
  }
  .mofi-registration .wizard-progress li > span {
    margin: 0 auto 6px !important;
  }
  .mofi-registration .wizard-progress li small,
  .mofi-registration .aside-security {
    display: none !important;
  }
  .mofi-registration .registration-main {
    grid-column: 1 !important;
  }
  .mofi-registration .registration-topbar {
    position: relative !important;
    height: 72px !important;
    padding: 0 18px !important;
  }
  .mofi-registration .registration-content {
    padding: 16px !important;
  }
  .mofi-registration .registration-content form.mofi-wizard-card {
    padding: 20px !important;
  }
}

@media (max-width: 600px) {
  .mofi-registration .registration-page-title h1 {
    font-size: 1.02rem !important;
  }
  .mofi-registration .mofi-breadcrumb,
  .mofi-registration .registration-login-link span,
  .mofi-registration .wizard-status {
    display: none !important;
  }
  .mofi-registration .business-grid {
    grid-template-columns: 1fr !important;
  }
  .mofi-registration .wizard-heading {
    display: block !important;
  }
  .mofi-registration .wizard-actions .btn {
    flex: 1;
  }
}

/* Bootstrap utility must always win inside the wizard. */
.mofi-registration .wizard-actions .btn.d-none {
  display: none !important;
}