.tlPaymentHandoff{
    text-align:center;
}

.tlPaymentSuccessIcon{
    width:58px;
    height:58px;

    margin:0 auto 15px;

    display:grid;
    place-items:center;

    border-radius:50%;

    color:#fff;
    background:#177a50;

    font-size:24px;
    font-weight:900;
}

.tlPaymentEyebrow{
    color:#ff984f;

    font-size:10px;
    font-weight:900;
    letter-spacing:.13em;
}

.tlPaymentHandoff h3{
    margin:7px 0 18px !important;

    color:#fff !important;

    font-size:25px !important;
}

.tlPaymentTotal{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

    margin-bottom:20px;
    padding:14px 0;

    border-top:
        1px solid rgba(255,255,255,.12);

    border-bottom:
        1px solid rgba(255,255,255,.12);

    color:
        rgba(255,255,255,.65);
}

.tlPaymentTotal strong{
    color:#ff984f;

    font-size:20px;
}

.tlPaymentTitle{
    margin-bottom:10px;

    color:#fff;

    text-align:start;

    font-size:12px;
    font-weight:900;
}

.tlPaymentMethods{
    display:grid;
    gap:8px;
}

.tlPaymentMethod{
    width:100%;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:13px 14px;

    border:
        1px solid
        rgba(255,255,255,.14);

    border-radius:13px;

    color:#fff;
    background:
        rgba(255,255,255,.055);

    cursor:pointer;

    font:inherit;

    transition:.2s ease;
}

.tlPaymentMethod span{
    font-size:12px;
    font-weight:900;
}

.tlPaymentMethod small{
    color:
        rgba(255,255,255,.48);

    font-size:8px;
    font-weight:800;
}

.tlPaymentMethod:hover,
.tlPaymentMethod.active{
    border-color:#f77928;

    background:
        rgba(247,121,40,.14);
}

.tlPaymentContinue{
    width:100%;
    min-height:48px;

    margin-top:12px;

    border:0;
    border-radius:100px;

    color:#fff;
    background:#f77928;

    cursor:pointer;

    font:inherit;
    font-size:11px;
    font-weight:900;
}

.tlPaymentContinue:disabled{
    opacity:.42;
    cursor:not-allowed;
}

.tlPaymentUnavailable{
    padding:15px;

    border:
        1px solid
        rgba(255,255,255,.11);

    border-radius:14px;

    color:
        rgba(255,255,255,.72);

    background:
        rgba(255,255,255,.055);

    font-size:11px;
    line-height:1.8;
}

.tlPaymentMessage{
    margin-top:11px;

    font-size:10px;
    line-height:1.6;
}

.tlPaymentMessage.warning{
    padding:10px;

    border-radius:10px;

    color:#ffe2cc;
    background:
        rgba(247,121,40,.13);
}

.tlPaymentMessage.error{
    padding:10px;

    border-radius:10px;

    color:#ffd7d7;
    background:
        rgba(190,45,45,.14);
}
