/*
 * auth-designs.css — login / signup designs (setting auth_design, App\Support\AuthDesigns).
 * One class on .auth-page: auth-d-classic | glass | soft | portal | bold | wave. Same markup, only looks change.
 * Every colour comes from the theme (--brand-primary / --brand-secondary), so each design follows the admin colours.
 * Also: the desktop showcase (.sc-*: phone with a live mini dashboard, team network, feature tiles).
 */

/* ---------- Shared ---------- */
.auth-page { position: relative; isolation: isolate; }
.auth-page > .auth-brand, .auth-page > .auth-main { position: relative; z-index: 1; }
.auth-bg, .auth-band, .auth-emblem-wrap, .auth-badge, .field-icon { display: none; }
.auth-bg { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.auth-bg > * { position: absolute; display: block; }
.auth-orb { border-radius: 50%; will-change: transform; animation: ad-drift 22s ease-in-out infinite alternate; }
.auth-grain {
  inset: 0; animation: ad-twinkle 5s ease-in-out infinite alternate;
  background-image: rgba(255, 255, 255, .7);
}
.auth-accent { color: inherit; }

/* Card designs (everything except Classic): centred card, centred heading, icons inside the fields */
.auth-page:not(.auth-d-classic) .auth-card h1,
.auth-page:not(.auth-d-classic) .auth-card > .auth-sub { text-align: center; }
.auth-page:not(.auth-d-classic) .auth-card h1 { font-size: clamp(1.7rem, 6vw, 2.15rem); }
.auth-page:not(.auth-d-classic) .auth-card .form-control,
.auth-page:not(.auth-d-classic) .auth-card .form-select {
  background-color: var(--f-bg, var(--surface-1)); border: var(--f-bw, 1px) solid var(--f-border, var(--border));
  border-radius: var(--f-radius, 12px); color: var(--f-text, var(--text-strong));
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.auth-page:not(.auth-d-classic) .auth-card .form-control:focus,
.auth-page:not(.auth-d-classic) .auth-card .form-select:focus { border-color: var(--f-focus, var(--brand-primary)); box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb), .18); }
.auth-page:not(.auth-d-classic) .auth-card .input-group > .form-floating > .form-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.auth-page:not(.auth-d-classic) .auth-card .input-group > .btn { border-radius: 0 var(--f-radius, 12px) var(--f-radius, 12px) 0; }
.auth-page:not(.auth-d-classic) .field-icon { display: block; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); z-index: 4; color: var(--f-icon, var(--text-muted)); font-size: 1.05rem; line-height: 1; pointer-events: none; }
.auth-page:not(.auth-d-classic) .has-icon > .form-control { padding-left: 2.85rem; }
.auth-page:not(.auth-d-classic) .has-icon > label { padding-left: 2.85rem; }
.auth-page:not(.auth-d-classic) .password-toggle { color: var(--f-icon, var(--text-muted)); }
.auth-page:not(.auth-d-classic) .auth-card .btn-lg { border-radius: var(--f-radius, 12px); font-weight: 700; }
.auth-page:not(.auth-d-classic) .auth-emblem-wrap { display: flex; flex-direction: column; align-items: center; gap: .5rem; margin-bottom: 1.1rem; }
.auth-emblem { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-family: var(--font-heading); font-weight: 800; overflow: hidden; }
.auth-emblem img { max-width: 78%; max-height: 62%; object-fit: contain; display: block; }
.auth-emblem .emblem-dark { display: none; }
[data-bs-theme="dark"] .auth-emblem.has-img .emblem-light { display: none; }
[data-bs-theme="dark"] .auth-emblem.has-img .emblem-dark { display: block; }
.auth-emblem-name { font-family: var(--font-heading); font-weight: 800; font-size: .95rem; letter-spacing: -.01em; color: var(--text-strong); }

/* Labels above the fields (Soft, Portal, Bold) */
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .form-floating { display: flex; flex-direction: column; }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .form-floating > label {
  position: static; order: -1; align-self: flex-start; width: auto; height: auto; padding: 0 0 .4rem !important; border: 0; text-align: left;
  transform: none !important; opacity: 1; white-space: normal; overflow: visible;
  font-size: .875rem; font-weight: 600; color: var(--f-label, var(--text-strong)) !important;
}
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .form-floating > .form-control {
  height: var(--f-height, 50px) !important; min-height: var(--f-height, 50px) !important; padding: .5rem 1rem !important;
}
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .has-icon > .form-control { padding-left: 2.85rem !important; }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .has-toggle > .form-control { padding-right: 2.9rem !important; }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .field-icon,
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .field-lock { top: auto; bottom: calc(var(--f-height, 50px) / 2); transform: translateY(50%); }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .password-toggle { top: auto; bottom: 0; height: var(--f-height, 50px); }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .phone-row { align-items: end; }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .phone-row .form-select { height: var(--f-height, 50px); }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .input-group { align-items: flex-end; }
:is(.auth-d-soft, .auth-d-portal, .auth-d-bold) .auth-card .input-group > .btn { height: var(--f-height, 50px); }

/* ---------- Classic: brand panel with the showcase (form side unchanged) ---------- */
.auth-d-classic .auth-brand-body { width: 100%; max-width: 32rem; }
.auth-d-classic .auth-brand h2 { font-size: clamp(1.7rem, 2.3vw, 2.3rem); }

