@layer base,component,page;@layer base{:root{--primary-color: #008288;--light-text-color: #545f7a;--dark-color: #0f1b2d;--light-surface-color: #f2f2f2;--light-border-color: #dae1f2}*,*:before,*:after{box-sizing:border-box}body{font-family:system-ui;margin:0}input,textarea,button,select{font:inherit}.ax-button{all:unset;outline:revert;box-sizing:border-box}}@layer component{.container{max-width:800px;margin-inline:auto;padding-inline:20px}}@layer component{.sr-only,.sr-only-focusable:not(:focus):not(:focus-within){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}@layer component{.avatar{border-radius:50%}}@layer component{.title--lg{font-size:1.875rem}.title{font-size:1.125rem;font-weight:600;letter-spacing:.3px}.text--dimmed{font-size:.875;color:var(--light-text-color)}}@layer component{.btn{display:inline-block;text-align:center;padding:.5em 1em;border-radius:5px;letter-spacing:.6px;text-decoration:none;cursor:pointer;transition:translate .3s,opacity .3s}.btn:hover{opacity:.8}.btn:active{translate:1px 1px}.btn--raised{background-color:var(--primary-color);color:#fff}.btn--link{color:var(--primary-color)}.btn--block{display:block;margin-inline:auto;width:100%;max-width:800px}}@layer component{.input{display:block;width:100%;border:2px solid var(--light-border-color);border-radius:5px;padding:10px}.input-search{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/magnifier-63804ec7.svg);background-repeat:no-repeat;background-position:5px center;padding-left:35px}label{display:block;margin-bottom:14px;color:var(--light-text-color);font-size:.875rem}.form-buttons{display:grid;gap:15px}.form-line{margin-bottom:24px}}@layer component{.items{list-style-type:none;padding-inline:0px}.item{display:flex;align-items:center;gap:16px;padding-inline:10px;padding-block:15px;background-image:url(/LearnHTMLCSS-Fake-Bank/assets/chevron-right-f4979605.svg);background-repeat:no-repeat;background-position:right;background-origin:content-box;text-decoration:none;transition:opacity .3s}.item:hover{opacity:.8}.items li:not(:last-child) .item{border-bottom:1px solid var(--light-border-color)}.item--name{flex:1;color:var(--dark-color)}.item-name-contact,.item-name-phone{color:var(--light-text-color);margin:0}.item-name-contact{margin-bottom:8px}.item-name-phone{font-size:.875rem}}@layer component{.entry{display:flex;align-items:center;gap:16px;padding:15px 0}.entry--details{flex:1}.entry-name{font-weight:700;margin-top:0;margin-bottom:6px}.entry-description{font-size:.875rem;margin:0;color:var(--light-text-color)}.entry-value{font-weight:700;color:var(--dark-color);letter-spacing:1px}}@layer component{#slider{display:grid;grid-template-columns:repeat(3,100%);place-items:center;overflow-x:scroll;scroll-snap-type:x mandatory}.slide{scroll-snap-align:center}}@layer component{#dots{margin-block:20px;display:flex;justify-content:center;gap:16px}.dot{border:1px solid var(--primary-color);width:13px;height:13px;border-radius:50%;transition:background-color .8s,scale .4s}.dot:hover{opacity:.8}.active{background-color:var(--primary-color);scale:1.5}}@layer component{#header{display:flex;align-items:center;justify-content:center;position:relative}#header .back{position:absolute;left:0;display:inline-block;background-image:url(/LearnHTMLCSS-Fake-Bank/assets/back-5ecd91c8.svg);background-repeat:no-repeat;width:30px;height:24px}}@layer component{#app-header{position:relative;background-color:var(--primary-color);color:#fff;padding-block:20px 40px}#app-header h1{font-size:1.125rem;font-weight:400;text-align:center;margin-top:0}}@layer component{#layout-page-overlay{background-color:#fff;border-top-left-radius:12px;border-top-right-radius:12px;margin-top:-20px;padding-top:10px;box-shadow:0 -5px 10px #0006;position:relative}.layout-subpage{display:flex;justify-content:space-between;align-items:center}}@layer component{#nav-spacer{height:70px}.bottom-nav{position:fixed;bottom:0;width:100%;background-color:#fff;padding-inline:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;box-shadow:0 -3px 10px #0000004d}.nav-item{display:flex;flex-direction:column-reverse;align-items:center;padding-block:20px;transition:opacity .3s;text-decoration:none;color:var(--primary-color)}.nav-item:hover{opacity:.8}@media (max-width: 465px){.nav-item .nav-item-text{position:absolute;clip:rect(1px 1px 1px 1px)}}}@layer component{#pills{list-style:none;padding-left:0;display:flex;justify-content:space-between;align-items:center}#pills .pill{background-color:var(--light-surface-color);padding:10px 20px;border-radius:40px}#pills .pill.active{background-color:var(--primary-color);color:#fff;scale:1}}@layer component{#cards{display:grid;grid-auto-columns:75%;grid-auto-flow:column;grid-template-rows:clamp(150px,10vw,300px);gap:16px;overflow-x:scroll;scroll-snap-type:x mandatory;scroll-behavior:smooth}#cards::-webkit-scrollbar{height:15px}#cards::-webkit-scrollbar-thumb{border-radius:10px;background-color:#fff;box-shadow:inset 0 0 6px #0009}#cards::-webkit-scrollbar-track{background-color:transparent}.card{scroll-snap-align:center;scroll-snap-stop:always;background-color:var(--dark-color);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADcAAAAiCAYAAAD7wEFuAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAPpSURBVHgB3ZnPchNHEMa/mV0J2QKXbCBRYlcQSao45GDdc0B5guQNQJUHCH4CS08Q+QlkniB+AysHLpzsA3BkizL/MQjb8hpJu033yhKSLVm7uCmq+FWpdmtnanY/9Uz3TLdBAh4jl8sie9sCywCVAJMjICdtBmjy/Rb/tglh4xB+4zqazWlj+vWlEoVUtJZuEqFIPKY5HpPf4cEYj59vG2M2Zso7DSTAxOn0HEslF7TKtyUkgAdf7yCo/oAX3sk2v754my+3QInG9Lh/AzaozpRPjznm/ZN5jnzBhVNHQlFjqLloVefZkmIpEMmYBXwmMkuModqF8rPqlH7j2cXSPwSq0GCKnA9+kTdXa28Ec+k70IOnbfDHJCuOFbeLH1dDmAqUMOkQl35/h/TPbXRuzCO4koEiEwXakw+0hQmRsJ+OgG6I1INd2OYHKFIAOZt+PV842TAiTqaitrDZ5f2esCHSD97CHAVQJBJI9dzIEhqIE+cRgmpQJPPrIWaLe6cb2IJptqAyBR/Z1eEHA3EpuP9CmdnlvYlt5qAD92kLmhjCncgbHxOJe81xjD3jX1BErGYvnj31XG8Phq2oCtHAepE4A1qFMmdZbQALc176UKbUt56VtUbnD9IjpPIfplqtj32jLo6N15uF1oFTgjKZXw5j95WwoD01rWzr5MobVdW1JjgL7UT97e4RNJFdlcQ9yyqvQRl3oZuov3LM6xE6JcvOpABF4q61YcxRsj8jDmI9q7UxPg+mS9DG8LnQ4hvGytkIXxlyY52Zk40Jaoq39KBIeOAgKZRxoQ1R6FneLG9Dme7bZB8bZlPQJuV0PZmWW1Cm8zLZYZQuqovz0uXXWzaF1DqUaT+JLy7MXeBpmXwqnwVbrBFd5+E12XoNKNJ5wR/cjuckgu9noQ0fuO/KNQoF7FSqUMZ/dGlqH7FYkNcVJ7nTfn4zEncVOw1t6/kPs1M9Z/faHLTh5O1K/34QxDl5WtaMedS22L83P7n9C1iN19r6cFZ6IE6ywnzwUJ2esvb8R9lTzyVot5evQhkvjdbK8IOR7dd3eMoJIt3117qfi0QO0/ntsraHjHKXpjxamzi1t+T1V9EWuLe5EIUHsVjnRi5y/4rET8oKIpC9zgqUkPX3fvOy1168shbks9BCqj+J0+l9eoUQ9z8epojzfASw1kKrcl2pEEJSCCGzNvP3TuWsfrEi7SssSk3uVsJEktTr7gYIahNLWATJuhUQk76ojD2onVxf40h01hBLSkLJwvxJvRO8/I6Lj+TxZkAE/c9/xNY+Whtxio8H9cUi795L1pqb/PkFKUB+aiWP45bU5LbpM4qPHwEQ3Ynl/3Z9CwAAAABJRU5ErkJggg==);background-repeat:no-repeat;background-size:30px;background-position:left 20px top 20px;border-radius:10px;padding:20px;display:flex;flex-direction:column;justify-content:flex-end}.card:nth-child(2n){background-color:#fff;color:#000}.card-amount{font-size:1.375rem;font-weight:700}.card-details{display:flex;justify-content:space-between}.card-type,.card-last4{margin-bottom:0;font-size:.8125rem}.card-type{opacity:.8}.hidden-digits{letter-spacing:1px}}@layer component{.actions-grid{display:grid;grid-template-columns:repeat(4,1fr);padding-block:20px}.action{width:24px;height:24px;background-repeat:no-repeat;background-position:center;padding:25px;margin-bottom:10px;cursor:pointer;border-radius:10px;box-shadow:0 0 3px #0000004d;transition:opacity .2s}.action:hover{opacity:.8}.actions-grid div{text-align:center}.label-action{margin-bottom:0}#top-up-btn{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/arrow-up-0b6cace6.svg)}#send-to-btn{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/arrow-right-2cfc9173.svg)}#add-card-btn{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/add-6cc1729b.svg)}#exchange-btn{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/exchange-10ae0b35.svg)}}@layer page{#onboarding-layout{display:grid;height:100vh;height:100dvh;padding:50px;text-align:center}#onboarding-buttons{align-self:end}}@layer page{#recover-password{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/lock-d258361a.svg);background-repeat:no-repeat;background-position:center left;text-align:left;padding-left:40px}#phone-section{display:flex}.fixed-left{padding:20px;border:2px solid var(--light-border-color);border-right:0;border-radius:5px 0 0 5px}.fixed-left+#phone-number{border-top-left-radius:0;border-bottom-left-radius:0}#us-flag{background-image:url(/LearnHTMLCSS-Fake-Bank/assets/flag-us-b169f124.svg);background-repeat:no-repeat;background-position:center}}@layer page{#header-profile-top-right{position:absolute;top:20px;right:20px;cursor:pointer}#header-profile-wrapper{text-align:center;padding-top:60px}#header-profile-wrapper h1{margin-top:16px}}
