
/*
 * Safyne Public AI Forms – public-site skin.
 * Only changes layout presentation on pages using the companion shortcode.
 * Core generator behaviour remains in Safyne System.
 */

.safyne-public-ai-forms-shell{
    width:100%;
    max-width:1200px;
    margin:0 auto;
}

.safyne-public-ai-forms-shell .safyne-public-ai-form{
    width:100%;
    max-width:1200px;
    min-height:0;
    margin:0 auto;
    overflow:hidden;
    border-radius:0;
}

.safyne-public-ai-forms-shell .safyne-public-ai-layout{
    width:100%;
    min-height:620px;
    grid-template-columns:minmax(0, 46%) minmax(0, 54%);
}

.safyne-public-ai-forms-shell .safyne-public-ai-compose{
    min-width:0;
    padding:52px 42px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-compose-inner{
    width:100%;
    max-width:520px;
    margin:0 auto;
}

.safyne-public-ai-forms-shell .safyne-public-ai-compose h2{
    margin:0 0 22px;
    font-size:clamp(28px, 2.2vw, 36px);
    line-height:1.15;
    text-align:left;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
}

.safyne-public-ai-forms-shell .safyne-public-ai-prompt{
    width:100%;
    min-width:0;
    min-height:185px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-example-rotator{
    max-width:none;
}

.safyne-public-ai-forms-shell .safyne-public-ai-underbar{
    width:100%;
    align-items:center;
}

.safyne-public-ai-forms-shell .safyne-public-ai-status{
    flex:1 1 100%;
    margin-top:2px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-preview-pane{
    min-width:0;
    min-height:620px;
    padding:48px 36px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-preview-wrap{
    width:100%;
    max-width:600px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-document,
.safyne-public-ai-forms-shell .safyne-public-ai-preview-content{
    max-width:440px;
}

@media (max-width: 980px){
    .safyne-public-ai-forms-shell .safyne-public-ai-layout{
        grid-template-columns:1fr;
        min-height:0;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-form{
        background:linear-gradient(180deg,#fff 0%,#fff 48%,rgba(16,47,74,.20) 70%,rgba(11,37,59,.86) 100%);
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-compose{
        padding:42px 28px 38px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-compose-inner{
        max-width:680px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-compose h2{
        text-align:center;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-preview-pane{
        min-height:520px;
        padding:42px 24px 52px;
    }
}

@media (max-width: 600px){
    .safyne-public-ai-forms-shell .safyne-public-ai-compose{
        padding:30px 18px 28px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-compose h2{
        font-size:27px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-prompt{
        min-height:170px;
        padding-left:18px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-underbar{
        gap:8px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-pill{
        max-width:100%;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-preview-pane{
        min-height:440px;
        padding:32px 16px 44px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-document,
    .safyne-public-ai-forms-shell .safyne-public-ai-preview-content{
        width:min(420px,92%);
    }
}


/* v0.1.3 — favour the writing area and organise controls into a clean 2×2 grid. */
@media (min-width: 981px){
    .safyne-public-ai-forms-shell .safyne-public-ai-layout{
        grid-template-columns:minmax(0, 60%) minmax(0, 40%);
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-compose{
        padding:48px 46px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-compose-inner{
        max-width:680px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-preview-pane{
        padding:44px 26px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-preview-wrap{
        max-width:430px;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-document,
    .safyne-public-ai-forms-shell .safyne-public-ai-preview-content{
        width:min(360px,88%);
        max-width:360px;
    }
}

.safyne-public-ai-forms-shell .safyne-public-ai-prompt{
    min-height:235px;
    padding:22px 70px 22px 22px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-generate{
    width:50px;
    height:42px;
    right:14px;
    bottom:14px;
    border-radius:21px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-underbar{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:10px 12px;
    width:100%;
    margin-top:14px;
    align-items:stretch;
}

.safyne-public-ai-forms-shell .safyne-public-ai-pill{
    width:100%;
    min-width:0;
    height:42px;
    justify-content:flex-start;
    border-radius:8px;
    padding:0 13px;
    font-size:13px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-country-wrap,
.safyne-public-ai-forms-shell .safyne-public-ai-orientation-wrap{
    padding-right:34px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-country,
.safyne-public-ai-forms-shell .safyne-public-ai-orientation{
    width:100%;
    max-width:none;
    font-size:13px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-chevron{
    right:13px;
    top:10px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-attach{
    max-width:none;
}

.safyne-public-ai-forms-shell .safyne-public-ai-attach-label{
    max-width:none;
}

.safyne-public-ai-forms-shell .safyne-public-ai-word{
    justify-content:flex-start;
}

.safyne-public-ai-forms-shell .safyne-public-ai-status{
    grid-column:1 / -1;
    margin-top:2px;
    min-height:20px;
}

.safyne-public-ai-forms-shell .safyne-public-ai-disclaimer{
    margin-top:18px;
}

@media (max-width: 600px){
    .safyne-public-ai-forms-shell .safyne-public-ai-underbar{
        grid-template-columns:1fr;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-status{
        grid-column:1;
    }

    .safyne-public-ai-forms-shell .safyne-public-ai-prompt{
        min-height:210px;
    }
}


/* v0.1.4 — background is owned by the WordPress/Elementor page, not the plugin.
   This lets a full-width Elementor section carry the right-to-left fade across
   the entire viewport rather than only behind the generator component. */
.safyne-public-ai-forms-shell,
.safyne-public-ai-forms-shell .safyne-public-ai-form,
.safyne-public-ai-forms-shell .safyne-public-ai-layout,
.safyne-public-ai-forms-shell .safyne-public-ai-compose,
.safyne-public-ai-forms-shell .safyne-public-ai-preview-pane{
    background:transparent !important;
}

@media (max-width: 980px){
    .safyne-public-ai-forms-shell .safyne-public-ai-form{
        background:transparent !important;
    }
}


/* v0.1.5 — headings belong to the WordPress/Elementor page.
   Hide the generator's own internal heading so the site owner can add one
   manually in Elementor without duplicated titles. */
.safyne-public-ai-forms-shell .safyne-public-ai-compose h2{
    display:none !important;
}
