/* Nexo Diário — Item 30 — Interface responsiva V5.1
   Correção do dimensionamento do menu — 09/08/2026
   Camada visual carregada por último. Não altera regras funcionais. */

/* --------------------------------------------------------------------------
   Proteções gerais de largura
   -------------------------------------------------------------------------- */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

.nd-app-header,
.nd-app-header__inner,
.nd-app-header__actions,
.nd-app-header__brand,
.nd-app-menu,
.nd-app-nav,
.nd-app-identity,
.nd-app-identity__item,
.nd-dashboard-page,
.nd-school-settings-page,
.nd-users-page,
.nd-user-form-page,
.nd-card,
.nd-dashboard-grid,
.nd-dashboard-module,
.nd-field,
.nd-table-wrap,
.nd-responsive-table {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.nd-input,
.nd-select,
.nd-textarea {
  min-width: 0;
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   Cabeçalho autenticado — desktop
   Logo à esquerda; Menu + sessão + Sair à direita.
   -------------------------------------------------------------------------- */
.nd-auth-header.nd-app-header {
  position: relative;
  z-index: 100;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.nd-auth-header .nd-app-header__inner {
  display: flex !important;
  width: min(calc(100% - 2rem), 84rem) !important;
  min-height: 4.5rem !important;
  height: auto !important;
  margin-inline: auto !important;
  padding-block: 0.45rem !important;
  align-items: center !important;
  gap: 0.9rem !important;
}

.nd-app-header__brand {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
}

.nd-app-header__brand .nd-auth-header__logo {
  display: block;
  width: min(12.5rem, 36vw) !important;
  height: auto !important;
}

.nd-app-header .nd-app-header__actions {
  display: flex !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  margin-left: auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
}

/* Menu */
.nd-app-menu {
  position: relative !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

.nd-app-menu__trigger {
  display: inline-flex !important;
  min-height: 2.35rem !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4rem !important;
  margin: 0 !important;
  border: 1px solid var(--nd-color-ink-200) !important;
  border-radius: var(--nd-radius-md) !important;
  padding: 0.45rem 0.7rem !important;
  background: var(--nd-color-surface) !important;
  color: var(--nd-color-ink-800) !important;
  cursor: pointer !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  list-style: none !important;
  white-space: nowrap !important;
  user-select: none !important;
}

.nd-app-menu__trigger::-webkit-details-marker {
  display: none !important;
}

.nd-app-menu__trigger::marker {
  content: "" !important;
}

.nd-app-menu__icon {
  font-size: 1rem !important;
  line-height: 1 !important;
}

.nd-app-menu__trigger:hover,
.nd-app-menu__trigger:focus-visible,
.nd-app-menu[open] > .nd-app-menu__trigger {
  border-color: #b9dce8 !important;
  background: var(--nd-color-brand-50) !important;
  color: var(--nd-color-brand-700) !important;
}

.nd-app-menu__trigger:focus-visible {
  outline: 3px solid rgb(40 127 159 / 20%) !important;
  outline-offset: 2px !important;
}

.nd-app-menu__panel {
  position: absolute !important;
  top: calc(100% + 0.45rem) !important;
  right: 0 !important;
  left: auto !important;
  z-index: 130 !important;
  display: block !important;

  /* O painel precisa ser dimensionado pela viewport, não pela largura do botão Menu. */
  width: 18rem !important;
  min-width: 16rem !important;
  max-width: calc(100vw - 1rem) !important;

  max-height: min(31rem, calc(100vh - 5.5rem)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  border: var(--nd-border) !important;
  border-radius: var(--nd-radius-lg) !important;
  padding: 0.4rem !important;
  background: var(--nd-color-surface) !important;
  box-shadow: var(--nd-shadow-md) !important;
  box-sizing: border-box !important;
}

.nd-app-menu:not([open]) > .nd-app-menu__panel {
  display: none !important;
}

.nd-app-menu .nd-app-nav {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  gap: 0.35rem !important;
  overflow: visible !important;
  border: 0 !important;
  padding: 0 !important;
}

.nd-app-nav__group {
  display: grid !important;
  gap: 0.1rem !important;
  min-width: 0 !important;
}

.nd-app-nav__group + .nd-app-nav__group {
  margin-top: 0.25rem !important;
  border-top: 1px solid var(--nd-color-ink-100) !important;
  padding-top: 0.5rem !important;
}

.nd-app-nav__section-label {
  display: block !important;
  padding: 0.2rem 0.55rem 0.3rem !important;
  color: var(--nd-color-ink-400) !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.055em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

.nd-app-menu .nd-app-nav__link {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  border-radius: var(--nd-radius-md) !important;
  padding: 0.52rem 0.62rem !important;
  color: var(--nd-color-ink-700) !important;
  font-size: 0.94rem !important;
  font-weight: 700 !important;
  line-height: 1.22 !important;
  text-align: left !important;
  text-decoration: none !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

.nd-app-menu .nd-app-nav__link:hover,
.nd-app-menu .nd-app-nav__link:focus-visible,
.nd-app-menu .nd-app-nav__link[aria-current="page"] {
  background: var(--nd-color-brand-50) !important;
  color: var(--nd-color-brand-700) !important;
}

.nd-app-menu .nd-app-nav__link[aria-current="page"] {
  box-shadow: inset 3px 0 0 #287f9f !important;
}

/* Correção V5.1 — conteúdo interno acompanha integralmente a largura do painel. */
.nd-app-menu__panel .nd-app-nav,
.nd-app-menu__panel .nd-app-nav__group,
.nd-app-menu__panel .nd-app-nav__link,
.nd-app-menu__panel .nd-app-nav__section-label {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.nd-app-menu__panel .nd-app-nav__link,
.nd-app-menu__panel .nd-app-nav__section-label {
  overflow: visible !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.nd-app-menu__panel .nd-app-nav__link {
  white-space: normal !important;
}


/* Sessão */
.nd-app-header .nd-app-identity {
  display: flex !important;
  min-width: 0 !important;
  max-width: min(32rem, 46vw) !important;
  align-items: stretch !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  border-left: 1px solid var(--nd-color-ink-200) !important;
  padding-left: 0.65rem !important;
}

.nd-app-header .nd-app-identity__item {
  display: grid !important;
  min-width: 0 !important;
  align-content: center !important;
  gap: 0.08rem !important;
}

.nd-app-header .nd-app-identity__item + .nd-app-identity__item {
  margin: 0 !important;
  border-left: 1px solid var(--nd-color-ink-100) !important;
  padding-left: 0.65rem !important;
}

.nd-app-header .nd-app-identity__label {
  color: var(--nd-color-ink-400) !important;
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.045em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
}

.nd-app-header .nd-app-identity__value {
  display: block !important;
  max-width: 11.5rem !important;
  overflow: hidden !important;
  color: var(--nd-color-ink-900) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.nd-app-header__logout {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

.nd-app-header__logout .nd-btn {
  min-height: 2.35rem !important;
  padding: 0.45rem 0.75rem !important;
}

/* --------------------------------------------------------------------------
   Densidade geral da área administrativa
   -------------------------------------------------------------------------- */
.nd-dashboard-page,
.nd-school-settings-page,
.nd-users-page,
.nd-user-form-page {
  box-sizing: border-box;
}

.nd-dashboard-module .nd-btn,
.nd-school-page-heading .nd-btn,
.nd-users-heading .nd-btn,
.nd-page-heading-actions .nd-btn,
.nd-empty .nd-btn,
.nd-card__body .nd-cluster .nd-btn {
  width: auto;
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   Tablet/mobile
   -------------------------------------------------------------------------- */
@media (max-width: 720px) {
  .nd-auth-header.nd-app-header {
    position: sticky !important;
    top: 0 !important;
  }

  .nd-auth-header .nd-app-header__inner {
    display: grid !important;
    width: calc(100% - 0.75rem) !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    grid-template-rows: auto auto !important;
    gap: 0.42rem 0.45rem !important;
    padding-block: 0.45rem !important;
  }

  .nd-app-header__brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  .nd-app-header__brand .nd-auth-header__logo {
    width: min(10.7rem, 53vw) !important;
  }

  /* Faz os filhos do bloco de ações participarem da grade do cabeçalho. */
  .nd-app-header .nd-app-header__actions {
    display: contents !important;
  }

  .nd-app-menu {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
  }

  .nd-app-menu__trigger {
    min-height: 2.15rem !important;
    padding: 0.4rem 0.58rem !important;
    font-size: 0.84rem !important;
  }

  .nd-app-menu__panel {
    right: 0 !important;
    left: auto !important;
    width: 17rem !important;
    min-width: min(16rem, calc(100vw - 0.75rem)) !important;
    max-width: calc(100vw - 0.75rem) !important;
    max-height: calc(100vh - 4.75rem) !important;
    overflow-x: hidden !important;
    padding: 0.35rem !important;
  }

  .nd-app-menu .nd-app-nav__link {
    padding: 0.5rem 0.58rem !important;
    font-size: 0.91rem !important;
  }

  .nd-app-header__logout {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: center !important;
  }

  .nd-app-header__logout .nd-btn {
    min-height: 2.15rem !important;
    padding: 0.4rem 0.65rem !important;
    font-size: 0.82rem !important;
  }

  .nd-app-header .nd-app-identity {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: grid !important;
    width: 100% !important;
    max-width: none !important;
    grid-template-columns: minmax(4.5rem, 0.72fr) minmax(0, 1.28fr) !important;
    gap: 0.45rem !important;
    border-top: 1px solid var(--nd-color-ink-100) !important;
    border-left: 0 !important;
    padding: 0.4rem 0 0 !important;
  }

  .nd-app-header .nd-app-identity__item + .nd-app-identity__item {
    border-left: 1px solid var(--nd-color-ink-100) !important;
    padding-left: 0.45rem !important;
  }

  .nd-app-header .nd-app-identity__label {
    font-size: 0.58rem !important;
  }

  .nd-app-header .nd-app-identity__value {
    max-width: 100% !important;
    font-size: 0.78rem !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .nd-dashboard-page,
  .nd-school-settings-page,
  .nd-users-page,
  .nd-user-form-page {
    width: calc(100% - 0.75rem) !important;
    padding-block: 0.8rem 1.25rem !important;
  }

  .nd-dashboard-page,
  .nd-school-settings-page,
  .nd-users-page,
  .nd-user-form-page,
  .nd-school-settings-page > .nd-stack--lg,
  .nd-user-form-page > .nd-stack--lg {
    gap: 0.72rem !important;
  }

  .nd-school-page-heading,
  .nd-dashboard-heading,
  .nd-users-heading,
  .nd-user-state-form {
    align-items: flex-start !important;
    gap: 0.5rem !important;
  }

  .nd-school-page-heading h1,
  .nd-dashboard-heading h1 {
    margin-bottom: 0.18rem !important;
    font-size: clamp(1.65rem, 6.5vw, 2.2rem) !important;
    line-height: 1.08 !important;
  }

  .nd-foundation-kicker {
    margin-bottom: 0.25rem !important;
  }

  .nd-school-page-heading .nd-btn,
  .nd-users-heading .nd-btn,
  .nd-user-state-form .nd-btn,
  .nd-page-heading-actions .nd-btn,
  .nd-dashboard-module .nd-btn,
  .nd-empty .nd-btn,
  .nd-card__body .nd-cluster .nd-btn {
    width: auto !important;
    max-width: 100% !important;
    align-self: flex-start !important;
  }

  .nd-dashboard-grid {
    gap: 0.68rem !important;
  }

  .nd-dashboard-module {
    min-height: 0 !important;
    gap: 0.55rem !important;
    padding: 0.85rem 0.95rem !important;
  }

  .nd-dashboard-module h3 {
    margin-bottom: 0.12rem !important;
    font-size: 1.2rem !important;
  }

  .nd-dashboard-module p {
    font-size: 0.94rem !important;
    line-height: 1.4 !important;
  }

  .nd-card__header,
  .nd-card__body,
  .nd-card__footer {
    padding: 0.82rem 0.9rem !important;
  }

  .nd-school-settings-page .nd-alert,
  .nd-users-page .nd-alert,
  .nd-user-form-page .nd-alert {
    padding: 0.72rem 0.82rem !important;
  }

  /* Resumos como cards compactos, duas colunas. */
  .nd-users-summary {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
    margin: 0 !important;
  }

  .nd-users-summary__item {
    display: grid !important;
    min-height: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 0.42rem !important;
    border-radius: 0.9rem !important;
    padding: 0.58rem 0.68rem !important;
  }

  .nd-users-summary__label {
    font-size: 0.76rem !important;
    line-height: 1.15 !important;
  }

  .nd-users-summary__value {
    display: grid !important;
    width: 1.9rem !important;
    min-width: 1.9rem !important;
    height: 1.9rem !important;
    min-height: 1.9rem !important;
    place-items: center !important;
    padding: 0 !important;
    font-size: 0.9rem !important;
  }

  /* Listagens em cartões compactos. */
  .nd-users-table-wrap {
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .nd-responsive-table {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    border-collapse: separate !important;
  }

  .nd-responsive-table thead {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
  }

  .nd-responsive-table tbody {
    display: grid !important;
    width: 100% !important;
    gap: 0.58rem !important;
  }

  .nd-responsive-table tr {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border: var(--nd-border) !important;
    border-radius: 0.9rem !important;
    background: var(--nd-color-surface) !important;
    box-shadow: var(--nd-shadow-sm) !important;
  }

  .nd-responsive-table td,
  .nd-school-settings-page .nd-responsive-table td {
    display: grid !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(6rem, 36%) minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 0.42rem !important;
    border-bottom: var(--nd-border) !important;
    padding: 0.56rem 0.68rem !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .nd-responsive-table td:last-child {
    border-bottom: 0 !important;
  }

  .nd-responsive-table td::before {
    content: attr(data-label) !important;
    color: var(--nd-color-ink-500) !important;
    font-size: 0.64rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    line-height: 1.25 !important;
    text-transform: uppercase !important;
  }

  .nd-responsive-table td[data-label="Ações"] .nd-btn {
    width: auto !important;
    min-width: 5.25rem !important;
    justify-self: start !important;
  }

  .nd-responsive-table td[data-label="Estado"] .nd-badge,
  .nd-responsive-table td[data-label="Conta"] .nd-badge,
  .nd-responsive-table td[data-label="Vínculo docente"] .nd-badge {
    width: auto !important;
    max-width: max-content !important;
    justify-self: start !important;
  }

  .nd-users-table__email {
    font-size: 0.92rem !important;
  }

  .nd-empty {
    min-height: 0 !important;
    padding: 1rem !important;
  }
}

@media (max-width: 420px) {
  .nd-app-header__brand .nd-auth-header__logo {
    width: min(9.7rem, 50vw) !important;
  }

  .nd-app-menu__trigger span:last-child {
    display: none;
  }

  .nd-app-menu__trigger {
    width: 2.25rem !important;
    min-width: 2.25rem !important;
    padding-inline: 0.45rem !important;
  }

  .nd-users-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .nd-responsive-table td,
  .nd-school-settings-page .nd-responsive-table td {
    grid-template-columns: 1fr !important;
    gap: 0.22rem !important;
  }
}

@media (max-width: 350px) {
  .nd-users-summary {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   Nexo Diário — Item 30 — Interface responsiva V5.2
   Refinamento visual do menu e densidade mobile — 09/08/2026
   ========================================================================== */

/* MENU — base */
.nd-app-menu__panel {
  width: 34rem !important;
  min-width: 34rem !important;
  max-width: calc(100vw - 1.5rem) !important;
  padding: 0.7rem !important;
  overflow-x: hidden !important;
}

.nd-app-menu__panel .nd-app-nav {
  display: grid !important;
  grid-template-columns: 9rem minmax(0, 1fr) !important;
  gap: 0.75rem !important;
  align-items: start !important;
}

.nd-app-menu__panel .nd-app-nav__group {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 0.4rem !important;
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
}

.nd-app-menu__panel .nd-app-nav__group + .nd-app-nav__group {
  border-left: 1px solid var(--nd-color-ink-100) !important;
  padding-left: 0.75rem !important;
}

.nd-app-menu__panel .nd-app-nav__group:first-child {
  grid-template-columns: 1fr !important;
}

.nd-app-menu__panel .nd-app-nav__group:nth-child(2) {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.nd-app-menu__panel .nd-app-nav__section-label {
  grid-column: 1 / -1 !important;
  padding: 0 0.45rem 0.25rem !important;
  color: var(--nd-color-ink-500) !important;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.055em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

.nd-app-menu__panel .nd-app-nav__link {
  display: flex !important;
  min-height: 2.65rem !important;
  align-items: center !important;
  width: 100% !important;
  border: 1px solid transparent !important;
  border-radius: 0.75rem !important;
  padding: 0.55rem 0.65rem !important;
  background: transparent !important;
  color: var(--nd-color-ink-700) !important;
  font-size: 0.9rem !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: normal !important;
}

.nd-app-menu__panel .nd-app-nav__link:hover,
.nd-app-menu__panel .nd-app-nav__link:focus-visible {
  border-color: var(--nd-color-ink-100) !important;
  background: var(--nd-color-ink-50) !important;
}

.nd-app-menu__panel .nd-app-nav__link[aria-current="page"] {
  border-color: #cfe3ec !important;
  background: var(--nd-color-brand-50) !important;
  color: var(--nd-color-brand-700) !important;
  box-shadow: inset 3px 0 0 #287f9f !important;
}

/* DESKTOP */
@media (min-width: 721px) {
  .nd-app-menu__panel {
    top: calc(100% + 0.5rem) !important;
    right: 0 !important;
    left: auto !important;
    border-radius: 1rem !important;
    box-shadow: 0 16px 36px rgb(15 42 56 / 16%) !important;
  }

  .nd-app-menu__trigger {
    min-height: 2.35rem !important;
    padding: 0.45rem 0.72rem !important;
  }
}

/* MOBILE / TABLET */
@media (max-width: 720px) {
  .nd-app-menu__panel {
    top: calc(100% + 0.4rem) !important;
    right: 0 !important;
    left: auto !important;
    width: min(23rem, calc(100vw - 0.75rem)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 0.75rem) !important;
    max-height: calc(100vh - 6rem) !important;
    padding: 0.6rem !important;
    border-radius: 1rem !important;
    box-shadow: 0 14px 34px rgb(15 42 56 / 18%) !important;
  }

  .nd-app-menu__panel .nd-app-nav {
    grid-template-columns: 1fr !important;
    gap: 0.55rem !important;
  }

  .nd-app-menu__panel .nd-app-nav__group + .nd-app-nav__group {
    border-top: 1px solid var(--nd-color-ink-100) !important;
    border-left: 0 !important;
    padding-top: 0.55rem !important;
    padding-left: 0 !important;
  }

  .nd-app-menu__panel .nd-app-nav__group:first-child {
    grid-template-columns: 1fr !important;
  }

  .nd-app-menu__panel .nd-app-nav__group:nth-child(2) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.45rem !important;
  }

  .nd-app-menu__panel .nd-app-nav__section-label {
    padding: 0 0.35rem 0.2rem !important;
    font-size: 0.61rem !important;
  }

  .nd-app-menu__panel .nd-app-nav__link {
    min-height: 2.55rem !important;
    border: 1px solid var(--nd-color-ink-100) !important;
    padding: 0.48rem 0.55rem !important;
    background: var(--nd-color-surface) !important;
    font-size: 0.84rem !important;
  }

  .nd-dashboard-page,
  .nd-school-settings-page,
  .nd-users-page,
  .nd-user-form-page {
    width: calc(100% - 0.65rem) !important;
    padding-block: 0.7rem 1.15rem !important;
  }

  .nd-dashboard-grid {
    gap: 0.6rem !important;
  }

  .nd-dashboard-module {
    padding: 0.8rem 0.85rem !important;
    gap: 0.5rem !important;
    border-radius: 0.95rem !important;
  }

  .nd-dashboard-module h3 {
    margin-bottom: 0.12rem !important;
    font-size: 1.15rem !important;
  }

  .nd-dashboard-module p {
    font-size: 0.91rem !important;
    line-height: 1.38 !important;
  }

  .nd-dashboard-module .nd-btn,
  .nd-school-page-heading .nd-btn,
  .nd-users-heading .nd-btn,
  .nd-page-heading-actions .nd-btn,
  .nd-card__body .nd-cluster .nd-btn,
  .nd-empty .nd-btn {
    min-height: 2.35rem !important;
    width: auto !important;
    padding: 0.5rem 0.78rem !important;
    font-size: 0.88rem !important;
  }

  .nd-users-summary {
    gap: 0.45rem !important;
  }

  .nd-users-summary__item {
    min-height: 3.25rem !important;
    padding: 0.52rem 0.62rem !important;
    border-radius: 0.8rem !important;
  }

  .nd-users-summary__label {
    font-size: 0.74rem !important;
  }

  .nd-users-summary__value {
    width: 1.85rem !important;
    height: 1.85rem !important;
    min-width: 1.85rem !important;
    min-height: 1.85rem !important;
    font-size: 0.86rem !important;
  }

  .nd-responsive-table tbody {
    gap: 0.5rem !important;
  }

  .nd-responsive-table tr {
    border-radius: 0.85rem !important;
  }

  .nd-responsive-table td,
  .nd-school-settings-page .nd-responsive-table td {
    padding: 0.52rem 0.62rem !important;
  }
}

/* CELULARES ESTREITOS */
@media (max-width: 420px) {
  .nd-app-menu__panel {
    width: calc(100vw - 0.6rem) !important;
    max-width: calc(100vw - 0.6rem) !important;
    right: -0.1rem !important;
    padding: 0.5rem !important;
  }

  .nd-app-menu__panel .nd-app-nav__group:nth-child(2) {
    grid-template-columns: 1fr 1fr !important;
  }

  .nd-app-menu__panel .nd-app-nav__link {
    min-height: 2.45rem !important;
    padding: 0.45rem 0.5rem !important;
    font-size: 0.81rem !important;
  }
}

@media (max-width: 340px) {
  .nd-app-menu__panel .nd-app-nav__group:nth-child(2) {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   Nexo Diário — Item 30 — Interface responsiva V5.3
   Correção definitiva de posicionamento do menu e compactação mobile
   09/08/2026
   ========================================================================== */

/* O cabeçalho passa a ser o referencial de posicionamento do dropdown.
   Assim o menu não depende da largura nem da posição do botão Menu. */
.nd-app-header__inner {
  position: relative !important;
}

.nd-app-menu {
  position: static !important;
}

/* --------------------------------------------------------------------------
   MENU — desktop e base
   -------------------------------------------------------------------------- */
.nd-app-menu__panel {
  position: absolute !important;
  top: calc(100% + 0.35rem) !important;
  right: 0 !important;
  left: auto !important;

  width: 18rem !important;
  min-width: 18rem !important;
  max-width: calc(100vw - 1rem) !important;

  max-height: min(30rem, calc(100vh - 5.5rem)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;

  border: var(--nd-border) !important;
  border-radius: 0.95rem !important;
  padding: 0.45rem !important;
  background: var(--nd-color-surface) !important;
  box-shadow: 0 14px 34px rgb(15 42 56 / 17%) !important;
  box-sizing: border-box !important;
}

.nd-app-menu__panel .nd-app-nav {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.4rem !important;
  width: 100% !important;
}

.nd-app-menu__panel .nd-app-nav__group,
.nd-app-menu__panel .nd-app-nav__group:first-child,
.nd-app-menu__panel .nd-app-nav__group:nth-child(2) {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.18rem !important;
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  padding: 0 !important;
}

.nd-app-menu__panel .nd-app-nav__group + .nd-app-nav__group {
  margin-top: 0.2rem !important;
  border-top: 1px solid var(--nd-color-ink-100) !important;
  border-left: 0 !important;
  padding-top: 0.45rem !important;
  padding-left: 0 !important;
}

.nd-app-menu__panel .nd-app-nav__section-label {
  grid-column: auto !important;
  width: 100% !important;
  padding: 0.16rem 0.55rem 0.3rem !important;
  color: var(--nd-color-ink-500) !important;
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.055em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

.nd-app-menu__panel .nd-app-nav__link {
  display: flex !important;
  width: 100% !important;
  min-height: 2.45rem !important;
  align-items: center !important;

  border: 1px solid transparent !important;
  border-radius: 0.68rem !important;
  padding: 0.48rem 0.6rem !important;

  background: transparent !important;
  color: var(--nd-color-ink-700) !important;
  font-size: 0.88rem !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;

  text-decoration: none !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.nd-app-menu__panel .nd-app-nav__link:hover,
.nd-app-menu__panel .nd-app-nav__link:focus-visible {
  border-color: var(--nd-color-ink-100) !important;
  background: var(--nd-color-ink-50) !important;
}

.nd-app-menu__panel .nd-app-nav__link[aria-current="page"] {
  border-color: #cfe3ec !important;
  background: var(--nd-color-brand-50) !important;
  color: var(--nd-color-brand-700) !important;
  box-shadow: inset 3px 0 0 #287f9f !important;
}

/* --------------------------------------------------------------------------
   MOBILE / TABLET
   -------------------------------------------------------------------------- */
@media (max-width: 720px) {
  .nd-app-menu__panel {
    top: calc(100% + 0.25rem) !important;
    right: 0 !important;
    left: auto !important;

    width: min(17.5rem, calc(100vw - 0.75rem)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 0.75rem) !important;

    max-height: calc(100vh - 7rem) !important;
    padding: 0.4rem !important;
  }

  .nd-app-menu__panel .nd-app-nav__section-label {
    padding-inline: 0.5rem !important;
    font-size: 0.6rem !important;
  }

  .nd-app-menu__panel .nd-app-nav__link {
    min-height: 2.35rem !important;
    padding: 0.45rem 0.55rem !important;
    font-size: 0.84rem !important;
  }

  /* Cabeçalho ligeiramente mais compacto. */
  .nd-app-header__inner {
    width: calc(100% - 0.6rem) !important;
    gap: 0.38rem 0.5rem !important;
    padding-block: 0.42rem !important;
  }

  .nd-auth-header__logo {
    width: min(10.3rem, 51vw) !important;
  }

  .nd-app-menu__trigger,
  .nd-app-header__logout .nd-btn,
  .nd-app-header__logout button {
    min-height: 2.15rem !important;
  }

  /* Cards do painel mais densos. */
  .nd-dashboard-page,
  .nd-school-settings-page,
  .nd-users-page,
  .nd-user-form-page {
    width: calc(100% - 0.55rem) !important;
    padding-block: 0.62rem 1rem !important;
  }

  .nd-dashboard-grid {
    gap: 0.52rem !important;
  }

  .nd-dashboard-module {
    padding: 0.72rem 0.8rem !important;
    gap: 0.42rem !important;
  }

  .nd-dashboard-module h3 {
    font-size: 1.08rem !important;
  }

  .nd-dashboard-module p {
    font-size: 0.87rem !important;
    line-height: 1.34 !important;
  }

  /* Resumos em duas colunas, com altura curta. */
  .nd-users-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.42rem !important;
  }

  .nd-users-summary__item {
    min-height: 3rem !important;
    padding: 0.46rem 0.58rem !important;
  }

  .nd-users-summary__label {
    font-size: 0.72rem !important;
  }

  .nd-users-summary__value {
    width: 1.75rem !important;
    height: 1.75rem !important;
    min-width: 1.75rem !important;
    min-height: 1.75rem !important;
    font-size: 0.82rem !important;
  }

  /* ------------------------------------------------------------------------
     LISTAGENS MOBILE
     Cada registro vira um cartão compacto em duas colunas:
     - entidade principal ocupa toda a largura;
     - dados intermediários ficam lado a lado;
     - ações ocupam a largura total no final.
     ------------------------------------------------------------------------ */
  .nd-responsive-table tbody {
    display: grid !important;
    gap: 0.5rem !important;
  }

  .nd-responsive-table tr {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    overflow: hidden !important;
    border: var(--nd-border) !important;
    border-radius: 0.85rem !important;
    background: var(--nd-color-surface) !important;
  }

  .nd-responsive-table td,
  .nd-school-settings-page .nd-responsive-table td {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    border-right: var(--nd-border) !important;
    border-bottom: var(--nd-border) !important;
    padding: 0.55rem 0.62rem !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .nd-responsive-table td:nth-child(even) {
    border-right: 0 !important;
  }

  .nd-responsive-table td:first-child {
    grid-column: 1 / -1 !important;
    border-right: 0 !important;
  }

  .nd-responsive-table td[data-label="Ações"] {
    grid-column: 1 / -1 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }

  .nd-responsive-table td::before {
    display: block !important;
    margin-bottom: 0.22rem !important;
    color: var(--nd-color-ink-600) !important;
    font-size: 0.63rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
  }

  .nd-responsive-table td[data-label="Ações"] .nd-btn {
    width: auto !important;
    min-width: 5rem !important;
  }

  .nd-responsive-table .nd-badge {
    width: auto !important;
    max-width: max-content !important;
  }

  .nd-users-table__email {
    margin-top: 0.15rem !important;
    font-size: 0.88rem !important;
    line-height: 1.25 !important;
  }
}

/* Celulares realmente estreitos continuam em duas colunas sempre que couber.
   Só abaixo de 330 px a listagem volta a uma coluna. */
@media (max-width: 330px) {
  .nd-responsive-table tr {
    grid-template-columns: 1fr !important;
  }

  .nd-responsive-table td,
  .nd-responsive-table td:first-child,
  .nd-responsive-table td[data-label="Ações"] {
    grid-column: 1 !important;
    border-right: 0 !important;
  }

  .nd-users-summary {
    grid-template-columns: 1fr !important;
  }
}