/* public/app/css/dash-simple.css
 * Synopsis: Mode essai minimal homepage.
 * Objectif: 1 colonne, 4 actions ; cockpit intact hors mode.
 */

.dash.dash--simple {
    grid-template-columns: minmax(0, 1fr);
    margin-inline: auto;
    max-width: min(21rem, 50vw);
    width: min(21rem, 50vw);
}

.dash.dash--simple .dash-top {
    order: 0;
}

.dash.dash--simple .dash-stage {
    min-height: 0;
    order: 1;
    overflow: visible;
}

.dash.dash--simple .dash-rail--langs {
    order: 2;
}

.dash.dash--simple .dash-credit {
    order: 3;
}

.dash.dash--simple .dash-rail--ops {
    display: none;
}

.dash.dash--simple .dash-rail--langs > :not(.dash-panel--flags) {
    display: none;
}

.dash.dash--simple .dash-panel--flags .dash-lang-head,
.dash.dash--simple .dash-panel--flags .dash-rail-note,
.dash.dash--simple .dash-panel--flags .lang-flags-grip {
    display: none;
}

.dash.dash--simple .dash-compose-ico--zip,
.dash.dash--simple .dash-compose-ico--import,
.dash.dash--simple .dash-compose__dock,
.dash.dash--simple .dash-sec-head--compose .dash-help-btn,
.dash.dash--simple .dash-ad {
    display: none;
}

.dash.dash--simple .dash-compose__tools {
    grid-template-columns: auto;
    grid-template-rows: auto;
}

.dash.dash--simple .dash-compose-ico--copy {
    grid-column: 1;
    grid-row: 1;
}

.dash.dash--simple .dash-simple-bar {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: .55rem;
    justify-content: space-between;
    margin-top: .35rem;
    position: relative;
    z-index: 4;
}

.dash:not(.dash--simple) .dash-simple-bar {
    display: none;
}

.dash .dash-simple-bar__btn {
    background: var(--dash-input-bg);
    border: 1px solid var(--dash-line);
    border-radius: var(--dash-radius);
    color: var(--dash-text);
    cursor: pointer;
    font-family: var(--display);
    font-size: .85rem;
    padding: .45rem .75rem;
}

.dash .dash-simple-bar__btn--go {
    background: color-mix(in srgb, var(--dash-accent) 18%, var(--dash-input-bg));
    border-color: color-mix(in srgb, var(--dash-accent) 42%, var(--dash-line));
    color: color-mix(in srgb, var(--dash-accent) 78%, var(--dash-text));
    font-weight: 600;
}

.dash.dash--simple.dash--fs {
    max-width: none;
    width: auto;
}

.dash.dash--simple .dash-meter {
    display: none !important;
}