/* =========================================================
   SOLVYLA COU - USERMENU WORKSPACE
   Version 0.1
   Variante compacte du workspace commun
   ========================================================= */

.solvyla-cou .cou-workspace-page.is-usermenu {
    width: fit-content;
    min-width: min(420px, 70%);
    max-width: 85%;

    height: auto;
    max-height: 85%;

    margin-inline: 7.5%;
    margin-bottom: 7.5%;

    grid-template-rows: auto minmax(0, auto);

    border: 2px solid var(--signature-color);

    background:
        linear-gradient(180deg, rgba(255,179,198,.72) 0%, rgba(142,197,255,.72) 100%),
        linear-gradient(75deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.38) 35%, rgba(255,255,255,0) 70%),
        linear-gradient(135deg, rgba(255,255,255,.20) 0%, rgba(255,255,255,.05) 40%, rgba(255,255,255,.20) 80%),
        repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,.18) 0 2px, transparent 3px 8px);

    background-blend-mode: normal, lighten, overlay, soft-light;

    box-shadow: 0 12px 40px rgba(0,0,0,.18);

    color: #1683e8;
}

/* Le bandeau reprend la meme ambiance que le panneau. */
.solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-header {
    background:
        linear-gradient(180deg, rgba(255,179,198,.60) 0%, rgba(142,197,255,.60) 100%),
        linear-gradient(75deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.32) 35%, rgba(255,255,255,0) 70%),
        linear-gradient(135deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.04) 40%, rgba(255,255,255,.18) 80%);

    border-bottom-color: rgba(255,255,255,.45);
}

.solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-title {
    color: #fff;
}

.solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-subtitle {
    color: #1683e8;
}

/* Hauteur liee au contenu. Scroll seulement si necessaire. */
.solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-scroll {
    height: auto;
    max-height: 60vh;
    overflow-y: auto;

    padding: clamp(18px, 2.2vmin, 28px);

    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.72) rgba(255,255,255,.12);
}

/* Le contenu definit la largeur utile, dans les limites du panneau. */
.solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-content {
    width: max-content;
    min-width: min(360px, 100%);
    max-width: min(70vw, 760px);
}

/* Quitter / Enregistrer restent aux deux extremites. */
.solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-bottom-actions {
    width: 100%;
}

/* Securite pour les ecrans plus etroits. */
@media (max-width: 700px) {
    .solvyla-cou .cou-workspace-page.is-usermenu {
        width: auto;
        min-width: 0;
        max-width: none;

        margin-inline: 7.5%;
        margin-bottom: 7.5%;
    }

    .solvyla-cou .cou-workspace-page.is-usermenu .cou-workspace-content {
        width: 100%;
        min-width: 0;
        max-width: none;
    }
}
