/* entrada_escritorio.css — REGISTRO Y ENTRADA en ESCRITORIO (>=1024px). En celular no cambia nada.
   Panel de marca fijo a la izquierda (.en-marca) y el formulario / los pasos a la derecha. Sin menú lateral: aún no hay sesión. */

.en-marca { display: none; }

@media (min-width: 1024px) {
  html[data-en] body { padding-left: 46vw !important; padding-right: 0 !important; display: block !important; min-height: 100vh; }
  html[data-en] .bg-waves, html[data-en] body::before { display: none !important; }

  /* ── panel de marca ── */
  .en-marca {
    display: flex; flex-direction: column; justify-content: space-between;
    position: fixed; left: 0; top: 0; bottom: 0; width: 46vw; z-index: 3; overflow: hidden;
    padding: 52px 64px 44px; color: #14161F; font-family: 'Plus Jakarta Sans', -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    background:
      radial-gradient(120% 70% at 0% 0%, #FBEFCB 0%, rgba(251,239,203,0) 60%),
      radial-gradient(90% 60% at 100% 100%, #F3DDA6 0%, rgba(243,221,166,0) 62%),
      linear-gradient(160deg, #FFFDF7 0%, #FAF3E1 100%);
    border-right: 1px solid #EFE6CF;
  }
  .en-marca::before, .en-marca::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
  .en-marca::before { width: 520px; height: 520px; right: -230px; top: 14%; border: 1px solid rgba(207,159,87,.28); }
  .en-marca::after { width: 360px; height: 360px; right: -140px; top: 22%; border: 1px solid rgba(207,159,87,.2); }
  .en-logo { position: relative; z-index: 1; height: 54px; width: auto; max-width: 220px; object-fit: contain; object-position: left center; }
  .en-logo-txt { position: relative; z-index: 1; font-size: 30px; font-weight: 800; letter-spacing: -.03em; }
  .en-centro { position: relative; z-index: 1; }
  .en-etq { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: rgba(255,255,255,.7); border: 1px solid #F0E0B4; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; color: #9A6F22; }
  .en-titulo { margin: 20px 0 14px; font-size: clamp(34px, 3.4vw, 50px); line-height: 1.07; font-weight: 800; letter-spacing: -.035em; }
  .en-titulo em { font-style: normal; background: linear-gradient(100deg, #CF9F57, #E9C877 60%, #B98433); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .en-sub { max-width: 470px; font-size: 17px; line-height: 1.65; color: #4B5060; }
  .en-lista { list-style: none; margin: 34px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; max-width: 520px; }
  .en-lista li { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-radius: 18px; background: rgba(255,255,255,.72); border: 1px solid #F1E6C8; box-shadow: 0 14px 28px -22px rgba(154,111,34,.55); font-size: 14.5px; font-weight: 700; }
  .en-lista li b { display: grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0; border-radius: 12px; background: linear-gradient(135deg, #F8E6AE, #E2B968); color: #6A4A12; font-size: 16px; }
  .en-lista li span { display: block; font-size: 12px; font-weight: 500; color: #7B8194; margin-top: 1px; }
  .en-pie { position: relative; z-index: 1; font-size: 12.5px; color: #8A8F9E; display: flex; gap: 8px; align-items: center; }
  .en-pie i { width: 5px; height: 5px; border-radius: 50%; background: #CF9F57; display: inline-block; }

  /* ── lado del formulario (login, registro, olvido, verificar...) ── */
  html[data-en="auth"] body { display: flex !important; align-items: center; justify-content: center; padding: 40px 32px 40px 46vw !important; }
  html[data-en="auth"] .auth-card {
    margin: 0 auto !important; max-width: 480px; width: 100%; min-height: 0 !important;
    padding: 46px 44px 34px !important; border-radius: 32px; background: #fff !important;
    border: 1px solid #EEEAE0; box-shadow: 0 40px 90px -52px rgba(20,22,31,.28);
  }

  html[data-en="auth"] .logo-box, html[data-en="auth"] .auth-card > .brand, html[data-en="auth"] .auth-card .logo { display: none !important; }

  /* ── pasos de configuración inicial ── */
  html[data-en="pasos"] body { background: #FFFFFF; }
  html[data-en="pasos"] .wrap { max-width: 600px !important; margin: 0 auto !important; padding: 64px 40px 60px !important; }
  html[data-en="pasos"] .brand { display: none; }
  html[data-en="pasos"] h1 { font-size: 38px; }
  html[data-en="pasos"] .sub { font-size: 17px; }

  /* ── páginas de verificación (sin panel de marca: se centran con su propio diseño) ── */
}

@media (min-width: 1024px) and (max-height: 700px) {
  .en-lista { display: none; }
  .en-marca { padding-top: 34px; padding-bottom: 28px; }
}
