/* PAQUETELLEGUE Envíos · Login v1.29.
   Source: 1536 × 1024. Show x=0…824 at uniform scale.
   Plane ends at x=790; illustrated form starts at x=838.
   Keep one image layer, and all login styles in this file. */
#login-screen.login-screen {
  display:grid;
  grid-template-columns:minmax(0,540px) minmax(340px,460px);
  align-items:center;
  align-content:center;
  justify-content:center;
  gap:clamp(24px,4vw,64px);
  width:100%;
  min-height:100svh;
  padding:clamp(24px,3vw,48px);
  color:#fff;
  background:radial-gradient(ellipse at 28% 18%,#084f89 0%,#052b54 48%,#041831 100%);
  color-scheme:dark;
}
#login-screen .login-art {
  width:min(100%,540px,64.375svh);
  aspect-ratio:824 / 1024;
  justify-self:center;
  min-width:0;
  background:url('/imagen-1.png') left top / 186.40776699% auto no-repeat;
  /* Fade outer background only, preserving logo, airplane and text. */
  -webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 1.5%,#000 95%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent,#000 8%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 1.5%,#000 95%,transparent);
  mask-composite:intersect;
}
#login-screen .login-card {
  width:100%;
  max-width:460px;
  min-width:0;
  justify-self:center;
  padding:34px;
  border:1px solid #427398;
  border-radius:24px;
  background:#082b4d;
  box-shadow:0 20px 50px #00122840,inset 0 1px 0 #ffffff0d;
}
#login-screen .eyebrow { color:#8cddff;font-size:12px;letter-spacing:1.7px;line-height:1.5;margin:0 0 12px; }
#login-screen h1 { margin:0 0 10px;font-size:clamp(30px,3vw,38px);line-height:1.15;letter-spacing:-.8px; }
#login-description { margin:0 0 26px;color:#c4d8e9;font-size:16px;line-height:1.5; }
#login-form .login-field { margin-bottom:18px; }
#login-form .login-field > label { margin:0 0 7px;font-size:15px;font-weight:600;color:#f3f8fd; }
#login-form input:not([type='checkbox']) {
  display:block;width:100%;min-width:0;min-height:52px;margin:0;padding:13px 14px;
  border:1px solid #759bb7;border-radius:10px;background:#123b5d;color:#fff;font-size:16px;line-height:1.4;
}
#login-form input::placeholder { color:#acc4d6;opacity:1; }
#login-form input:focus-visible { outline:3px solid #89deff;outline-offset:2px;border-color:#89deff; }
#login-form input:autofill { -webkit-text-fill-color:#fff;box-shadow:0 0 0 1000px #123b5d inset;caret-color:#fff; }
#login-form .password-wrap { position:relative; }
#login-form .password-wrap input { padding-right:84px; }
#login-form #show-password { position:absolute;inset:4px 5px 4px auto;min-width:64px;min-height:44px;padding:6px 9px;color:#b3e7ff;font-size:14px;font-weight:600; }
#login-form .checkbox { min-height:34px;margin:-2px 0 17px;gap:10px;font-size:14px;line-height:1.45;cursor:pointer; }
#login-form .checkbox input { flex:0 0 20px;width:20px;height:20px; }
#login-form .primary { min-height:52px;padding:13px 16px;border-radius:10px;background:#ffa52b;color:#102d46;font-size:16px;font-weight:750;line-height:1.4; }
#login-form .primary:hover { background:#ffb74d; }
#login-screen button:focus-visible { outline:3px solid #89deff;outline-offset:3px; }
#login-message { margin:14px 0 0;padding:11px 13px;border:1px solid #688caa;border-radius:8px;background:#163c5b;color:#f3f8fd;font-size:14px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere; }
#login-message:empty { display:none; }
#login-screen .login-links { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0 14px;margin-top:8px; }
#login-screen .login-links .text-button { min-height:44px;padding:9px 0;color:#a3e0ff;font-size:13px;line-height:1.5;text-align:left;text-decoration:underline;text-underline-offset:3px;white-space:normal; }
#login-screen .login-links .text-button:hover { color:#fff; }
#login-screen .login-foot { margin:18px 0 0;padding-top:18px;border-top:1px solid #ffffff24;color:#afc8dc;font-size:12px;line-height:1.5;text-align:center; }
@media (min-width:761px) and (max-width:1050px) {
  #login-screen.login-screen { gap:20px;padding:24px; }
  #login-screen .login-card { padding:27px; }
}
@media (max-width:760px) {
  #login-screen.login-screen { grid-template-columns:minmax(0,460px);align-content:center;gap:12px;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); }
  #login-screen .login-art {
    /* Retain logo, airplane and route; omit the poster's tiny body copy. */
    width:min(290px,76vw,34svh);aspect-ratio:824 / 600;
    -webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 1.5%,#000 98%,transparent);
    mask-image:linear-gradient(to right,transparent,#000 8%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 1.5%,#000 98%,transparent);
  }
  #login-screen .login-card { padding:23px;border-radius:19px; }
  #login-screen .eyebrow { font-size:11px;margin-bottom:8px; }
  #login-screen h1 { font-size:30px;margin-bottom:7px; }
  #login-description { font-size:14px;margin-bottom:21px; }
  #login-form .login-field { margin-bottom:16px; }
  #login-form input:not([type='checkbox']) { min-height:48px;padding-top:11px;padding-bottom:11px; }
  #login-form #show-password { inset-block:2px; }
  #login-form .primary { min-height:48px; }
  #login-screen .login-foot { margin-top:10px;padding-top:13px;font-size:11px; }
}
@media (max-width:760px) and (max-height:730px) {
  #login-screen.login-screen { gap:7px;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom)); }
  #login-screen .login-art { width:min(210px,64vw,26svh); }
  #login-screen .login-card { padding:18px 20px; }
  #login-screen .eyebrow { margin-bottom:5px;font-size:10px; }
  #login-screen h1 { font-size:27px; }
  #login-description { margin-bottom:16px; }
  #login-form .login-field { margin-bottom:12px; }
  #login-form .checkbox { margin-bottom:10px; }
  #login-screen .login-foot { margin-top:5px;padding-top:10px; }
}