/* ---------- Glass ---------- */
.auth-d-glass {
  --f-bg: rgba(255, 255, 255, .07); --f-border: rgba(255, 255, 255, .18); --f-text: #ffffff; --f-radius: 14px;
  --f-focus: rgba(var(--brand-primary-rgb), .95); --f-icon: rgba(255, 255, 255, .78);
  background: #05060c; color: #e8ecf4;
}
.auth-d-glass .auth-bg { display: block; background: #080915; }
.auth-d-glass .o1 { width: 62vmax; height: 62vmax; top: -26vmax; left: -18vmax; background: var(--brand-primary); }
.auth-d-glass .o2 { width: 52vmax; height: 52vmax; bottom: -22vmax; right: -16vmax; background: var(--brand-secondary); animation-duration: 28s; animation-direction: alternate-reverse; }
.auth-d-glass .o3 { width: 30vmax; height: 30vmax; top: 32%; left: 46%; background: transparent; animation-duration: 17s; }
@media (min-width: 992px) { .auth-d-glass.auth-page { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.auth-d-glass .auth-brand { background: none; }
.auth-d-glass .auth-brand::after { display: none; }
.auth-d-glass .auth-top { display: none; }
.auth-d-glass .auth-card {
  position: relative; max-width: 440px; padding: 2.1rem 1.5rem 1.6rem; border-radius: 28px;
  background: transparent;
  -webkit-backdrop-filter: blur(22px) saturate(150%); backdrop-filter: blur(22px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45), 0 0 50px -10px rgba(var(--brand-primary-rgb), .45);
  animation: ad-rise .7s cubic-bezier(.2, .9, .3, 1) both;
}
.auth-d-glass .auth-card::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1.5px; pointer-events: none;
  background: var(--brand-secondary);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
@media (min-width: 576px) { .auth-d-glass .auth-card { padding: 2.4rem 2.2rem 1.9rem; } }
.auth-d-glass .auth-emblem {
  width: 84px; height: 84px; border-radius: 50%; color: #ffffff; font-size: 2.1rem;
  background: var(--brand-secondary);
  box-shadow: 0 0 0 6px rgba(255, 255, 255, .06), 0 0 42px rgba(var(--brand-primary-rgb), .7);
  animation: ad-glow 3.5s ease-in-out infinite alternate;
}
.auth-d-glass .auth-emblem.has-img { background: rgba(255, 255, 255, .1); }
.auth-d-glass .auth-emblem-name { color: #ffffff; }
.auth-d-glass .auth-card h1 { color: #ffffff; }
.auth-d-glass .auth-card .auth-sub, .auth-d-glass .auth-switch { color: rgba(255, 255, 255, .74); }
.auth-d-glass .auth-card .form-floating > label { color: rgba(255, 255, 255, .7); }
.auth-d-glass .auth-card a, .auth-d-glass .auth-card .btn-link { color: color-mix(in srgb, var(--brand-primary) 45%, #ffffff); }
.auth-d-glass .auth-card .btn-primary {
  border: 0; background: var(--brand-secondary); color: #ffffff;
  box-shadow: 0 12px 30px -8px rgba(var(--brand-primary-rgb), .85), inset 0 1px 0 rgba(255, 255, 255, .35);
}
.auth-d-glass .auth-card .btn-primary:hover { filter: brightness(1.08); }
.auth-d-glass .auth-card .btn-outline-secondary,
.auth-d-wave .auth-card .btn-outline-secondary { border-radius: var(--f-radius, 12px); }
.auth-d-glass .auth-card .btn-outline-secondary { --bs-btn-bg: rgba(255, 255, 255, .06); --bs-btn-color: #ffffff; --bs-btn-border-color: rgba(255, 255, 255, .2); --bs-btn-hover-bg: rgba(255, 255, 255, .12); --bs-btn-hover-color: #ffffff; --bs-btn-hover-border-color: rgba(255, 255, 255, .3); }
.auth-d-glass .divider-text { color: rgba(255, 255, 255, .55); }
.auth-d-glass .divider-text::before, .auth-d-glass .divider-text::after { background: rgba(255, 255, 255, .18); }
.auth-d-glass .auth-foot { color: rgba(255, 255, 255, .5); }

/* ---------- Soft light ---------- */
.auth-d-soft {
  --f-bg: #f8fafc; --f-border: #dbe2ea; --f-text: #0f172a; --f-label: #0f172a; --f-radius: 12px; --f-icon: #64748b; --f-height: 50px;
  background: #f7f8fa;
}
.auth-d-soft .auth-bg { display: block; background: #f7f8fa; }
.auth-d-soft .o1 { width: 48vmax; height: 48vmax; top: -24vmax; left: -24vmax; background: transparent; animation: ad-breathe 9s ease-in-out infinite alternate; }
.auth-d-soft .o2 { width: 42vmax; height: 42vmax; bottom: -19vmax; right: -17vmax; background: transparent; animation: ad-breathe 11s ease-in-out infinite alternate-reverse; }
.auth-d-soft .o3 { width: 18vmax; height: 18vmax; top: 16%; right: 6%; background: transparent; }
.auth-d-soft.auth-page, .auth-d-portal.auth-page, .auth-d-wave.auth-page { grid-template-columns: minmax(0, 1fr); }
.auth-d-soft .auth-brand, .auth-d-portal .auth-brand, .auth-d-wave .auth-brand { display: none; }
.auth-d-soft .auth-top { display: none; }
.auth-d-soft .auth-card { max-width: 440px; animation: ad-rise .6s ease-out both; }
.auth-d-soft .auth-emblem { width: 76px; height: 76px; border-radius: 22px; background: var(--brand-primary); color: var(--brand-primary-contrast); font-size: 2rem; box-shadow: 0 16px 32px -12px rgba(var(--brand-primary-rgb), .7); }
.auth-d-soft .auth-emblem.has-img { background: #ffffff; border: 1px solid #e8edf2; }
.auth-d-soft .auth-card h1 { color: #0f172a; margin-top: .25rem; }
.auth-d-soft .auth-card > .auth-sub { color: #64748b; }
.auth-d-soft .auth-card > form:not(.auth-switch) { background: #ffffff; border: 1px solid #eef1f5; border-radius: 22px; padding: 1.5rem 1.3rem; box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 26px 60px -26px rgba(15, 23, 42, .22); }
@media (min-width: 576px) { .auth-d-soft .auth-card > form:not(.auth-switch) { padding: 1.75rem 1.75rem 1.6rem; } }
.auth-d-soft .auth-card .btn-primary { box-shadow: 0 14px 26px -12px rgba(var(--brand-primary-rgb), .75); }
.auth-d-soft .auth-card .btn-outline-secondary { --bs-btn-bg: #ffffff; --bs-btn-border-color: #dbe2ea; --bs-btn-color: #0f172a; --bs-btn-hover-bg: #f1f5f9; --bs-btn-hover-color: #0f172a; --bs-btn-hover-border-color: #cbd5e1; border-radius: 12px; }

/* ---------- Portal ---------- */
.auth-d-portal {
  --f-bg: #121215; --f-border: rgba(var(--brand-primary-rgb), .7); --f-bw: 1.5px; --f-text: #ffffff; --f-label: #f4f4f5;
  --f-radius: 12px; --f-icon: rgba(255, 255, 255, .78); --f-height: 52px;
  --portal-accent: color-mix(in srgb, var(--brand-primary) 78%, #ffffff);
  background: #0a0a0b; color: #e7e7ea;
}
.auth-d-portal .auth-bg { display: block; background: #0a0a0b; }
.auth-d-portal .o1 { width: 56vmax; height: 56vmax; top: -24vmax; left: -22vmax; background: var(--brand-primary); }
.auth-d-portal .o2 { width: 34vmax; height: 34vmax; top: 30%; right: -14vmax; background: transparent; animation-duration: 18s; animation-direction: alternate-reverse; }
.auth-d-portal .o3 { width: 44vmax; height: 44vmax; bottom: -26vmax; left: 10%; background: transparent; animation-duration: 26s; }
.auth-d-portal .auth-ring { width: 80vmax; height: 80vmax; right: -40vmax; bottom: -62vmax; border-radius: 50%; border: 2px solid rgba(var(--brand-primary-rgb), .55); box-shadow: 0 0 60px rgba(var(--brand-primary-rgb), .35), inset 0 0 60px rgba(var(--brand-primary-rgb), .2); animation: ad-breathe 8s ease-in-out infinite alternate; }
.auth-d-portal .auth-top .brand-logo { color: #ffffff; }
.auth-d-portal .auth-card {
  max-width: 440px; padding: 2rem 1.4rem 1.6rem; border-radius: 24px;
  background: rgba(18, 18, 20, .9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(var(--brand-primary-rgb), .55);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .6), 0 0 70px -24px rgba(var(--brand-primary-rgb), .75);
  animation: ad-rise .6s ease-out both;
}
@media (min-width: 576px) { .auth-d-portal .auth-card { padding: 2.3rem 2rem 1.9rem; } }
.auth-page.auth-d-portal .auth-emblem-wrap, .auth-page.auth-d-wave .auth-emblem-wrap { display: none; }
.auth-d-portal .auth-badge {
  display: flex; align-items: center; gap: .45rem; width: max-content; margin: 0 auto 1.15rem; padding: .42rem 1rem;
  border: 1.5px solid var(--portal-accent); border-radius: var(--radius-pill); color: var(--portal-accent);
  font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
  box-shadow: 0 0 20px -6px rgba(var(--brand-primary-rgb), .8);
}
.auth-d-portal .auth-card h1 { color: #ffffff; font-size: clamp(1.9rem, 7vw, 2.4rem); }
.auth-d-portal .auth-accent { color: var(--portal-accent); }
.auth-d-portal .auth-card .auth-sub, .auth-d-portal .auth-switch { color: rgba(255, 255, 255, .72); }
.auth-d-portal .auth-card .form-control { box-shadow: 0 0 16px -8px rgba(var(--brand-primary-rgb), .8); }
.auth-d-portal .auth-card a, .auth-d-portal .auth-card .btn-link { color: var(--portal-accent); }
.auth-d-portal .auth-card .btn-primary.btn-lg {
  position: relative; border: 0; border-radius: var(--radius-pill); text-align: left; padding-left: 1.6rem; padding-right: 3.6rem; font-size: 1.1rem; color: #ffffff;
  background: var(--brand-primary);
  box-shadow: 0 16px 34px -12px rgba(var(--brand-primary-rgb), .9);
}
.auth-d-portal .auth-card .btn-primary.btn-lg::after {
  content: "\F138"; font-family: "bootstrap-icons"; position: absolute; right: 6px; top: 50%; translate: 0 -50%;
  width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: #ffffff; color: #111111; font-size: 1.15rem; transition: transform .2s ease;
}
.auth-d-portal .auth-card .btn-primary.btn-lg:hover::after { transform: translateX(3px); }
.auth-d-portal .auth-card .btn-outline-secondary { --bs-btn-bg: transparent; --bs-btn-color: #ffffff; --bs-btn-border-color: rgba(255, 255, 255, .22); --bs-btn-hover-bg: rgba(255, 255, 255, .08); --bs-btn-hover-color: #ffffff; --bs-btn-hover-border-color: rgba(255, 255, 255, .35); border-radius: var(--radius-pill); }
.auth-d-portal .divider-text::before, .auth-d-portal .divider-text::after { background: rgba(255, 255, 255, .14); }

/* ---------- Bold ---------- */
.auth-d-bold {
  --f-bg: #ffffff; --f-border: #d6dce4; --f-text: #0f172a; --f-label: #0f172a; --f-radius: 12px; --f-icon: #475569; --f-height: 50px;
  background: #061026; background: color-mix(in srgb, var(--brand-primary) 12%, #040b1c); color: #e6ebf3;
}
.auth-d-bold .auth-bg { display: block; background: transparent; }
.auth-d-bold .auth-grain { opacity: .6; }
@media (min-width: 992px) { .auth-d-bold.auth-page { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.auth-d-bold .auth-brand { background: none; }
.auth-d-bold .auth-brand::after { display: none; }
.auth-d-bold .auth-top { display: none; }
.auth-d-bold .auth-card {
  max-width: 430px; padding: 2rem 1.4rem 1.7rem; border-radius: 26px; color: #0f172a;
  background: color-mix(in srgb, var(--brand-primary) 7%, #ffffff);
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .75), 0 0 0 1px rgba(255, 255, 255, .06);
  animation: ad-rise .6s ease-out both;
}
@media (min-width: 576px) { .auth-d-bold .auth-card { padding: 2.4rem 2.1rem 2rem; } }
.auth-d-bold .auth-emblem { width: 80px; height: 80px; border-radius: 22px; background: var(--brand-primary); color: var(--brand-primary-contrast); font-size: 2.1rem; box-shadow: 0 14px 30px -12px rgba(var(--brand-primary-rgb), .8); }
.auth-d-bold .auth-emblem.has-img { background: #ffffff; }
.auth-d-bold .auth-card h1 { color: #0f172a; }
.auth-d-bold .auth-card > .auth-sub, .auth-d-bold .auth-switch { color: #64748b; }
.auth-d-bold .auth-card .btn-primary { box-shadow: 0 14px 28px -14px rgba(var(--brand-primary-rgb), .9); }
.auth-d-bold .auth-card .btn-outline-secondary { --bs-btn-bg: #ffffff; --bs-btn-border-color: #d6dce4; --bs-btn-color: #0f172a; --bs-btn-hover-bg: #f1f5f9; --bs-btn-hover-color: #0f172a; border-radius: 12px; }
.auth-d-bold .auth-foot { color: rgba(255, 255, 255, .5); }

/* ---------- Wave ---------- */
.auth-d-wave { --f-bg: var(--surface-2); --f-border: var(--border); --f-radius: 14px; background: var(--surface-0); }
.auth-d-wave .auth-main { padding: 0 0 max(1rem, env(safe-area-inset-bottom)); }
.auth-d-wave .auth-band {
  position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem;
  min-height: 300px; padding: 3rem 1.5rem calc(92px + 1.5rem); text-align: center; color: #ffffff; /* bottom padding = card overlap + gap, so the tagline never slides under the card */
  background: var(--brand-primary);
  -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 79px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V40C1200 86 960 86 720 46S240 0 0 40Z'/%3E%3C/svg%3E") bottom / 100% 80px no-repeat;
  mask: linear-gradient(#000 0 0) top / 100% calc(100% - 79px) no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V40C1200 86 960 86 720 46S240 0 0 40Z'/%3E%3C/svg%3E") bottom / 100% 80px no-repeat;
}
@media (min-width: 992px) { .auth-d-wave .auth-band { min-height: 46vh; padding: 2.5rem 1.5rem calc(130px + 2rem); } }
.auth-d-wave .auth-band .brand-logo { position: relative; color: #ffffff; font-size: 1.35rem; }
.auth-d-wave .auth-band .brand-logo img { max-height: 46px; }
.auth-d-wave .auth-band .brand-mark { background: rgba(255, 255, 255, .2); color: #ffffff; }
.auth-d-wave .auth-band p { position: relative; margin: 0; max-width: 24rem; color: rgba(255, 255, 255, .88); font-weight: 500; }
.band-bubble { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .12); animation: ad-float 9s ease-in-out infinite alternate; }
.band-bubble.b1 { width: 160px; height: 160px; top: -50px; left: -40px; }
.band-bubble.b2 { width: 90px; height: 90px; top: 30%; right: 8%; animation-duration: 7s; animation-direction: alternate-reverse; }
.band-bubble.b3 { width: 50px; height: 50px; bottom: 34%; left: 22%; animation-duration: 11s; }
.auth-d-wave .auth-top { position: absolute; top: max(1rem, env(safe-area-inset-top)); right: 1rem; z-index: 3; }
.auth-d-wave .auth-top .brand-logo { display: none; }
.auth-d-wave .auth-top .btn { color: #ffffff; }
.auth-d-wave .auth-card {
  position: relative; z-index: 2; width: calc(100% - 2.5rem); max-width: 440px; margin: -92px auto 0; padding: 1.6rem 1.35rem;
  border-radius: 24px; background: var(--surface-1); box-shadow: 0 24px 60px -24px rgba(15, 23, 42, .35), 0 0 0 1px var(--border);
  animation: ad-rise .6s ease-out both;
}
@media (min-width: 576px) { .auth-d-wave .auth-card { padding: 2rem 1.9rem; } }
@media (min-width: 992px) { .auth-d-wave .auth-card { margin-top: -130px; } }
.auth-d-wave .auth-card .btn-primary { border: 0; background: var(--brand-primary); box-shadow: 0 14px 28px -14px rgba(var(--brand-primary-rgb), .9); }
.auth-d-wave .auth-foot { margin-top: 1rem; padding: 0 1rem; }

/* ---------- Showcase (desktop brand panel) ---------- */
.sc-stage { position: relative; height: clamp(300px, 50vh, 460px); margin-top: 2rem; }
.sc-phone {
  position: absolute; left: 50%; top: 0; height: 100%; aspect-ratio: 9 / 18.6; translate: -50% 0;
  padding: 3.2%; border-radius: 13% / 6.3%; background: #05080a; container-type: inline-size;
  box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .14), 0 40px 80px -24px rgba(0, 0, 0, .7), 0 0 70px -12px rgba(var(--brand-primary-rgb), .5);
  animation: sc-float 7s ease-in-out infinite;
}
.sc-notch { position: absolute; z-index: 2; top: 3.2%; left: 50%; translate: -50% 0; width: 32%; height: 3.2%; border-radius: 0 0 12px 12px; background: #05080a; }
.sc-screen { position: relative; height: 100%; overflow: hidden; display: flex; flex-direction: column; gap: 4.4cqw; padding: 13cqw 6cqw 0; border-radius: 11% / 5.4%; background: #101a1e; color: #e8eef0; font-size: 4.4cqw; text-align: left; }
.sc-top { display: flex; align-items: center; gap: 3cqw; }
.sc-top b { display: block; font-size: 4.4cqw; }
.sc-top small { display: block; color: rgba(255, 255, 255, .55); font-size: 3.4cqw; }
.sc-top > i { margin-left: auto; font-size: 5.4cqw; color: rgba(255, 255, 255, .7); }
.sc-avatar { width: 10cqw; height: 10cqw; border-radius: 50%; display: grid; place-items: center; background: var(--brand-primary); color: var(--brand-primary-contrast); font-weight: 800; font-size: 4.4cqw; }
.sc-balance { position: relative; overflow: hidden; padding: 5cqw 5cqw 0; border-radius: 6cqw; background: var(--brand-primary); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.sc-balance small { color: rgba(255, 255, 255, .72); font-size: 3.4cqw; }
.sc-balance strong { display: block; margin: 1cqw 0; font-family: var(--font-heading); font-size: 9.4cqw; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; color: #ffffff; }
.sc-up { font-size: 3.4cqw; color: #86efac; }
.sc-spark { display: block; width: calc(100% + 10cqw); height: 13cqw; margin: 2cqw -5cqw 0; }
.sc-spark path { fill: none; stroke: rgba(255, 255, 255, .9); stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 320; stroke-dashoffset: 320; animation: sc-draw 2.2s .4s ease-out forwards; }
.sc-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2cqw; text-align: center; font-size: 3.1cqw; color: rgba(255, 255, 255, .72); }
.sc-actions span { display: flex; flex-direction: column; align-items: center; gap: 1.5cqw; }
.sc-actions i { width: 11cqw; height: 11cqw; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .1); color: #ffffff; font-size: 4.6cqw; }
.sc-actions span:first-child i { background: var(--brand-primary); border-color: transparent; color: var(--brand-primary-contrast); box-shadow: 0 0 16px rgba(var(--brand-primary-rgb), .7); }
.sc-list { display: flex; flex-direction: column; gap: 2.4cqw; }
.sc-row { display: flex; align-items: center; gap: 3cqw; padding: 3cqw; border-radius: 4cqw; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .06); opacity: 0; animation: sc-in .6s var(--d) ease-out forwards, sc-blink 6s calc(var(--d) + 1.5s) ease-in-out infinite; }
.sc-row > i { width: 9cqw; height: 9cqw; flex-shrink: 0; border-radius: 3cqw; display: grid; place-items: center; background: rgba(var(--brand-primary-rgb), .25); color: #ffffff; font-size: 4.2cqw; }
.sc-row b { display: block; font-size: 3.7cqw; }
.sc-row small { display: block; color: rgba(255, 255, 255, .5); font-size: 3cqw; }
.sc-row em { margin-left: auto; font-style: normal; font-weight: 700; color: #4ade80; font-size: 3.7cqw; }
.sc-nav { display: flex; justify-content: space-around; align-items: center; margin: auto -6cqw 0; padding: 3.5cqw 4cqw 5cqw; background: rgba(255, 255, 255, .04); border-top: 1px solid rgba(255, 255, 255, .06); color: rgba(255, 255, 255, .5); font-size: 5cqw; }
.sc-nav i:first-child { color: #ffffff; }
.sc-nav i:nth-child(3) { color: var(--brand-primary); font-size: 8cqw; }
.sc-chip {
  position: absolute; z-index: 2; display: flex; align-items: center; gap: .6rem; padding: .55rem .85rem .55rem .55rem;
  border-radius: 14px; background: rgba(255, 255, 255, .1); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 14px 30px -12px rgba(0, 0, 0, .55);
  color: #ffffff; font-size: .75rem; line-height: 1.25; white-space: nowrap; text-align: left;
  animation: sc-pop .6s ease-out both, sc-bob 6s ease-in-out infinite;
}
.sc-chip > i { width: 30px; height: 30px; flex-shrink: 0; border-radius: 9px; display: grid; place-items: center; background: var(--brand-primary); color: var(--brand-primary-contrast); font-size: .95rem; }
.sc-chip b { display: block; font-size: .8125rem; }
.sc-chip small { display: block; color: rgba(255, 255, 255, .66); }
.sc-login .c1 { top: 12%; left: 0; animation-delay: .8s, 0s; }
.sc-login .c2 { top: 46%; right: 0; animation-delay: 1.1s, -2s; }
.sc-login .c3 { bottom: 9%; left: 4%; animation-delay: 1.4s, -4s; }
@media (max-height: 720px) { .sc-login .c2 { display: none; } }

.sc-network { height: auto; }
.sc-tree { display: block; width: 100%; height: auto; overflow: visible; color: var(--brand-primary); }
.sc-link { stroke: rgba(255, 255, 255, .3); stroke-width: 1.5; stroke-dasharray: 260; stroke-dashoffset: 260; animation: sc-draw 1.2s var(--d) ease-out forwards; }
.sc-pulse { fill: #ffffff; filter: drop-shadow(0 0 4px var(--brand-primary)) drop-shadow(0 0 2px #ffffff); }
.sc-node { opacity: 0; transform-box: fill-box; transform-origin: center; animation: sc-node .55s var(--d) cubic-bezier(.2, 1.4, .4, 1) forwards; }
.sc-node circle { fill: rgba(255, 255, 255, .1); stroke: rgba(255, 255, 255, .45); stroke-width: 1.5; }
.sc-node.root circle { fill: var(--brand-primary); stroke: rgba(255, 255, 255, .85); stroke-width: 2; }
.sc-node.l1 circle { fill: rgba(var(--brand-primary-rgb), .45); }
.sc-node text { fill: #ffffff; font: 700 12px var(--font-heading); text-anchor: middle; }
.sc-node.root text { fill: var(--brand-primary-contrast); font-size: 13px; }
.sc-root-glow { animation: sc-glow 3s ease-in-out infinite alternate; }
.sc-network .sc-chip.c1 { top: -2%; left: -2%; animation-delay: 1.8s, 0s; }
.sc-network .sc-chip.c2 { top: 58%; right: -4%; animation-delay: 2.1s, -2s; }
.sc-network .sc-chip.c3 { top: -2%; right: -2%; animation-delay: 2.4s, -4s; }
.sc-pulse { opacity: 0; animation: sc-show .4s 1.4s forwards; }
.sc-steps { display: flex; gap: .5rem; list-style: none; margin: 1.5rem 0 0; padding: 0; }
.sc-steps li { flex: 1; display: flex; align-items: center; gap: .5rem; padding: .6rem .7rem; border-radius: 12px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .86); font-size: .8rem; line-height: 1.2; opacity: 0; animation: sc-in .5s ease-out forwards; }
.sc-steps li:nth-child(1) { animation-delay: 1.6s; }
.sc-steps li:nth-child(2) { animation-delay: 1.8s; }
.sc-steps li:nth-child(3) { animation-delay: 2s; }
.sc-steps span { width: 22px; height: 22px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; background: var(--brand-primary); color: var(--brand-primary-contrast); font-weight: 700; font-size: .75rem; }

.sc-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; margin-top: 2rem; }
.sc-tile { display: flex; flex-direction: column; gap: .25rem; padding: 1.15rem; border-radius: 18px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); opacity: 0; animation: sc-in .6s var(--d) ease-out forwards; transition: transform .25s ease, border-color .25s ease; }
.sc-tile:hover { transform: translateY(-3px); border-color: rgba(var(--brand-primary-rgb), .6); }
.sc-tile i { width: 44px; height: 44px; margin-bottom: .45rem; border-radius: 13px; display: grid; place-items: center; background: var(--brand-primary); color: var(--brand-primary-contrast); font-size: 1.25rem; box-shadow: 0 10px 24px -8px rgba(var(--brand-primary-rgb), .8); }
.sc-tile b { color: #ffffff; }
.sc-tile small { color: rgba(255, 255, 255, .62); }

/* ---------- Motion (kept on every device, like the rest of the site) ---------- */
@keyframes ad-drift { from { transform: translate(0, 0) scale(1); } to { transform: translate(6vmax, 4vmax) scale(1.12); } }
@keyframes ad-breathe { from { transform: scale(1); opacity: .85; } to { transform: scale(1.08); opacity: 1; } }
@keyframes ad-float { from { transform: translateY(0); } to { transform: translateY(-16px); } }
@keyframes ad-twinkle { from { opacity: .35; } to { opacity: .9; } }
@keyframes ad-glow { from { box-shadow: 0 0 0 6px rgba(255, 255, 255, .06), 0 0 30px rgba(var(--brand-primary-rgb), .5); } to { box-shadow: 0 0 0 8px rgba(255, 255, 255, .08), 0 0 56px rgba(var(--brand-primary-rgb), .85); } }
@keyframes ad-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes sc-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes sc-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes sc-pop { from { opacity: 0; scale: .85; } to { opacity: 1; scale: 1; } }
@keyframes sc-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes sc-draw { to { stroke-dashoffset: 0; } }
@keyframes sc-node { from { opacity: 0; transform: scale(.3); } to { opacity: 1; transform: scale(1); } }
@keyframes sc-glow { from { opacity: .45; } to { opacity: 1; } }
@keyframes sc-blink { 0%, 86%, 100% { background: rgba(255, 255, 255, .05); } 92% { background: rgba(var(--brand-primary-rgb), .22); } }
@keyframes sc-show { to { opacity: 1; } }

/* ---------- Pratham Value showcase: member photo + orbiting operator logos ---------- */
.pv-stage { height: clamp(340px, 56vh, 520px); isolation: isolate; }
.pv-halo { position: absolute; left: 50%; top: 50%; width: min(78%, 360px); aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; z-index: -2;
  background: var(--brand-secondary);
  box-shadow: 0 0 110px 12px rgba(var(--brand-primary-rgb), .35); animation: pv-breathe 6s ease-in-out infinite; }
.pv-ring { position: absolute; left: 50%; top: 50%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; z-index: -1; }
.pv-ring.r1 { width: min(96%, 450px); border: 2px dashed rgba(var(--brand-secondary-rgb), .5); animation: pv-spin 50s linear infinite; }
.pv-ring.r2 { width: min(112%, 530px); border: 1px solid rgba(255, 255, 255, .1); }
.pv-person { position: absolute; left: 50%; bottom: 0; height: 100%; width: auto; max-width: 80%; translate: -50% 0; object-fit: contain;
  filter: drop-shadow(0 28px 40px rgba(0, 0, 0, .45)); -webkit-mask-image: linear-gradient(180deg, #000 80%, transparent); mask-image: linear-gradient(180deg, #000 80%, transparent);
  animation: pv-rise .9s ease-out both; }
.pv-mark { position: absolute; left: 6%; top: 4%; width: 78px; height: 78px; border-radius: 50%; z-index: 3; box-shadow: 0 14px 34px -8px rgba(var(--brand-secondary-rgb), .7); animation: pv-float 5s ease-in-out infinite; }
.pv-orbit { position: absolute; left: 50%; top: 50%; width: min(96%, 450px); aspect-ratio: 1; translate: -50% -50%; z-index: 2; animation: pv-spin 24s linear infinite; pointer-events: none; }
.pv-op { position: absolute; left: 50%; top: 50%; width: 0; height: 0; }
.pv-orbit .pv-op { transform: rotate(calc(360deg / var(--n) * var(--i) - 20deg)) translateX(225px); }
.pv-op-in { position: absolute; left: -32px; top: -32px; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: #ffffff;
  box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .55), 0 0 0 4px rgba(255, 255, 255, .25);
  transform: rotate(calc(20deg - 360deg / var(--n) * var(--i))); animation: pv-counter 24s linear infinite; }
.pv-op-in img { width: 84%; height: 84%; object-fit: contain; border-radius: 50%; }
.pv-ticket { position: absolute; left: 0; bottom: 14%; z-index: 3; display: grid; gap: .1rem; min-width: 190px; padding: .7rem .9rem; border-radius: 16px; color: #ffffff;
  background: var(--brand-primary); box-shadow: 0 18px 36px -14px rgba(var(--brand-primary-rgb), .8);
  -webkit-mask: radial-gradient(circle at 0 62%, transparent 9px, #000 10px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 62%, transparent 9px, #000 10px) right / 51% 100% no-repeat;
  mask: radial-gradient(circle at 0 62%, transparent 9px, #000 10px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 62%, transparent 9px, #000 10px) right / 51% 100% no-repeat;
  text-align: left; animation: sc-pop .6s .8s ease-out both, sc-bob 6s ease-in-out infinite; }
.pvt-no { font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; opacity: .85; font-weight: 700; }
.pv-ticket b { font-family: var(--font-heading); font-size: 1rem; }
.pvt-badge { justify-self: start; display: inline-flex; align-items: center; gap: .35rem; margin-top: .35rem; padding: .2rem .55rem; border-radius: 999px; font-size: .7rem; font-weight: 800; background: #ffffff; color: var(--brand-primary); }
.pvt-dot { width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; animation: pv-dot 1.4s ease-in-out infinite; }
.pv-stage .pv-c1 { top: 8%; right: 0; animation-delay: .7s, 0s; }
.pv-stage .pv-c2 { top: 40%; right: -2%; animation-delay: 1s, -2s; }
.pv-stage .pv-c3 { bottom: 4%; right: 4%; animation-delay: 1.3s, -4s; }
.pv-login .pv-c2 { top: 22%; }
.pv-register { margin-bottom: 4rem; }
.pv-steps { position: absolute; left: 0; right: 0; bottom: -4rem; z-index: 3; }
@keyframes pv-spin { to { rotate: 360deg; } }
@keyframes pv-counter { to { rotate: -360deg; } }
@keyframes pv-breathe { 0%, 100% { scale: 1; } 50% { scale: 1.05; } }
@keyframes pv-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes pv-rise { from { opacity: 0; translate: -50% 24px; } to { opacity: 1; translate: -50% 0; } }
@keyframes pv-dot { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }

.auth-brand .brand-logo img, .auth-mobile-brand .brand-logo img { max-height: 58px; max-width: 290px; }

.pv-halo { box-shadow: none; }

/* ---------- Phone app look (owner 2026-11-01): Classic on phones / tablets ----------
   Flat brand header (about 1/3 of the screen) with the brand mark and orbiting operator logos,
   then a bottom sheet with rounded top corners holding the form (Android app style).
   Wave keeps its own band and shows the logo chip. No gradients (owner rule). */
.band-stage, .band-title, .auth-tabs { display: none; }
.auth-band .band-logo { position: relative; z-index: 1; display: inline-flex; padding: .55rem 1.1rem; border-radius: 18px; background: #ffffff; box-shadow: 0 14px 30px -14px rgba(0, 0, 0, .45); }
.auth-band .band-logo .brand-logo img { max-height: 44px; max-width: 200px; }
.auth-band .band-logo .logo-dark { display: none !important; }
.auth-band .band-logo .logo-light { display: block !important; }
.band-bubble { animation: none; }

.band-stage { position: relative; z-index: 1; width: 172px; height: 172px; flex: none; }
.band-ring { position: absolute; inset: 0; border-radius: 50%; border: 1.5px dashed rgba(255, 255, 255, .5); animation: band-spin 40s linear infinite; }
.band-ring::after { content: ""; position: absolute; inset: 22%; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .18); }
.band-orbit { position: absolute; inset: 0; animation: band-spin 16s linear infinite; }
.band-op { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform: rotate(calc(360deg / var(--n) * var(--i) - 90deg)) translateX(86px); }
.band-op-in { position: absolute; left: -22px; top: -22px; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #ffffff;
  box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .55), 0 0 0 3px rgba(255, 255, 255, .22);
  transform: rotate(calc(90deg - 360deg / var(--n) * var(--i))); animation: band-counter 16s linear infinite; }
.band-op-in img { width: 84%; height: 84%; object-fit: contain; border-radius: 50%; }
.band-mark { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%; padding: 5px; background: #ffffff; box-shadow: 0 16px 34px -14px rgba(0, 0, 0, .55); }
.band-mark img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; display: block; }
.band-mark::after { content: ""; position: absolute; inset: -7px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .55); animation: band-pulse 2.6s ease-out infinite; }
@keyframes band-spin { to { rotate: 360deg; } }
@keyframes band-counter { to { rotate: -360deg; } }
@keyframes band-pulse { from { opacity: .9; scale: 1; } to { opacity: 0; scale: 1.35; } }
@media (prefers-reduced-motion: reduce) { .band-ring, .band-orbit, .band-op-in, .band-mark::after { animation: none; } }

@media (max-width: 991.98px) {
  .auth-d-classic { background: var(--surface-1); }
  .auth-d-classic .auth-main { padding: 0; min-height: 100vh; min-height: 100dvh; }

  /* Header */
  .auth-d-classic .auth-band {
    position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem;
    padding: max(1.1rem, env(safe-area-inset-top)) 1rem 2.6rem; text-align: center; color: #ffffff; background: var(--brand-primary);
  }
  .auth-d-classic .band-bubble { display: block; position: absolute; border-radius: 50%; }
  .auth-d-classic .band-bubble.b1 { width: 230px; height: 230px; top: -110px; left: -80px; background: rgba(255, 255, 255, .08); }
  .auth-d-classic .band-bubble.b2 { width: 150px; height: 150px; top: auto; bottom: -40px; right: -60px; left: auto; background: var(--brand-secondary); }
  .auth-d-classic .band-bubble.b3 { width: 14px; height: 14px; top: 22%; bottom: auto; left: 16%; right: auto; background: var(--brand-secondary); }
  .auth-d-classic .band-stage { display: block; margin-bottom: .55rem; }
  .auth-d-classic .band-logo { display: none; }
  .auth-d-classic .band-title { display: block; position: relative; z-index: 1; font-family: var(--font-heading); font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
  .auth-d-classic .auth-band p { position: relative; z-index: 1; margin: 0; font-size: .85rem; font-weight: 500; color: rgba(255, 255, 255, .85); }
  .auth-d-classic .auth-top { position: absolute; top: max(.6rem, env(safe-area-inset-top)); left: .6rem; right: .6rem; z-index: 3; justify-content: flex-end; }
  .auth-d-classic .auth-top .brand-logo { display: none; }
  .auth-d-classic .auth-top .btn { color: #ffffff; background: rgba(255, 255, 255, .14); border-radius: 50%; }

  /* Bottom sheet */
  .auth-d-classic .auth-card {
    position: relative; z-index: 2; flex: 1 0 auto; width: 100%; max-width: none; margin: -1.75rem 0 0;
    padding: 1.9rem max(1.25rem, calc((100% - 440px) / 2)) 1.25rem;
    border-radius: 28px 28px 0 0; background: var(--surface-1); box-shadow: 0 -12px 30px -20px rgba(0, 0, 0, .5);
    animation: ad-rise .45s ease-out both;
  }
  .auth-d-classic .auth-card::before { content: ""; position: absolute; top: .65rem; left: 50%; width: 42px; height: 4px; margin-left: -21px; border-radius: 4px; background: var(--border-strong); }
  .auth-d-classic .auth-card h1 { font-size: 1.55rem; margin-bottom: .25rem; }
  .auth-d-classic .auth-card .auth-sub { margin-bottom: 1.25rem; font-size: .9rem; }
  .auth-d-classic .auth-accent { color: var(--brand-primary-text, var(--brand-primary)); }

  /* Segmented tabs */
  .auth-d-classic .auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; margin-bottom: 1.35rem; border-radius: 14px; background: var(--surface-2); }
  .auth-d-classic .auth-tabs a { display: flex; align-items: center; justify-content: center; height: 40px; border-radius: 11px; font-size: .9rem; font-weight: 600; color: var(--text-muted); text-decoration: none; transition: background-color .2s ease, color .2s ease; }
  .auth-d-classic .auth-tabs a.is-active { background: var(--surface-1); color: var(--text-strong); box-shadow: 0 2px 8px -3px rgba(15, 23, 42, .3); }

  /* Fields: filled, rounded, icon inside */
  .auth-d-classic .auth-card .form-control, .auth-d-classic .auth-card .form-select { min-height: 54px; border-radius: 14px; background-color: var(--surface-2); border: 1.5px solid transparent; }
  .auth-d-classic .auth-card .form-floating > .form-control { height: 56px; }
  .auth-d-classic .auth-card .form-control:focus, .auth-d-classic .auth-card .form-select:focus { background-color: var(--surface-1); border-color: var(--brand-primary); box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb), .14); }
  .auth-d-classic .auth-card .form-control.is-invalid { border-color: var(--bs-form-invalid-border-color, #dc3545); }
  .auth-d-classic .field-icon { display: block; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); z-index: 4; color: var(--text-muted); font-size: 1.1rem; line-height: 1; pointer-events: none; }
  .auth-d-classic .has-icon > .form-control { padding-left: 2.9rem; }
  .auth-d-classic .has-icon > label { padding-left: 2.9rem; }
  .auth-d-classic .form-floating > label::after { background: transparent !important; }
  .auth-d-classic .auth-card .input-group > .form-floating > .form-control { border-radius: 14px 0 0 14px; }
  .auth-d-classic .auth-card .input-group > .btn { border-radius: 0 14px 14px 0; }

  /* Buttons */
  .auth-d-classic .auth-card .btn-lg { min-height: 54px; border-radius: 16px; font-weight: 700; font-size: 1rem; }
  .auth-d-classic .auth-card .btn-primary { border: 0; background: var(--brand-primary); box-shadow: 0 14px 26px -14px rgba(var(--brand-primary-rgb), .9); }
  .auth-d-classic .auth-card .btn-outline-secondary { min-height: 52px; border-radius: 16px; }
  .auth-d-classic .auth-switch { margin-top: 1.25rem; }
  .auth-d-classic .auth-foot { padding: .5rem 1rem max(1rem, env(safe-area-inset-bottom)); background: var(--surface-1); }
}
@media (max-width: 991.98px) {
  .auth-d-classic .auth-band { padding-top: max(2.1rem, calc(env(safe-area-inset-top) + 1.4rem)); }
  .auth-d-classic .band-bubble.b2 { width: 130px; height: 130px; bottom: -58px; right: -64px; }
}