:root{
    --isanto-wsp-primary:#25D366;
    --isanto-wsp-primary-hover:#1ebe5d;
    --isanto-wsp-dark:#08111f;
    --isanto-wsp-glow:rgba(0,170,255,.35);
}

.isanto-wsp-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    max-width:360px;
    padding:14px 20px;
    background:var(--isanto-wsp-primary);
    color:#fff !important;
    border-radius:12px;
    font-weight:800;
    font-size:15px;
    line-height:1.2;
    text-decoration:none !important;
    box-shadow:0 10px 30px rgba(37,211,102,.28);
    transition:all .25s ease;
    box-sizing:border-box;
}

.isanto-wsp-btn:hover{
    background:var(--isanto-wsp-primary-hover);
    color:#fff !important;
    transform:translateY(-2px);
    box-shadow:0 14px 34px rgba(37,211,102,.35);
}

.isanto-wsp-btn-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
}

.isanto-wsp-btn--small{
    max-width:100%;
    padding:12px 16px;
    font-size:14px;
    border-radius:10px;
}

.isanto-wsp-loop-wrap{
    margin-top:12px;
}

.isanto-wsp-card{
    margin-top:24px;
    padding:1px;
    border-radius:20px;
    background:linear-gradient(135deg, rgba(255,255,255,.18), rgba(0,153,255,.25));
    box-shadow:0 16px 40px rgba(0,0,0,.18), 0 0 0 1px rgba(255,255,255,.06) inset;
    max-width:760px;
}

.isanto-wsp-card-inner{
    display:grid;
    grid-template-columns:1.3fr .9fr;
    gap:22px;
    padding:22px;
    border-radius:20px;
    background:
        radial-gradient(circle at top right, var(--isanto-wsp-glow), transparent 40%),
        linear-gradient(180deg, rgba(12,18,33,.98), rgba(7,14,25,.98));
    color:#fff;
}

.isanto-wsp-main{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
}

.isanto-wsp-info{
    margin:12px 0 0;
    font-size:14px;
    line-height:1.5;
    color:rgba(255,255,255,.82);
}

.isanto-wsp-qr-wrap{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.isanto-wsp-qr{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px;
    background:#fff;
    border-radius:18px;
    box-shadow:
        0 18px 38px rgba(0,0,0,.32),
        0 0 0 1px rgba(255,255,255,.06) inset,
        0 0 24px var(--isanto-wsp-glow);
    min-width:244px;
    min-height:244px;
}

.isanto-wsp-qr img,
.isanto-wsp-qr canvas{
    display:block;
    width:220px !important;
    height:220px !important;
    background:#fff;
    border-radius:10px;
}

.isanto-wsp-qr-text{
    margin:10px 0 0;
    font-size:13px;
    line-height:1.4;
    text-align:center;
    color:rgba(255,255,255,.82);
}

.isanto-floating-wsp{
    position:fixed;
    right:18px;
    bottom:18px;
    z-index:9999;
    display:flex;
    align-items:center;
    gap:10px;
    padding:14px 18px;
    border-radius:999px;
    background:var(--isanto-wsp-primary);
    color:#fff !important;
    text-decoration:none !important;
    font-weight:800;
    box-shadow:0 12px 32px rgba(37,211,102,.35);
    transition:all .25s ease;
}

.isanto-floating-wsp:hover{
    background:var(--isanto-wsp-primary-hover);
    transform:translateY(-2px);
    color:#fff !important;
}

.isanto-floating-wsp-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.isanto-floating-wsp-text{
    white-space:nowrap;
    line-height:1;
}

@media (max-width:768px){
    .isanto-wsp-card-inner{
        grid-template-columns:1fr;
        padding:18px;
    }

    .isanto-wsp-main{
        align-items:stretch;
    }

    .isanto-wsp-btn{
        max-width:100%;
    }

    .isanto-wsp-qr{
        min-width:204px;
        min-height:204px;
    }

    .isanto-wsp-qr img,
    .isanto-wsp-qr canvas{
        width:180px !important;
        height:180px !important;
    }

    .isanto-floating-wsp{
        right:14px;
        bottom:14px;
        padding:13px 16px;
    }

    .isanto-floating-wsp-text{
        font-size:14px;
    }
}