/* Scotia Trading login — responsive presentation layer; form markup remains fully functional. */
:root { color-scheme: dark; }

body.setra-login-page.setra-login-only {
  --rock-gold: #eab641;
  --rock-gold-light: #ffe08a;
  min-height: 100svh;
  color: #f7f2e5;
  background: #030302;
}

body.setra-login-page.setra-login-only .setra-background {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .36) 35%, #020202 100%),
    #030302 url("../images/logo3.png") center top / max(100%, 690px) auto no-repeat;
}

body.setra-login-page.setra-login-only .setra-background::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, .58), transparent 24%, transparent 76%, rgba(0, 0, 0, .58));
}

body.setra-login-page.setra-login-only .setra-background::after {
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 14%, rgba(0, 0, 0, .2) 47%, #020202 100%);
}

body.setra-login-page.setra-login-only .setra-login-shell {
  width: min(100%, 530px);
  min-height: 100svh;
  margin: 0 auto;
  padding: clamp(26px, 6vw, 54px) clamp(18px, 5vw, 34px) 42px;
  display: flex;
  flex-direction: column;
}

body.setra-login-page.setra-login-only .login-showcase {
  margin: 0 auto clamp(20px, 5vw, 34px);
  text-align: center;
}

body.setra-login-page.setra-login-only .login-brand {
  display: block;
  width: clamp(190px, 55vw, 250px);
  margin: 0 auto;
  filter: drop-shadow(0 9px 19px rgba(0, 0, 0, .75));
}

body.setra-login-page.setra-login-only .login-brand img.login-brand-logo {
  width: 100%;
  height: auto;
  display: block;
}

body.setra-login-page.setra-login-only .setra-login-card {
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: clamp(29px, 7vw, 41px) clamp(20px, 5vw, 34px) clamp(27px, 6vw, 37px);
  overflow: hidden;
  border: 1px solid rgba(235, 183, 65, .9);
  border-radius: 25px;
  background:
    radial-gradient(circle at 50% 0, rgba(160, 111, 29, .22), transparent 42%),
    linear-gradient(135deg, rgba(31, 29, 22, .66), rgba(3, 3, 2, .72));
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  box-shadow: inset 0 1px rgba(255, 230, 157, .14), 0 13px 38px rgba(0, 0, 0, .72), 0 0 30px rgba(212, 143, 17, .08);
}

body.setra-login-page.setra-login-only .setra-login-card::before,
body.setra-login-page.setra-login-only .setra-login-card::after { display: none; }

body.setra-login-page.setra-login-only .login-heading {
  display: block;
  margin: 0 0 28px;
  text-align: center;
}

