:root { --atbank-accent: var(--atbank-brand, var(--atbank-accent)); --atbank-accent-soft: var(--atbank-brand-soft, #e9f0ec); --bs-primary: var(--atbank-brand, var(--atbank-accent)); }
body.banking-user, body.banking-auth { color: #1d302a; background: #f3f6f3; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body.banking-user .sidebar { background: var(--atbank-brand-dark, var(--atbank-accent)); box-shadow: 10px 0 34px rgba(13, 42, 34, .08); }
body.banking-user .sidebar-header { min-height: 94px; padding: 24px 22px; border-bottom: 1px solid rgba(233,242,237,.12); }
body.banking-user .sidebar-logo { display: flex; align-items: center; min-height: 44px; }
body.banking-user .sidebar-logo img { display: block; width: 188px; max-height: 48px; object-fit: contain; object-position: left center; }
body.banking-user .sidebar .nav-label { color: #a7c0b3; font-size: .68rem; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
body.banking-user .sidebar .nav-link { border-radius: 9px; color: #e3eee7; font-weight: 560; transition: background .18s ease, color .18s ease; }
body.banking-user .sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.09); }
body.banking-user .sidebar .nav-link.active { color: var(--atbank-accent); background: #d7e7dc; box-shadow: inset 3px 0 var(--atbank-copper-400, #c6a858); }
body.banking-user .sidebar .nav-link i { color: inherit; }
body.banking-user .sidebar-footer { border-top: 1px solid rgba(233,242,237,.13); background: var(--atbank-brand-dark, var(--atbank-accent)); }
body.banking-user .header-main { min-height: 76px; border-bottom: 1px solid #e0e8e2; background: rgba(255,255,255,.94); }
body.banking-user .header-main .form-search .form-control { min-height: 42px; border: 1px solid #dce5df; border-radius: 8px; background: #f7f9f7; }
body.banking-user .main.main-app { min-height: calc(100vh - 76px); padding: clamp(24px, 3vw, 48px) !important; background: #f3f6f3; }
body.banking-user .main-title { color: var(--atbank-brand-dark, var(--atbank-accent)); font-size: clamp(1.65rem, 2.3vw, 2.35rem) !important; font-weight: 730; letter-spacing: -.035em; }
body.banking-user .card, body.banking-user .card-task { border: 1px solid #dce5df; border-radius: 14px; background: #fff; box-shadow: 0 12px 34px rgba(19, 53, 42, .055); }
body.banking-user .card-body { padding: clamp(20px, 2.4vw, 34px) !important; }
body.banking-user .btn-primary, body.banking-user .btn.btn-primary { border-color: var(--atbank-accent); border-radius: 8px; background: var(--atbank-accent); box-shadow: none; font-weight: 700; }
body.banking-user .btn-primary:hover, body.banking-user .btn.btn-primary:hover { border-color: var(--atbank-brand-hover, var(--atbank-accent)); background: var(--atbank-brand-hover, var(--atbank-accent)); }
body.banking-user .btn-outline-primary { border-color: #9eb9a9; border-radius: 8px; color: var(--atbank-brand-dark, var(--atbank-accent)); }
body.banking-user .btn-outline-primary:hover { border-color: var(--atbank-brand-dark, var(--atbank-accent)); background: var(--atbank-brand-dark, var(--atbank-accent)); }
body.banking-user .form-control, body.banking-user .form-select { min-height: 46px; border-color: #d2ded6; border-radius: 7px; color: #1d302a; background-color: #fff; }
body.banking-user .form-control:focus, body.banking-user .form-select:focus { border-color: var(--atbank-brand-hover, var(--atbank-accent)); box-shadow: 0 0 0 .2rem rgba(71,121,101,.16); }
body.banking-user .form-label { color: #344b41; font-weight: 650; }
body.banking-user .task-category { min-height: 232px; border: 1px solid #dce5df; border-radius: 13px; background: #fff !important; color: #1d302a; box-shadow: 0 12px 30px rgba(19,53,42,.05); transition: transform .18s ease, border-color .18s ease; }
body.banking-user .task-category:hover { transform: translateY(-3px); border-color: #94b6a2; }
body.banking-user .task-category h2, body.banking-user .task-category .category-percent { color: var(--atbank-brand-dark, var(--atbank-accent)); }
body.banking-user .transfer-option__icon { display: grid; width: 48px; height: 48px; margin-bottom: 20px; place-items: center; border-radius: 12px; color: var(--atbank-brand-dark, var(--atbank-accent)); background: #e9f0ec; }
body.banking-user .transfer-option__icon i { font-size: 1.35rem; }
/* Keep the transfer pictograms dark against their pale tiles. */
body.banking-transfer .transfer-option__icon,
body.banking-transfer .transfer-option__icon i { color: #123c32 !important; }
body.banking-transfer .transfer-option__icon { background: #e2eee7 !important; box-shadow: 0 5px 12px rgba(18, 60, 50, .12) !important; }
body.banking-user .transfer-option__desc, body.banking-user .transfer-option__cta { color: #61736d; }
body.banking-user .wire-wizard__notice { border-color: #d9e5dc; border-radius: 9px; background: #edf4ef; color: #244b3c; }
body.banking-user .wire-stepper li.is-current>span, body.banking-user .wire-stepper li.is-complete>span { border-color: var(--atbank-accent); background: var(--atbank-accent); }
body.banking-user .wire-stepper li.is-current strong { color: var(--atbank-accent); }
body.banking-user .wire-step-panel { border-radius: 10px; }
body.banking-user .wire-review-list>div { border-color: #e3ebe5; }
body.banking-user .wire-authorize-modal { border: 1px solid #dce5df; border-radius: 14px; }
body.banking-user .wire-authorize-modal .modal-header, body.banking-user .wire-authorize-modal .modal-footer { border-color: #e2eae4; }
body.banking-auth .auth-wrapper, body.banking-auth .login-wrapper { background: radial-gradient(ellipse at 80% 20%, rgba(96,145,116,.16), transparent 32%), #edf3ef; }
body.banking-auth .auth-card, body.banking-auth .login-card { border: 1px solid #dce5df; border-radius: 18px; box-shadow: 0 24px 70px rgba(16,47,39,.14); }
body.banking-user :focus-visible, body.banking-auth :focus-visible { outline: 3px solid var(--atbank-copper-400, #c6a858); outline-offset: 2px; }
@media (max-width: 991px) {
  body.banking-user .main.main-app { padding: 24px 18px !important; }
  body.banking-user .sidebar-logo img { width: 170px; }
}

/* The sign-in experience is an editorial split screen, separate from the legacy portal shell. */
body.banking-auth.banking-auth--split { min-height: 100vh; overflow-x: hidden; background: #f6f7f4; }
body.banking-auth.banking-auth--split > .row { min-height: 100vh; margin: 0; }
body.banking-auth.banking-auth--split .col-wrapper { display: flex; min-height: 100vh; align-items: center; justify-content: center; padding: clamp(28px, 6vw, 88px); background: #f6f7f4; }
body.banking-auth.banking-auth--split .card-sign { width: min(100%, 470px); margin: 0; padding: clamp(28px, 3.5vw, 52px); border: 1px solid #e1e6e1; border-radius: 4px; background: #fff; box-shadow: 0 24px 65px rgba(25,51,42,.09); }
body.banking-auth.banking-auth--split .card-sign .card-header, body.banking-auth.banking-auth--split .card-sign .card-body, body.banking-auth.banking-auth--split .card-sign .card-footer { padding: 0; border: 0; background: transparent; }
body.banking-auth.banking-auth--split .card-sign .header-logo { display: inline-flex; margin-bottom: 42px !important; }
body.banking-auth.banking-auth--split .card-sign .header-logo img { display: block; width: min(100%, 340px); height: auto; }
body.banking-auth.banking-auth--split .card-sign .card-title { margin-bottom: 10px; color: var(--atbank-brand-dark, var(--atbank-accent)); font-size: clamp(2.1rem, 3vw, 2.7rem); font-weight: 650; letter-spacing: -.055em; }
body.banking-auth.banking-auth--split .card-sign .card-text { margin-bottom: 30px; color: #687b72; font-size: .98rem; line-height: 1.65; }
body.banking-auth.banking-auth--split .card-sign .form-label { display: flex; justify-content: space-between; gap: 12px; color: #314a3e; font-size: .84rem; font-weight: 680; }
body.banking-auth.banking-auth--split .card-sign .form-label a { color: #26705a; font-size: .8rem; font-weight: 650; }
body.banking-auth.banking-auth--split .card-sign .form-control { min-height: 51px; padding-inline: 14px; border: 1px solid #d8e1db; border-radius: 4px; background: #fbfcfa; }
body.banking-auth.banking-auth--split .card-sign .btn-sign { width: 100%; min-height: 52px; margin-top: 9px; border: 0; border-radius: 4px; background: var(--atbank-accent); font-size: .95rem; font-weight: 700; }
body.banking-auth.banking-auth--split .card-sign .card-footer { margin-top: 27px; padding-top: 21px; border-top: 1px solid #e5ebe6; color: #687b72; font-size: .86rem; }
body.banking-auth.banking-auth--split .card-sign .card-footer a { color: #205b47; font-weight: 700; }
body.banking-auth.banking-auth--split .auth-visual { position: relative; display: flex !important; min-height: 100vh; align-items: flex-end; overflow: hidden; padding: clamp(38px, 7vw, 100px); background: var(--atbank-brand-dark, var(--atbank-accent)); }
body.banking-auth.banking-auth--split .auth-visual::after { position: absolute; inset: 0; content: ""; background: linear-gradient(0deg, rgba(12,37,30,.94), rgba(12,37,30,.18) 74%), linear-gradient(90deg, rgba(12,37,30,.24), transparent); }
body.banking-auth.banking-auth--split .auth-visual .auth-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.banking-auth.banking-auth--split .auth-visual__content { position: relative; z-index: 1; max-width: 610px; color: #fff; }
body.banking-auth.banking-auth--split .auth-visual__content>span { color: #e0ca88; font-size: .72rem; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
body.banking-auth.banking-auth--split .auth-visual__content h2 { max-width: 580px; margin: 17px 0; color: #fff; font-size: clamp(2.8rem, 5vw, 5.5rem); font-weight: 570; letter-spacing: -.06em; line-height: .98; }
body.banking-auth.banking-auth--split .auth-visual__content p { max-width: 470px; color: #d9e5dc; font-size: 1.02rem; line-height: 1.7; }
body.banking-auth.banking-auth--split .auth-visual__content small { display: inline-flex; align-items: center; gap: 9px; margin-top: 14px; color: #e7eee9; }
@media (min-width: 1200px) {
  body.banking-auth.banking-auth--split .row > .col-wrapper { flex: 0 0 43%; max-width: 43%; }
  body.banking-auth.banking-auth--split .row > .auth-visual { flex: 0 0 57%; max-width: 57%; }
}
@media (max-width: 767px) {
  body.banking-auth.banking-auth--split .col-wrapper { min-height: 100vh; padding: 22px; }
  body.banking-auth.banking-auth--split .card-sign { padding: 27px 23px; }
  body.banking-auth.banking-auth--split .card-sign .header-logo { margin-bottom: 32px !important; }
}