/*
 * App stylesheet for v2-static.
 * Ported from the <style> block of app/templates/index.html (the Flask
 * shell): chord/scale SVG sizing, the portrait chord grid, the landscape
 * chord row, and the full print stylesheet. The print-orientation @page
 * rule lives in the <style id="print-orientation"> element in index.html
 * and is swapped by js/ui/print.js (U1 resolution parity).
 */

/* Base Chord SVG Sizing */
.chord-svg-container svg {
    width: 100%;
    height: auto;
    max-width: 180px;
    display: block;
    margin: 0 auto;
}

/* Full Neck Scale Sizing (Page Width). The container is centered so the
   neck diagram sits in the middle of its space in both orientations. */
.scale-full-container {
    text-align: center;
}
.scale-full-container svg {
    width: 100%;
    height: auto;
    max-width: 1050px;
    display: block;
    margin: 0 auto;
}

/* Portrait chord clump: centered flex row (parity with the landscape row),
   so a progression with fewer than a full row of chords is centered in its
   space rather than left-packed into a fixed grid. */
.chord-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    width: 100%;
}
.chord-grid .chord-card {
    width: 150px;
}

/* Landscape study-sheet layout (screen + print). One row of chord cards
   under the full-neck scale; wraps to a second row for long progressions.
   Kept separate from .chord-grid so portrait output is untouched. */
.chord-row-landscape {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    width: 100%;
}
.chord-row-landscape .chord-card {
    width: 150px;
}

@media print {
    @page {
        margin: 0.25in;
    }
    .no-print { display: none !important; }
    .print-only { display: block !important; }
    /* Print only the title, the fretboard, and the chord diagrams: the
       Scale Lens line is screen-only clutter. */
    .sheet-lens-row { display: none !important; }
    body { background: white !important; padding: 0 !important; }
    .print-container { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }

    /* Single-page compaction: drop the reserved empty height, keep the neck
       from ever growing tall enough to spill the chords onto a second page,
       and keep the whole neck on one page. */
    #workbook-results { min-height: 0 !important; }
    .scale-full-container {
        break-inside: avoid;
        margin-bottom: 0.15in !important;
    }
    .scale-full-container svg { max-height: 3.5in !important; }

    .chord-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 2px !important;
        justify-content: center !important;
    }
    .chord-grid .chord-card {
        width: 145px !important; /* Reduced to fit 5 per row on 8.5x11 */
    }
    .chord-card {
        border: 1px solid #eee !important;
        padding: 1px !important;
        margin: 2px !important;
        break-inside: avoid;
    }
    .chord-svg-container svg {
        max-width: 100% !important;
        height: auto !important;
    }

    /* Landscape: one row across the wide page. Narrow the cards so up to
       8 fit a single row; 9-12 wrap to a second row and still fit one
       landscape page. */
    .chord-row-landscape {
        gap: 2px !important;
    }
    .chord-row-landscape .chord-card {
        width: 118px !important;
    }
}