*{ box-sizing:border-box; }

.app-body{
  margin: 0;
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
    display: flex;
    flex-direction: column;
}

html,
body {
  width: 100%;
  overflow-x: hidden;
}


.logout-modal{
  border-radius: 18px;
  overflow: hidden;
}

.logout-modal .modal-header{
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.logout-modal .modal-title{
  font-weight: 700;
}

.logout-modal .modal-body{
  font-size: 1rem;
  color: rgba(0,0,0,0.75);
}


/* ====== Escala tipo "zoom 110%" (solo escritorio) ====== */
@media (min-width: 992px) {

  /* Chrome / Edge */
  .app-body {
    zoom: 1.1;
  }

  /* Fallback (por si un navegador no soporta zoom) */
  @supports not (zoom: 1) {
    .app-body {
      transform: scale(1.1);
      transform-origin: top left;
      width: calc(100% / 1.1);
    }
  }
}

/* FIX: centrar modal de cerrar sesión (por si algún CSS pisa los márgenes) */
#logoutModal .modal-dialog{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* en pantallas chicas Bootstrap usa otro margin, lo mantenemos centrado */
@media (max-width: 575.98px){
  #logoutModal .modal-dialog{
    margin: .5rem auto !important;
  }
}