/* PQR_SOCIAL_EDITOR_CARDS_V12 */

/*
 * Middle editor cards only.
 * Sidebar, preview, hero and workspace dimensions are untouched.
 */

body.pqr-social-builder-page{
    --sp12-card:#ffffff;
    --sp12-card-soft:#f8f9fe;
    --sp12-card-border:#dfe5f0;
    --sp12-card-text:#121b31;
    --sp12-card-muted:#65728c;
    --sp12-card-accent:#6549e7;
    --sp12-card-accent-soft:#efecff;
    --sp12-card-shadow:
        0 18px 48px rgba(29,40,72,.075);
}

html[data-pqr-theme="glass"]
body.pqr-social-builder-page{
    --sp12-card:rgba(255,255,255,.62);
    --sp12-card-soft:rgba(255,255,255,.52);
    --sp12-card-border:rgba(135,148,181,.27);
    --sp12-card-text:#172033;
    --sp12-card-muted:#62708a;
    --sp12-card-accent:#6549e7;
    --sp12-card-accent-soft:rgba(234,228,255,.72);
    --sp12-card-shadow:
        0 24px 60px rgba(42,52,88,.12);
}

html[data-pqr-theme="midnight"]
body.pqr-social-builder-page{
    --sp12-card:#121c2c;
    --sp12-card-soft:#192538;
    --sp12-card-border:#34435b;
    --sp12-card-text:#f3f6ff;
    --sp12-card-muted:#afbdd3;
    --sp12-card-accent:#b4a5ff;
    --sp12-card-accent-soft:#292442;
    --sp12-card-shadow:
        0 24px 62px rgba(0,0,0,.29);
}

/* Main editor section cards */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(20px,2.4vw,30px)!important;

    border:
        1px solid
        var(--sp12-card-border)!important;

    border-radius:26px!important;

    background:
        linear-gradient(
            145deg,
            var(--sp12-card),
            var(--sp12-card-soft)
        )!important;

    color:
        var(--sp12-card-text)!important;

    box-shadow:
        var(--sp12-card-shadow)!important;
}

/* Branded top accent */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section::before{
    content:"";
    position:absolute;
    inset:0 0 auto;
    z-index:-1;
    height:4px;

    background:
        linear-gradient(
            90deg,
            var(--sp12-card-accent),
            #2bbbd6,
            transparent 82%
        );
}

/* Soft decorative glow */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section::after{
    content:"";
    position:absolute;
    z-index:-1;
    top:-100px;
    right:-90px;
    width:220px;
    height:220px;
    border-radius:50%;

    background:
        radial-gradient(
            circle,
            color-mix(
                in srgb,
                var(--sp12-card-accent) 12%,
                transparent
            ),
            transparent 68%
        );

    pointer-events:none;
}

/* Section headings */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section-head{
    align-items:center;
    margin-bottom:22px;
    padding-bottom:17px;

    border-bottom:
        1px solid
        var(--sp12-card-border);
}

body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section-head h2{
    margin-top:4px!important;
    color:var(--sp12-card-text)!important;
    font-size:clamp(22px,2vw,30px)!important;
    letter-spacing:-.035em;
    line-height:1.1!important;
}

body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-designer-kicker{
    color:var(--sp12-card-accent)!important;
    font-size:10px!important;
    font-weight:850!important;
    letter-spacing:.14em;
}

/* Branded heading icon box */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section-head > i{
    width:44px!important;
    height:44px!important;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--sp12-card-accent) 24%,
            var(--sp12-card-border)
        );

    border-radius:14px!important;

    background:
        var(--sp12-card-accent-soft)!important;

    color:
        var(--sp12-card-accent)!important;

    box-shadow:
        0 8px 20px
        color-mix(
            in srgb,
            var(--sp12-card-accent) 12%,
            transparent
        );
}

/* Inner quick-add box */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-platform-quick-add{
    padding:18px!important;

    border:
        1px solid
        var(--sp12-card-border)!important;

    border-radius:18px!important;

    background:
        color-mix(
            in srgb,
            var(--sp12-card-soft) 88%,
            var(--sp12-card-accent-soft)
        )!important;

    box-shadow:
        inset 0 1px
        color-mix(
            in srgb,
            #ffffff 60%,
            transparent
        );
}

/* Added social-link rows */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-social-link-row{
    border:
        1px solid
        var(--sp12-card-border)!important;

    border-radius:16px!important;

    background:
        var(--sp12-card)!important;

    box-shadow:
        0 7px 20px rgba(26,37,68,.055);
}

/* Form controls inside editor cards */
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section
:is(.form-control,.form-select){
    min-height:48px;

    border:
        1px solid
        var(--sp12-card-border)!important;

    border-radius:13px!important;

    background:
        var(--sp12-card-soft)!important;

    color:
        var(--sp12-card-text)!important;

    box-shadow:
        inset 0 1px 2px rgba(22,31,55,.025);
}

body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section
textarea.form-control{
    min-height:112px;
}

body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section
:is(.form-control,.form-select):focus{
    border-color:
        var(--sp12-card-accent)!important;

    box-shadow:
        0 0 0 4px
        color-mix(
            in srgb,
            var(--sp12-card-accent) 14%,
            transparent
        )!important;
}

/* Glass card treatment */
html[data-pqr-theme="glass"]
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-builder-section{
    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);
}

/* Midnight removes light inset highlight */
html[data-pqr-theme="midnight"]
body.pqr-social-builder-page
.pqr-social-editor-column-v10
.pqr-platform-quick-add{
    box-shadow:inset 0 1px rgba(255,255,255,.035);
}

@media(max-width:700px){
    body.pqr-social-builder-page
    .pqr-social-editor-column-v10
    .pqr-builder-section{
        padding:18px!important;
        border-radius:20px!important;
    }

    body.pqr-social-builder-page
    .pqr-social-editor-column-v10
    .pqr-builder-section-head{
        margin-bottom:17px;
        padding-bottom:14px;
    }
}

@media(prefers-reduced-motion:reduce){
    body.pqr-social-builder-page
    .pqr-social-editor-column-v10
    .pqr-builder-section{
        scroll-behavior:auto;
    }
}