/* ==========================================================
   PATCH-MINTPAY-008A
   MintPay branding
   ========================================================== */

.brand-icon {
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            rgba(236,253,245,.96),
            rgba(207,250,254,.92)
        ) !important;

    border:
        1px solid rgba(255,255,255,.88) !important;

    box-shadow:
        0 12px 28px rgba(5,150,105,.16) !important;
}

.brand-icon img {
    width: 100% !important;
    height: 100% !important;
    padding: 4px !important;
    object-fit: contain !important;
}

.brand-name {
    background:
        linear-gradient(
            90deg,
            #047857,
            #10b981 50%,
            #0891b2
        ) !important;

    background-clip: text !important;
    -webkit-background-clip: text !important;

    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}

.simplpay-lock-logo {
    width: 80px !important;
    height: 80px !important;

    padding: 5px !important;

    border-radius: 24px !important;

    background:
        linear-gradient(
            145deg,
            #ecfdf5,
            #cffafe
        ) !important;

    border:
        1px solid rgba(255,255,255,.90) !important;

    box-shadow:
        0 16px 38px rgba(5,150,105,.20) !important;
}

.simplpay-lock-title {
    background:
        linear-gradient(
            90deg,
            #047857,
            #10b981 50%,
            #0891b2
        );

    background-clip: text;
    -webkit-background-clip: text;

    color: transparent !important;
    -webkit-text-fill-color: transparent !important;

    font-weight: 950 !important;
    letter-spacing: -.04em !important;
}

#simplPayLockRoot {
    background:
        radial-gradient(
            circle at 15% 15%,
            rgba(16,185,129,.20),
            transparent 35%
        ),
        radial-gradient(
            circle at 86% 10%,
            rgba(6,182,212,.18),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #ecfdf5,
            #eff6ff 55%,
            #f0fdfa
        ) !important;
}
