/* Base reset & typography */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.5; color: #333; }
h1, h2, h3, h4 { margin-top: 20px; margin-bottom: 10px; font-weight: 500; line-height: 1.1; }
h1 { font-size: 36px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
h4 { font-size: 18px; }
p { margin: 0 0 10px; }
small { font-size: 85%; color: #777; }
a { color: #337ab7; text-decoration: none; }
a:hover { color: #23527c; text-decoration: underline; }
hr { margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 1px solid #eee; }

/* Layout */
.container { max-width: 970px; margin: 0 auto; padding: 0 15px; }
.row { display: flex; flex-wrap: wrap; margin: 0 -15px; margin-bottom: 1em; }
.col-md-6 { width: 50%; padding: 0 15px; }
@media (max-width: 768px) {
    .col-md-6 { width: 100%; }
}

/* Tables */
.table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.table th, .table td { padding: 5px; border: 1px solid #ddd; vertical-align: middle; }
.table thead th { border-bottom: 2px solid #ddd; text-align: left; }
.table th .note { font-weight: normal; }
.table tbody tr:hover { background-color: #f5f5f5; }
/* conjugation tables: half width, equal columns */
.table.conj { width: 50%; table-layout: fixed; }
.table.conj4 { width: 65%; }
.table.conj-wide { width: 70%; }
.table.conj4 col.person { width: 30%; }
/* short tables: only as wide as the content */
.table.narrow { width: auto; min-width: 50%; }
/* tables placed next to each other */
.tables { display: flex; flex-wrap: wrap; align-items: flex-start; column-gap: 10%; }
.tables > .table.conj, .tables > .table.narrow { width: 40%; min-width: 0; }
@media screen and (max-width: 768px) {
    .table.conj, .table.narrow, .tables > .table.conj, .tables > .table.narrow { width: 100%; }
}

/* Custom styles */
.vs { background-color: rgba(255, 255, 0, 0.22); }
.vs:before { content: '-'; }
.irr { color: red; }
table { break-inside: avoid; }
.break { break-before: page; }
.mt { margin-top: 0.3em; }
.darker-background { background-color: rgba(192, 192, 192, 0.3); }
.table .text-center, .text-center { text-align: center; }
table#zajmena { font-weight: bold; }
table#zajmena td { padding-top: 2px; padding-bottom: 2px; }
table#zajmena em { font-weight: normal; }

/* ToC */
.toc { background-color: #f8f9fa; border: 1px solid #dee2e6; padding: 1em; margin: 1em 0; }
.toc h2 { margin-top: 0; }
.toc nav { margin-top: 0.5em; }
.toc ol { padding-left: 1.5em; }
.toc li { margin: 0.3em 0; }

/* Print */
@page {
    size: A4;
    margin: 0.4in 0.35in;
    @bottom-right { content: counter(page) " / " counter(pages); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 12px; color: #000; }
}
@media print {
    h1, h2, h3, h4 { margin-bottom: 4px; }
    h1 { font-size: 28px; }
    h2 { font-size: 24px; margin-top: 14px; }
    h3 { font-size: 20px; margin-top: 12px; }
    h4 { font-size: 17px; margin-top: 10px; }
    h4 + ul, h4 + ol, h4 + p { margin-top: 0; }
    /* topics (h2) stand out from subtopics */
    h2 { font-weight: bold; }
    /* tighter text and tables */
    body { line-height: 1.35; }
    p { margin-bottom: 6px; }
    ul, ol { margin-top: 4px; margin-bottom: 6px; }
    .table { margin-bottom: 14px; }
    .table th, .table td { padding: 3px 5px; }
    /* gray notes must stay readable on a B&W printer */
    small { color: #444; }
    .container { max-width: none; padding: 0; }
    .col-md-6 { width: 50%; float: left; padding: 0 15px; }
    .row { break-inside: avoid; margin-bottom: 0.5em; display: block; overflow: hidden; }
    .toc { display: none; }

    /* never leave a heading alone at the bottom of a page */
    h2, h3, h4 { break-after: avoid; break-inside: avoid; }
    /* keep an intro paragraph with the block right after it */
    p:has(+ ul), p:has(+ ol), p:has(+ table), p:has(+ .row), p:has(+ .tables) { break-after: avoid; }
    li { break-inside: avoid; }
    /* keep the first two items together, so a heading never ends up with a single item */
    li:first-child:not(:last-child) { break-after: avoid; }
    p, li { orphans: 3; widows: 3; }
    a { color: #333; text-decoration: none; }
}
