/* Composants communs, alignés sur generis-lots.css. Charger après les styles des vues. */

/* Même largeur, typographie et départ de page que « Mes lots à générer ». */
.pi-workspace.gl-page,
.ex-page.gl-page,
.pi-users.gl-page,
.lm-editor.gl-page,
#pf-imports.gl-page {
    width: 100%;
    max-width: none;
    min-width: 0;
    margin: auto;
    padding: 4px 0;
    background: transparent;
    color: var(--gl-text);
    font: 14px/1.5 system-ui, sans-serif;
}

.pi-workspace { --pi-accent: var(--gl-brand); }
#pf-imports {
    --pf-ink: var(--gl-text);
    --pf-muted: var(--gl-muted);
    --pf-line: var(--gl-line);
    --pf-paper: var(--gl-surface);
    --pf-bg: var(--gl-bg);
    --pf-main: var(--gl-brand);
    --pf-soft: var(--gl-soft);
}

:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) h1 {
    font-size: 27px;
    font-weight: 600;
    line-height: 1.5;
    margin: 0 0 7px;
}
:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) h2 {
    font-size: 18px;
    font-weight: 600;
}
:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) p {
    color: var(--gl-muted);
}
:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) .gl-page-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 24px;
}
:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) .gl-page-head p {
    margin: 0;
}
.pi-workspace .pi-nav,
#pf-imports .pf-header .pi-nav {
    margin: 0;
    gap: 10px;
}
.pi-workspace .pi-heading > a { margin-left: auto; }

/* Les actions dynamiques des imports et exports utilisent aussi ces règles. */
.plenia-body .gl-button,
.pi-workspace button,
.pi-workspace a.pi-primary,
.pi-workspace #pi-created > a,
.pi-workspace .pi-columns > summary,
.ex-page .ex-button,
#pf-imports button,
#pf-imports a.pf-button,
#pf-imports .pi-nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--gl-line);
    border-radius: 7px;
    background: var(--gl-surface);
    color: var(--gl-text);
    padding: 9px 13px;
    min-height: 0;
    font: inherit;
    line-height: 1.5;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: none;
}
.plenia-body .gl-button:hover,
.pi-workspace button:hover,
.pi-workspace a.pi-primary:hover,
.pi-workspace #pi-created > a:hover,
.pi-workspace .pi-columns > summary:hover,
.ex-page .ex-button:hover,
#pf-imports button:hover,
#pf-imports a.pf-button:hover,
#pf-imports .pi-nav a:hover {
    background: var(--gl-soft);
    border-color: var(--gl-line);
    color: var(--gl-text);
    text-decoration: none;
    box-shadow: none;
}
.plenia-body .gl-button.gl-primary,
.pi-workspace .pi-primary,
.pi-workspace a.pi-primary,
.pi-workspace #pi-created > a.pi-primary,
.ex-page .ex-button.ex-primary,
#pf-imports button.pf-primary,
#pf-imports a.pf-button.pf-primary {
    background: var(--gl-brand);
    border-color: var(--gl-brand);
    color: #fff;
    font-weight: 600;
}
.plenia-body .gl-button.gl-small {
    padding: 6px 9px;
    font-size: 12px;
}
.pi-workspace button:disabled,
.ex-page .ex-button:disabled,
#pf-imports button:disabled {
    opacity: .5;
    cursor: default;
}
#pf-imports .pf-type { display: block; text-align: left; padding: 18px; }
#pf-imports .pf-field { justify-content: space-between; text-align: left; padding: 9px; }
#pf-imports .pf-delete { width: 30px; padding: 4px; border: 0; }
#pf-imports .pf-type[aria-pressed="true"],
#pf-imports .pf-field[aria-pressed="true"],
#pf-imports nav button[aria-current="page"] {
    background: var(--gl-soft);
    color: var(--gl-brand);
    border-color: var(--gl-brand);
}

/* Cartes et formulaires : fond blanc, bordure fine, rayon et ombre des lots. */
.pi-workspace .pi-card,
.ex-page .ex-card,
.ex-page .ex-panel,
.pi-users .app-card,
.pp-page .pp-card,
.lm-editor .lm-form,
#pf-imports .pf-panel {
    background: var(--gl-surface);
    border: 1px solid var(--gl-line);
    border-radius: 12px;
    box-shadow: var(--app-shadow);
}
.pi-workspace .pi-card,
.ex-page .ex-card,
.ex-page .ex-panel,
.pi-users .app-card,
.pp-page .pp-card,
#pf-imports .pf-panel { padding: 22px; }
.lm-form .lm-form-body { padding: 22px; }
#pf-imports .pf-mapper > .pf-panel { padding: 16px; }
.ex-page .ex-panel h2 { font-size: 18px; font-weight: 600; }
.ex-page .ex-card h2 { margin: 18px 0 8px; }
.ex-page .ex-type {
    border-radius: 6px;
    background: var(--app-surface-raised);
    color: var(--app-purple);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: normal;
    padding: 4px 8px;
}
.pi-users .pi-users-table { padding: 0; }
.pi-users .pi-users-table th,
.pi-users .pi-users-table td { padding: 12px; }
.pi-users .pi-users-pagination { gap: 12px; }
.pi-users .pi-users-pagination > span { margin-right: auto; }

:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) label {
    color: var(--gl-muted);
    font-size: 14px;
    font-weight: 400;
}
.pi-workspace input:not([type="checkbox"]):not([type="hidden"]),
.pi-workspace select,
.ex-page input:not([type="checkbox"]):not([type="hidden"]),
.ex-page select,
.pi-users .form-control,
.lm-form input:not([type="checkbox"]):not([type="hidden"]),
.lm-form select,
#pf-imports input:not([type="checkbox"]):not([type="hidden"]),
#pf-imports select {
    min-height: 0;
    border: 1px solid var(--gl-line);
    border-radius: 7px;
    padding: 10px;
    background: var(--gl-surface);
    color: var(--gl-text);
    font: inherit;
}
.pi-workspace #pi-lot-name { max-width: none; }
:is(.pi-workspace, .ex-page, .pi-users, #pf-imports) input[type="checkbox"] {
    accent-color: var(--gl-brand);
}
.pi-workspace :focus-visible,
.ex-page :is(input, select):focus,
.lm-form :focus-visible,
#pf-imports :is(button, input, select, a):focus-visible {
    outline: 2px solid var(--app-purple);
    outline-offset: 3px;
    box-shadow: none;
}

/* Tableaux : mêmes entêtes, cellules et survol que la liste des lots. */
.pi-workspace .pi-table-wrap,
.ex-page .ex-table-scroll,
#pf-imports .pf-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--gl-line);
    border-radius: 12px;
    background: var(--gl-surface);
}
.pi-workspace table,
.ex-page .ex-table,
#pf-imports table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.pi-workspace table :is(th, td),
.ex-page .ex-table :is(th, td),
#pf-imports table :is(th, td) {
    padding: 12px;
    border-bottom: 1px solid var(--gl-line);
    text-align: left;
    vertical-align: middle;
}
.pi-workspace table th,
.ex-page .ex-table th,
#pf-imports table th {
    background: #f7f8fa;
    color: var(--gl-muted);
    font-size: 13px;
    font-weight: 500;
}
.pi-workspace table tbody tr:last-child td,
.ex-page .ex-table tbody tr:last-child td,
#pf-imports table tbody tr:last-child td { border-bottom: 0; }
.pi-workspace table tbody tr:hover,
.ex-page .ex-table tbody tr:hover,
#pf-imports table tbody tr:hover { background: #faf8fd; }
.ex-page .ex-status { border-radius: 6px; padding: 4px 8px; font-size: 12px; }

@media (max-width: 800px) {
    .pi-workspace.gl-page,
    .ex-page.gl-page,
    .pi-users.gl-page,
    .lm-editor.gl-page,
    #pf-imports.gl-page { padding: 0; }
}
@media (max-width: 600px) {
    :is(.pi-workspace, .ex-page, .pi-users, #pf-imports) .gl-page-head {
        align-items: flex-start;
    }
    .pi-workspace .pi-nav,
    #pf-imports .pf-header .pi-nav { width: 100%; margin: 0; }
    .pi-workspace .pi-nav a,
    #pf-imports .pi-nav a { flex: 1 1 auto; }
    .pi-workspace button,
    .pi-workspace a.pi-primary,
    .pi-workspace #pi-created > a,
    .ex-page .ex-button { white-space: normal; }
    .pi-workspace .pi-card,
    .ex-page .ex-card,
    .ex-page .ex-panel,
    .pi-users .app-card,
    .pp-page .pp-card,
    #pf-imports .pf-panel { padding: 16px; }
}
@media (pointer: coarse) {
    .plenia-body .gl-button,
    .pi-workspace button,
    .pi-workspace a.pi-primary,
    .pi-workspace #pi-created > a,
    .ex-page .ex-button,
    #pf-imports button,
    #pf-imports a.pf-button { min-height: 44px; }
    :is(.pi-workspace, .ex-page, .pi-users, #pf-imports) :is(input, select) {
        font-size: 16px;
    }
}