/* MDH ID v1.3 — login-only visual layer.
   Loaded exclusively when there is NO authenticated MDH session.
   The authenticated UI continues to use the stable global app.css unchanged. */

.login-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 50% -12%,rgba(246,189,36,.09) 0,rgba(246,189,36,.025) 25rem,transparent 46rem),
    linear-gradient(180deg,#13253a 0%,#0b1b2b 100%);
  color:#f7f8fb;
}

.login-page .shell{
  width:min(100% - 32px,1180px);
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.login-page .flash{
  width:min(554px,100%);
  margin:20px auto -6px;
}

.mdhid-login{
  flex:1;
  min-height:calc(100vh - 46px);
  display:grid;
  place-items:center;
  padding:24px 0;
}

/* --------------------------------------------------------------------------
   Gateway / landing: same visual family as Comic, HeroComp and Portal.
   No credential fields are shown here. The only primary action is MDH ID.
   -------------------------------------------------------------------------- */

.mdhid-gateway-card,
.mdhid-credentials-card{
  width:min(554px,100%);
  position:relative;
  overflow:hidden;
  border:1px solid #2d5576;
  border-radius:30px;
  background:linear-gradient(180deg,rgba(15,36,57,.985),rgba(10,29,47,.99));
  box-shadow:0 30px 90px rgba(0,0,0,.32),0 1px 0 rgba(255,255,255,.025) inset;
}

.mdhid-gateway-card{
  padding:38px 36px 46px;
}

.mdhid-gateway-version{
  position:absolute;
  top:22px;
  right:22px;
  display:inline-flex;
  align-items:center;
  min-height:27px;
  padding:4px 10px 5px;
  border-radius:999px;
  background:#f6bd24;
  color:#171109;
  font-size:12px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.01em;
}

.mdhid-gateway-logo{
  display:block;
  width:min(290px,78%);
  max-height:310px;
  margin:2px auto 24px;
  object-fit:contain;
  filter:drop-shadow(0 20px 28px rgba(0,0,0,.28));
}

.mdhid-gateway-copy{
  text-align:left;
}

.mdhid-gateway-eyebrow,
.mdhid-credentials-eyebrow{
  display:block;
  margin-bottom:14px;
  color:#f6bd24;
  font-size:12px;
  line-height:1;
  font-weight:950;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.mdhid-gateway-copy h1{
  margin:0;
  color:#f7f8fb;
  font-size:clamp(46px,6vw,60px);
  line-height:.96;
  font-weight:950;
  letter-spacing:-.055em;
}

.mdhid-gateway-copy p{
  max-width:455px;
  margin:22px 0 26px;
  color:#b6cee4;
  font-size:17px;
  line-height:1.5;
}

.mdhid-gateway-cta,
.mdhid-credentials-submit{
  width:100%;
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e9b11a;
  border-radius:14px;
  background:linear-gradient(180deg,#e5a912 0%,#cb8700 100%);
  color:#fff!important;
  text-decoration:none!important;
  font-size:15px;
  font-weight:950;
  letter-spacing:.005em;
  text-shadow:0 1px 2px rgba(0,0,0,.28);
  box-shadow:0 14px 32px rgba(190,122,0,.22),0 1px 0 rgba(255,255,255,.18) inset;
  transition:transform .14s ease,filter .14s ease,box-shadow .14s ease;
}

.mdhid-gateway-cta:hover,
.mdhid-credentials-submit:hover{
  color:#fff!important;
  filter:brightness(1.07);
  transform:translateY(-1px);
  box-shadow:0 17px 38px rgba(190,122,0,.27),0 1px 0 rgba(255,255,255,.2) inset;
}

.mdhid-gateway-cta:active,
.mdhid-credentials-submit:active{
  transform:translateY(0);
}

.mdhid-gateway-note{
  margin:18px 0 0;
  color:#8fb2cf;
  font-size:12px;
  line-height:1.55;
}

/* --------------------------------------------------------------------------
   Credentials view. This is the actual MDH ID login form reached after the
   gateway, or directly during an OAuth flow initiated by another MDH app.
   -------------------------------------------------------------------------- */

.mdhid-credentials-card{
  padding:34px 38px 36px;
}

.mdhid-credentials-brand{
  text-align:left;
}

.mdhid-credentials-logo{
  width:108px;
  height:108px;
  display:block;
  margin:0 0 22px;
  object-fit:contain;
  filter:drop-shadow(0 14px 20px rgba(0,0,0,.28));
}

.mdhid-credentials-titleline{
  display:flex;
  align-items:center;
  gap:11px;
  flex-wrap:wrap;
}

.mdhid-credentials-titleline h1{
  margin:0;
  color:#f7f8fb;
  font-size:46px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.05em;
}

.mdhid-credentials-titleline span{
  display:inline-flex;
  align-items:center;
  min-height:27px;
  padding:4px 10px 5px;
  border-radius:999px;
  background:#f6bd24;
  color:#171109;
  font-size:12px;
  line-height:1;
  font-weight:950;
}

.mdhid-credentials-brand > p{
  margin:12px 0 26px;
  color:#a9c2d8;
  font-size:15px;
}

.mdhid-login-form{
  display:grid;
  gap:15px;
}

.mdhid-login-form label{
  display:grid;
  gap:8px;
  color:#c6d8e7;
  font-size:12px;
  font-weight:850;
}

.mdhid-login-form input{
  width:100%;
  min-height:50px;
  border:1px solid #365d7c;
  border-radius:12px;
  background:#071522;
  color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.02) inset;
}

.mdhid-login-form input:hover{
  border-color:#47769a;
}

.mdhid-login-form input:focus{
  border-color:#f6bd24;
  box-shadow:0 0 0 3px rgba(246,189,36,.14);
}

.mdhid-credentials-submit{
  margin-top:5px;
  cursor:pointer;
}

.mdhid-login-back{
  display:inline-block;
  margin-top:18px;
  color:#a6c3dc;
  font-size:12px;
  font-weight:800;
  text-decoration:none;
}

.mdhid-login-back:hover{
  color:#fff;
}

.login-page footer{
  padding:0 0 18px;
  color:#6687a3;
  font-size:11px;
}

@media(max-width:600px){
  .login-page .shell{width:min(100% - 18px,1180px)}
  .mdhid-login{padding:14px 0 20px}
  .mdhid-gateway-card{padding:28px 22px 32px;border-radius:24px}
  .mdhid-credentials-card{padding:28px 22px 30px;border-radius:24px}
  .mdhid-gateway-version{top:17px;right:17px}
  .mdhid-gateway-logo{width:min(240px,76%);margin-bottom:18px}
  .mdhid-gateway-copy h1{font-size:44px}
  .mdhid-gateway-copy p{margin:18px 0 22px;font-size:15px}
  .mdhid-gateway-cta,.mdhid-credentials-submit{min-height:56px}
  .mdhid-credentials-titleline h1{font-size:40px}
  .mdhid-credentials-logo{width:92px;height:92px;margin-bottom:18px}
  .login-page .flash{margin-top:12px}
}