/*
 * Úpravy nad rámec style.scss. style.css se ze scss generuje, takže by je
 * příští kompilace přepsala (22. 10. 2026).
 */

/* Na mobilu jsou pole formuláře pod sebou: 90 % šířky obrazovky místo col-8. */
@media (max-width: 991.98px) {
    .form-col {
        flex: 0 0 90vw;
        max-width: 90vw;
        padding-left: 0;
        padding-right: 0;
    }
}

/* Stránka Pivovary (22. 10. 2026) */
/* Světlý „papír“ jako graf ve statistikách (.chart-container). Spodní okraj kvůli
   pevné patičce, která by na počítači překryla konec seznamu. */
.breweries {
    text-align: left;
    background-color: #f5f2e8;
    color: #2a2d2d;
    text-shadow: none;
    padding: 2rem;
    margin: 1rem auto 6rem;
    border-radius: .5rem;
    max-width: 80vw;
    box-shadow: 0 0 5px rgba(0, 0, 0, .25);
}
@media screen and (max-width: 549px) {
    .breweries { padding: .75rem; max-width: calc(100% - 1rem); margin: .5rem auto 2rem; }
}
.breweries-summary { text-align: center; }
.breweries-search { max-width: 480px; margin: 0 auto 1rem; border: 1px solid #d4d4d4; opacity: 1; }
.brewery { border-bottom: 1px solid rgba(0, 0, 0, .12); }
.brewery summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: .25rem 1rem;
    padding: .6rem .25rem;
    cursor: pointer;
    list-style: none;
}
.brewery summary::-webkit-details-marker { display: none; }
.brewery-name::before { content: '\25B8'; display: inline-block; width: 1.2rem; opacity: .6; }
.brewery[open] .brewery-name::before { content: '\25BE'; }
.brewery-name { flex: 1 1 100%; font-weight: 700; }
.brewery-stats { flex: 1 1 100%; padding-left: 1.2rem; font-size: .875rem; opacity: .85; }
.brewery-beers { color: inherit; margin: 0 0 .75rem; font-size: .875rem; }
.brewery-beers td { border-top-color: rgba(0, 0, 0, .08); }
.breweries-unclassified { margin-top: 2rem; font-size: 1.25rem; }
.breweries-note { font-size: .875rem; opacity: .75; }

/* style.css má main { width: 100vw }, což u dlouhé stránky počítá i svislý posuvník
   a stránka pak jde posouvat do strany o jeho šířku (22. 10. 2026). */
main { width: 100%; }