.credit-card{background-color:var(--gray-alpha-300);box-shadow:var(--info-shadow);color:var(--background);opacity:.5;cursor:pointer;border:2px solid var(--icon-stroke-color);width:100%;max-width:420px;box-shadow:var(--info-shadow);aspect-ratio:1.9;-webkit-user-select:none;user-select:none;border-radius:.75rem;flex-direction:column;justify-content:space-between;margin-left:auto;margin-right:auto;padding:1rem;transition:opacity .2s,box-shadow .2s;display:flex;position:relative}.credit-card.active{opacity:1}.credit-card.default{box-shadow:0 2px 4px #0006,0 6px 6px -3px #0000004d,inset 0 -3px #0003}.credit-card.non-touch{cursor:default;box-shadow:var(--card-shadow);border:3px solid var(--icon-stroke-color)}.credit-card .card-brand-header{justify-content:space-between;align-items:flex-start;display:flex;position:relative}.credit-card .card-brand-header .card-brand-name{opacity:.5;font-size:.75rem;font-weight:700}.credit-card .card-info{flex-direction:column;gap:.25rem;margin-top:1.5rem;padding:0 .25rem 0 1rem;display:flex}.credit-card .card-info .card-number{justify-content:space-between;gap:1rem;display:flex}.credit-card .card-info .card-number .card-chip-icon{opacity:.8;border-radius:.5rem;margin-top:-2rem}.credit-card .card-info .card-number .number{letter-spacing:-.5px;margin-bottom:1rem;font-size:1.5rem;font-weight:700}.credit-card .card-info .card-number .number:before{content:"**** **** **** ";word-spacing:.5rem}.credit-card .card-info .card-expire-date{justify-content:flex-end;gap:.5rem;font-size:1rem;font-weight:700;display:flex}.credit-card .card-info .card-expire-date label{opacity:.6;font-weight:400}.credit-card .card-arrow-icon{opacity:.5;position:absolute;bottom:-.5rem;left:50%;transform:translate(-50%)}
