/* === SHEET STYLES ===
   Source unique pour tout ce qui régit .sheet/.block/.item : aperçu
   d'impression (modale admin), impression navigateur réelle, et export PDF
   (Chromium headless). Ne pas dupliquer ces règles ailleurs. */

/* Dimensions identiques partout : sans ça, la page du PDF (qui n'a pas le
   reset border-box du site) faisait 210mm + marges de large, réduite à ~85%
   par Chromium pour tenir sur l'A4, et ne ressemblait pas à l'impression
   navigateur. */
.sheet, .sheet * {
    box-sizing: border-box;
}

.sheet {
    font-family: "Cormorant Garamond", "Cormorant", "EB Garamond", Georgia, serif;
    color: #000;
    display: flex;
    flex-direction: column;
}

.sheet .sheet-header {
    text-align: center;
    margin-bottom: 1em;
}

.sheet .sheet-logo {
    /* width (pas max-width) : le SVG a une largeur intrinsèque de 313px,
       max-width ne ferait que plafonner sans jamais agrandir. */
    width: 55%;
    height: auto;
}

.sheet .sheet-date {
    font-style: italic;
    color: #444;
    margin-top: 0.3em;
}

.sheet .block {
    margin-bottom: 1em;
}

/* Spécialités et Vins ont peu de contenu : plus d'espace entre catégories
   pour occuper la page comme sur la carte papier, sans toucher aux pages
   déjà denses (Menu du Jour, Boissons) où ça pousserait sur une 2e page. */
.sheet[data-page="specialites"] .block,
.sheet[data-page="vins"] .block {
    margin-bottom: 2.5em;
}

/* Page de rendu des polices (admin) : 3 polices × 3 tailles par page A4,
   espacements resserrés pour que tout tienne. */
.sheet[data-page="font-sample"] .block {
    margin-bottom: 0.6em;
}

.sheet[data-page="font-sample"] .block.is-sub {
    margin-bottom: 0.2em;
}

.sheet[data-page="font-sample"] .block.is-sub > .block-name {
    margin-top: 0.2em;
    margin-bottom: 0.1em;
}

/* Menu du jour : page la plus longue (et variable). On gagne de la place
   sur l'en-tête et les espacements pour garder un texte grand, plutôt que
   de laisser fitSheetsToPage réduire la taille du texte. */
.sheet[data-page="menu-du-jour"] .sheet-logo {
    width: 40%;
}

.sheet[data-page="menu-du-jour"] .sheet-header {
    margin-bottom: 0.3em;
}

.sheet[data-page="menu-du-jour"] .block {
    margin-bottom: 0.5em;
}

.sheet[data-page="menu-du-jour"] .item-separator {
    margin: 0.3em 0;
}

.sheet .block-name {
    font-family: "UnifrakturCook", "Old English Text MT", serif;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0.35em;
    color: #8B1A1A;
}

.sheet .block.is-sub > .block-name {
    font-family: "UnifrakturCook", "Old English Text MT", serif;
    font-size: 1.1em;
    font-weight: bold;
    color: #8B1A1A;
    margin-top: 0.5em;
}

.sheet .block-desc {
    font-style: italic;
    color: #555;
    font-size: 0.85em;
    margin-bottom: 0.25em;
}

.sheet .block-note {
    color: #666;
    font-style: italic;
    font-size: 0.8em;
    margin-bottom: 0.25em;
}

.sheet .items-compact {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 1em;
}

/* Colonnes "à la carte papier" : toute la colonne de gauche du haut vers le
   bas, puis la droite (pas gauche-droite-gauche-droite). Le split gauche/
   droite est décidé côté JS (generateSheetHTML) : deux .items-grid-2-col
   côte à côte, chacune un simple flux vertical d'.item comme .items. */
.sheet .items-grid-2 {
    display: flex;
    gap: 0 10%;
    align-items: flex-start;
}

.sheet .items-grid-2-col {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* Layout 2 lignes : nom contraint via padding-right (JS), leader et prix
   positionnés en absolu sur la dernière ligne du nom par alignGridLeaders().
   S'applique partout (pas que items-grid-2) : un nom peut déborder sur une
   liste simple à une colonne aussi bien que dans une colonne étroite. */
.sheet .item-span-2 {
    display: block;
    position: relative;
}

.sheet .item-span-2 .item-name {
    display: block;
    /* padding-right positionné par JS pour laisser la place au prix */
}

.sheet .item-span-2 .item-leader {
    position: absolute;
    margin: 0;
    min-width: 0;
    border-bottom: 1px dotted #555;
    /* top, height, left, right positionnés par JS */
}

.sheet .item-span-2 .item-price,
.sheet .item-span-2 .item-prices {
    position: absolute;
    right: 0;
    /* top positionné par JS */
}

.sheet .items-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.25em 2.5em;
}

.sheet .items-flex .item {
    flex: 0 0 auto;
    width: fit-content;
    gap: 0.6em;
    justify-content: flex-start;
    white-space: nowrap;
}

/* Retour à la ligne forcé (case "retour à la ligne" d'un item) */
.sheet .items-flex .item-break {
    flex-basis: 100%;
    height: 0;
}

.sheet .items-flex .item-leader {
    flex: 0 0 1.5em;
    margin-left: 0em;
    margin-right: 0em;
}

.sheet .item {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0.1em 0;
    line-height: 1.3;
    border: none;
    background: transparent;
    border-radius: 0;
}

.sheet .item { font-size: calc(1em * var(--text-scale, 1)); }
.sheet .items-compact .item { font-size: calc(0.9em * var(--text-scale, 1)); }