body.setra-login-page.setra-login-only .login-heading h1 {
  margin: 0 0 8px;
  color: var(--rock-gold-light);
  font-size: clamp(32px, 8vw, 44px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -.035em;
  text-shadow: 0 2px 0 #674310, 0 5px 18px rgba(0, 0, 0, .85);
}

body.setra-login-page.setra-login-only .login-heading p {
  color: #ebe8e0;
  font-size: clamp(16px, 4.1vw, 20px);
}

body.setra-login-page.setra-login-only .field-label { display: none; }
body.setra-login-page.setra-login-only .saved-account-field { margin-bottom: 15px; }
/* Keep the saved-account area visible after its lookup completes. The select
   itself communicates whether this browser has a saved account. */
body.setra-login-page.setra-login-only .saved-account-field:has(select:disabled) { display: flex; opacity: .72; }

body.setra-login-page.setra-login-only .saved-account-field,
body.setra-login-page.setra-login-only .setra-field {
  height: 67px;
  margin-bottom: 17px;
  padding-inline: 17px;
  gap: 14px;
  border: 1px solid rgba(222, 161, 46, .78);
  border-radius: 15px;
  background: linear-gradient(105deg, rgba(20, 20, 19, .97), rgba(9, 9, 8, .96));
  box-shadow: inset 0 1px 9px rgba(255, 223, 143, .035), 0 5px 15px rgba(0, 0, 0, .32);
}

body.setra-login-page.setra-login-only .saved-account-field:focus-within,
body.setra-login-page.setra-login-only .setra-field:focus-within {
  border-color: var(--rock-gold-light);
  box-shadow: 0 0 0 3px rgba(237, 183, 67, .13), 0 5px 15px rgba(0, 0, 0, .4);
  transform: none;
}

body.setra-login-page.setra-login-only .field-icon,
body.setra-login-page.setra-login-only .select-chevron,
body.setra-login-page.setra-login-only .password-toggle { color: var(--rock-gold); }
body.setra-login-page.setra-login-only .field-icon { width: 29px; height: 29px; flex-basis: 29px; border-radius: 0; background: transparent; }
body.setra-login-page.setra-login-only .field-icon svg { width: 27px; height: 27px; }
body.setra-login-page.setra-login-only .setra-field input,
body.setra-login-page.setra-login-only .quick-account-select { color: #fffaf0; font-size: clamp(16px, 4vw, 19px); }
body.setra-login-page.setra-login-only .setra-field input::placeholder { color: #c4c0b8; }
body.setra-login-page.setra-login-only .quick-account-select option { color: #fff; background: #15130e; }
body.setra-login-page.setra-login-only .password-toggle:hover,
body.setra-login-page.setra-login-only .password-toggle:focus-visible { color: var(--rock-gold-light); }

body.setra-login-page.setra-login-only .login-options {
  margin: 4px 0 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
body.setra-login-page.setra-login-only .remember-option { display: inline-flex; color: #f6f3eb; font-size: clamp(14px, 3.7vw, 17px); }
body.setra-login-page.setra-login-only .remember-option span { width: 26px; height: 26px; border-color: var(--rock-gold); border-radius: 6px; background: transparent; }
body.setra-login-page.setra-login-only .remember-option input:checked + span { background: var(--rock-gold); }
body.setra-login-page.setra-login-only .forgot-link { width: auto; margin: 0; color: var(--rock-gold-light); font-size: clamp(14px, 3.7vw, 17px); }

body.setra-login-page.setra-login-only .login-btn {
  height: 66px;
  border: 1px solid #ffe49a;
  border-radius: 13px;
  color: #100d06;
  background: linear-gradient(105deg, #b77918 0%, #f5c54f 34%, #d39429 69%, #a86714 100%);
  box-shadow: inset 0 1px rgba(255, 255, 255, .62), 0 6px 18px rgba(0, 0, 0, .48);
  font-size: clamp(25px, 6.7vw, 32px);
  font-weight: 800;
  text-transform: uppercase;
}
body.setra-login-page.setra-login-only .login-btn:hover { filter: brightness(1.09); transform: translateY(-1px); }
body.setra-login-page.setra-login-only .login-btn span { grid-column: 1; }
body.setra-login-page.setra-login-only .login-btn svg { display: none; }

body.setra-login-page.setra-login-only .signup-prompt {
  position: relative;
  margin: 32px 0 0;
  padding-top: 29px;
  color: #f5f3ed;
  background: none;
  font-size: clamp(16px, 4vw, 19px);
  text-align: center;
}
body.setra-login-page.setra-login-only .signup-prompt::before {
  content: "";
  position: absolute;
  top: 0;
  left: 4%;
  right: 4%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #9e956f 12%, #9e956f 88%, transparent);
}
body.setra-login-page.setra-login-only .signup-prompt::after {
  content: "◆";
  position: absolute;
  top: -10px;
  left: calc(50% - 10px);
  padding: 0 7px;
  color: var(--rock-gold-light);
  background: #10100f;
  font-size: 16px;
  line-height: 20px;
}
body.setra-login-page.setra-login-only .signup-prompt a { display: block; margin-top: 13px; color: var(--rock-gold-light); font-size: clamp(23px, 6.2vw, 30px); font-weight: 700; text-decoration: none; text-transform: uppercase; }

body.setra-login-page.setra-login-only .login-security-note {
  margin: 35px auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  color: #d8d3c8;
  text-align: center;
}
body.setra-login-page.setra-login-only .security-shield { width: 47px; height: 54px; color: var(--rock-gold-light); }
body.setra-login-page.setra-login-only .security-shield svg { width: 43px; height: 50px; fill: none; stroke: currentColor; stroke-width: 1.45; }
body.setra-login-page.setra-login-only .login-security-note strong { font-size: clamp(13px, 3.6vw, 16px); font-weight: 400; }
body.setra-login-page.setra-login-only .login-security-note small { display: none; }

@media (max-width: 374px) {
  body.setra-login-page.setra-login-only .setra-login-shell { padding-inline: 14px; }
  body.setra-login-page.setra-login-only .setra-login-card { padding-inline: 18px; border-radius: 21px; }
  body.setra-login-page.setra-login-only .setra-field { height: 61px; }
  body.setra-login-page.setra-login-only .login-options { gap: 8px; }
}

/* Signup uses the same SCOTIA TRADING surface, with denser registration controls. */
body.setra-login-page.setra-login-only.setra-signup-page .signup-showcase {
  margin: 0 auto 22px;
  text-align: center;
}
body.setra-login-page.setra-login-only.setra-signup-page .signup-showcase > h1,
body.setra-login-page.setra-login-only.setra-signup-page .signup-showcase > p,
body.setra-login-page.setra-login-only.setra-signup-page .signup-compliance-badges,
body.setra-login-page.setra-login-only.setra-signup-page .signup-app-promo { display: none; }
body.setra-login-page.setra-login-only.setra-signup-page .login-brand { width: clamp(164px, 47vw, 210px); }

body.setra-login-page.setra-login-only.setra-signup-page .setra-signup-card {
  padding-top: clamp(27px, 6vw, 37px);
}
body.setra-login-page.setra-login-only.setra-signup-page .login-heading { display: block; margin-bottom: 24px; }
body.setra-login-page.setra-login-only.setra-signup-page .signup-field {
  height: 61px;
  margin-bottom: 11px;
}
body.setra-login-page.setra-login-only.setra-signup-page .signup-field-note,
body.setra-login-page.setra-login-only.setra-signup-page .signup-password-meta .password-field-note {
  margin: -1px 4px 10px 12px;
  color: #d7cbb0;
  font-size: 11px;
}
body.setra-login-page.setra-login-only.setra-signup-page .signup-password-meta {
  margin: -1px 3px 12px 12px;
}
body.setra-login-page.setra-login-only.setra-signup-page .generate-password-btn {
  border-color: rgba(234, 182, 65, .8);
  color: #fff0bd;
  background: rgba(72, 52, 17, .74);
  box-shadow: none;
}
body.setra-login-page.setra-login-only.setra-signup-page .signup-btn {
  height: 64px;
  margin-top: 2px;
  border-radius: 13px;
  color: #100d06;
  font-size: clamp(20px, 5.4vw, 27px);
}
body.setra-login-page.setra-login-only.setra-signup-page .signup-login-prompt { margin-top: 28px; }
body.setra-login-page.setra-login-only.setra-signup-page .signup-security-note { margin-top: 30px; }