.sheet .item-name {
    flex: 0 1 auto;
    /* Neutralise les styles de la liste de l'admin (.item-name, .item-price,
       .item-unit), sinon l'impression depuis l'admin diffère du PDF */
    font-size: inherit;
    color: inherit;
}

.sheet .item-price {
    color: inherit;
}

.sheet .item-unit {
    margin-left: 0;
}

/* Police des plats, choisie dans l'admin (settings.itemFont -> attribut
   data-item-font sur .sheet, et sur la liste de l'admin pour l'aperçu).
   Liste des choix : ITEM_FONTS dans render.js. */
[data-item-font="cormorant"] .item-name {
    font-family: "Cormorant Garamond", "Cormorant", Georgia, serif;
    font-style: italic;
    font-weight: 600;
}

[data-item-font="imfell"] .item-name {
    font-family: "IM Fell English", Georgia, serif;
    font-style: normal;
    font-weight: 400;
}

[data-item-font="playfair"] .item-name {
    font-family: "Playfair Display", Georgia, serif;
    font-style: italic;
    font-weight: 400;
}

[data-item-font="grenze"] .item-name {
    font-family: "Grenze", Georgia, serif;
    font-style: normal;
    font-weight: 500;
}

[data-item-font="texturina"] .item-name {
    font-family: "Texturina", "UnifrakturCook", serif;
    font-style: normal;
    font-weight: 500;
}

/* & toujours droit (les italiques ont souvent une esperluette calligraphique
   peu lisible), dans la police du texte autour. */
.sheet .sheet-amp {
    font-style: normal;
}

.sheet .item-separator {
    flex: 0 0 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 1em 0;
}

.sheet .item-separator::after {
    content: '';
    display: block;
    width: 40%;
    border-top: 1px solid #aaa;
}

.sheet .item-leader {
    flex: 1;
    border-bottom: 1px dotted #555;
    align-self: flex-end;
    margin: 0 0.1em 0.15em 0.4em;
    min-width: 0.5em;
}


.sheet .item-desc {
    flex: 0 1 auto;
    min-width: 0;
    font-style: italic;
    color: #555;
    font-size: 0.85em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sheet .items-compact .item-desc { display: none; }

.sheet .item-price {
    font-weight: 600;
    white-space: nowrap;
    margin-left: 0;
}

.sheet .item-prices {
    margin-left: 0;
    gap: 0;
}

.sheet .item-unit {
    font-weight: normal;
    font-size: 0.85em;
    color: #555;
}

.sheet .prices-header {
    display: flex;
    color: #888;
    font-style: italic;
    font-size: 0.8em;
    margin-bottom: 0.15em;
}

.sheet .prices-header::before {
    content: "";
    flex: 1;
}

.sheet .prices-header span {
    width: 3.125em;
    text-align: center;
    flex-shrink: 0;
    white-space: nowrap;
    overflow: visible;
}

.sheet .item-prices span {
    min-width: 0;
    width: 2.5em;
    text-align: center;
    flex-shrink: 0;
}

.sheet .item-prices {
    display: flex;
    font-weight: 600;
}

/* splitv: deux colonnes verticales */
.sheet-splitv {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 2em;
}

.sheet-col {
    flex: 1;
    min-width: 0;
}

/* === RENDU A4 (aperçu modal + impression + PDF) ===
   Règles écrites une seule fois via .sheet.print-active, ajoutée par JS
   (aperçu/impression) ou par le rendu PDF avant capture. */

.sheet.print-active {
    width: 210mm;
    min-height: 297mm;
    padding: 14mm var(--sheet-pad, 18mm);
    font-size: 12.5pt;
    border-radius: 0;
}

.sheet.print-active .sheet-date          { font-size: 11.5pt; }
.sheet.print-active .block-name          { font-size: 20pt; }
.sheet.print-active .block.is-sub > .block-name { font-size: 16pt; }
.sheet.print-active .block-desc          { font-size: 11pt; }
.sheet.print-active .block-note          { font-size: 10.5pt; }
.sheet.print-active .item                { font-size: calc(12.5pt * var(--text-scale, 1)); padding: 3pt 0; }
.sheet.print-active .items-compact .item { font-size: calc(11.5pt * var(--text-scale, 1)); }
.sheet.print-active .items-grid-2 .item  { font-size: calc(12pt * var(--text-scale, 1)); }
.sheet.print-active .prices-header       { font-size: 10.5pt; }

.sheet.print-active .sheet-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sheet.print-active .sheet-splitv {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 2em;
}

/* Marges physiques à 0 : les marges visuelles vivent dans .sheet (padding). */
@page {
    size: A4 portrait;
    margin: 0;
}

/* Feuilles préparées pour l'impression navigateur (preparePrintSheets) :
   hors écran mais mesurables à l'écran, seules visibles à l'impression. */
#print-root {
    position: absolute;
    left: -10000px;
    top: 0;
}

@media print {

    body > *:not(#print-root) { display: none !important; }
    #print-root { position: static; }

    html, body { background: white !important; margin: 0 !important; padding: 0 !important; }
    body::before { display: none !important; }

    [data-noprint] { display: none !important; }
    .twk-panel    { display: none !important; }

    /* Surcharges print-only (sizing/font dans .sheet.print-active) */
    .sheet {
        height:     297mm;   /* force exactement 1 page */
        margin: 0;
        box-shadow: none !important;
        overflow: hidden;
        page-break-after: always;
        break-after: page;
    }
    .sheet:last-child {
        page-break-after: auto;
        break-after: auto;
    }

    .sheet .block, .sheet .item {
        page-break-inside: avoid;
        break-inside:      avoid;
    }

    * {
        -webkit-print-color-adjust: exact !important;
                print-color-adjust: exact !important;
    }
}