:root {
    --bg: #f4f6f8;
    --panel: #ffffff;
    --text: #17212b;
    --muted: #64748b;
    --line: #dbe2ea;
    --primary: #166534;
    --primary-dark: #14532d;
    --primary-soft: #dcfce7;
    --danger: #991b1b;
    --danger-soft: #fee2e2;
    --warning: #92400e;
    --warning-soft: #fef3c7;
    --info: #075985;
    --info-soft: #e0f2fe;
    --sidebar: #10251a;
    --sidebar-text: #d8e8dd;
    --shadow: 0 10px 30px rgba(15, 23, 42, .07);
}
* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text); background: var(--bg); font-size: 15px; }
a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, select { font: inherit; }
code { background: #eef2f7; padding: .1rem .35rem; border-radius: .35rem; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 250px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--sidebar); color: var(--sidebar-text); padding: 1.25rem 1rem; }
.brand { display: block; color: #fff; font-size: 1.3rem; font-weight: 800; letter-spacing: .04em; padding: .45rem .65rem 1.2rem; }
.brand span, .login-brand span { color: #86efac; }
.brand:hover { text-decoration: none; }
.nav { display: flex; flex-direction: column; gap: .3rem; }
.nav-link { display: flex; align-items: center; gap: .75rem; padding: .72rem .8rem; color: var(--sidebar-text); border-radius: .65rem; }
.nav-link:hover { background: rgba(255,255,255,.08); text-decoration: none; }
.nav-link.active { background: #1f6b3b; color: #fff; }
.nav-icon { width: 1.25rem; text-align: center; opacity: .9; }
.sidebar-footer { margin-top: auto; border-top: 1px solid rgba(255,255,255,.12); padding: 1rem .65rem .2rem; }
.user-name { color: #fff; font-weight: 700; }
.user-roles { color: #9db7a5; font-size: .78rem; margin: .15rem 0 .8rem; }
.main { min-width: 0; }
.topbar { padding: 1.5rem 2rem .9rem; background: rgba(244,246,248,.94); position: sticky; top: 0; z-index: 5; backdrop-filter: blur(8px); border-bottom: 1px solid rgba(219,226,234,.8); }
.topbar h1 { margin: 0; font-size: 1.55rem; }
.topbar p { margin: .2rem 0 0; }
.content { padding: 1.4rem 2rem 3rem; }
.muted { color: var(--muted); }
.small { font-size: .82rem; }
.notice { border: 1px solid #bae6fd; background: #f0f9ff; color: #0c4a6e; padding: .8rem 1rem; border-radius: .7rem; margin-bottom: 1.2rem; }
.section-heading, .toolbar, .detail-header, .card-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.section-heading { margin: .5rem 0 1rem; }
.section-heading h2, .card-header h2, .detail-header h2 { margin: 0; }
.section-heading p, .detail-header p { margin: .25rem 0 0; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 1.2rem; }
.stats-grid.compact { margin-top: 1.2rem; }
.stat-card, .card { background: var(--panel); border: 1px solid var(--line); border-radius: .85rem; box-shadow: var(--shadow); }
.stat-card { padding: 1.1rem 1.2rem; }
.stat-card span { display: block; color: var(--muted); font-size: .84rem; }
.stat-card strong { display: block; font-size: 1.7rem; margin-top: .25rem; }
.card { margin-bottom: 1.2rem; overflow: hidden; }
.card-header { padding: 1rem 1.15rem; border-bottom: 1px solid var(--line); }
.card-header h2 { font-size: 1.05rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .72rem .85rem; border-bottom: 1px solid var(--line); vertical-align: top; }
th { color: #475569; background: #f8fafc; font-size: .78rem; text-transform: uppercase; letter-spacing: .035em; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: #fbfdfb; }
.strong-link { font-weight: 700; color: #14532d; }
.empty { text-align: center; color: var(--muted); padding: 1.5rem; }
.badge { display: inline-flex; align-items: center; border-radius: 999px; padding: .25rem .55rem; font-size: .75rem; font-weight: 700; white-space: nowrap; }
.badge-success { background: var(--primary-soft); color: var(--primary-dark); }
.badge-info { background: var(--info-soft); color: var(--info); }
.badge-warning { background: var(--warning-soft); color: var(--warning); }
.badge-muted { background: #e2e8f0; color: #475569; }
.btn { border: 1px solid transparent; border-radius: .55rem; padding: .58rem .85rem; cursor: pointer; display: inline-flex; justify-content: center; align-items: center; font-weight: 700; }
.btn:hover { text-decoration: none; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-ghost { background: transparent; color: inherit; border-color: var(--line); }
.sidebar .btn-ghost { border-color: rgba(255,255,255,.18); color: #fff; }
.btn-block { width: 100%; }
.toolbar { margin-bottom: 1rem; flex-wrap: wrap; }
.search-form, .filter-form { display: flex; gap: .55rem; align-items: flex-end; flex-wrap: wrap; }
input, select { border: 1px solid #cbd5e1; border-radius: .55rem; padding: .58rem .7rem; background: #fff; color: var(--text); min-height: 40px; }
input:focus, select:focus { outline: 3px solid rgba(22,101,52,.15); border-color: var(--primary); }
.search-form input { min-width: 280px; }
.filter-form label { display: grid; gap: .28rem; color: var(--muted); font-size: .8rem; }
.detail-header { padding: 1.2rem; }
.back-link { display: inline-block; margin-bottom: .45rem; font-size: .84rem; }
.match-list { padding: .35rem 1rem .8rem; }
.match-item { padding: .72rem .15rem; border-bottom: 1px solid var(--line); }
.match-item:last-child { border-bottom: 0; }
.match-time { color: var(--muted); font-size: .8rem; margin-bottom: .18rem; }
.score { font-weight: 800; font-size: 1rem; white-space: nowrap; }
.pagination { display: flex; gap: .35rem; justify-content: center; margin-top: 1rem; }
.pagination a { min-width: 2.2rem; height: 2.2rem; display: inline-flex; justify-content: center; align-items: center; border: 1px solid var(--line); background: #fff; border-radius: .45rem; }
.pagination a.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.report-body { padding: 1.2rem; line-height: 1.65; white-space: normal; }
.error-card { padding: 1.4rem; max-width: 700px; }
.login-body { min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: radial-gradient(circle at top left, #dcfce7, transparent 36%), #edf2f0; }
.login-card { width: min(430px, 100%); background: #fff; border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 24px 70px rgba(15,23,42,.14); padding: 2rem; }
.login-brand { color: #153f26; font-weight: 900; letter-spacing: .05em; font-size: 1.35rem; }
.login-card h1 { margin-bottom: .2rem; }
.field { display: grid; gap: .35rem; margin: 1rem 0; color: #475569; font-size: .85rem; }
.field input { width: 100%; }
.alert { padding: .75rem .85rem; border-radius: .6rem; margin: 1rem 0; }
.alert-danger { background: var(--danger-soft); color: var(--danger); }
.alert-warning { background: var(--warning-soft); color: var(--warning); }
@media (max-width: 1050px) {
    .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-2 { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .app-shell { grid-template-columns: 1fr; }
    .sidebar { position: static; height: auto; padding: .7rem; }
    .brand { padding-bottom: .6rem; }
    .nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sidebar-footer { margin-top: .7rem; }
    .topbar { position: static; padding: 1rem; }
    .content { padding: 1rem; }
    .stats-grid { grid-template-columns: 1fr 1fr; }
    .search-form input { min-width: 0; width: 100%; }
    .search-form { width: 100%; }
    .section-heading, .detail-header { align-items: flex-start; }
}
@media (max-width: 460px) {
    .nav { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: 1fr; }
    .login-card { padding: 1.3rem; }
}

/* v0.2.x – editační formuláře */
.form-card { padding: 1.2rem; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .2rem 1rem; }
.field-wide { grid-column: 1 / -1; }
textarea { font: inherit; width: 100%; border: 1px solid #cbd5e1; border-radius: .55rem; padding: .7rem; resize: vertical; color: var(--text); background: #fff; }
textarea:focus { outline: 3px solid rgba(22,101,52,.15); border-color: var(--primary); }
.field-error { color: var(--danger); font-weight: 700; }
.field-help { color: var(--muted); }
.check-field { display: flex; align-items: center; gap: .55rem; margin: .7rem 0; }
.check-field input { min-height: auto; width: 1.1rem; height: 1.1rem; }
.form-actions { display: flex; gap: .65rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.detail-actions { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap; }
.card-body { padding: 1rem 1.15rem; }
.inline-form { display: flex; align-items: end; gap: .6rem; flex-wrap: wrap; }
.inline-form label { display: grid; gap: .28rem; color: var(--muted); font-size: .82rem; }
.stack-form { display: grid; gap: .7rem; }
.compact-form { flex-wrap: nowrap; }
.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover { background: #7f1d1d; }
.btn-small { padding: .4rem .6rem; font-size: .82rem; }
.alert-success { background: var(--primary-soft); color: var(--primary-dark); }
.alert-info { background: var(--info-soft); color: var(--info); }
.action-card { overflow: visible; }
@media (max-width: 760px) {
    .form-grid { grid-template-columns: 1fr; }
    .field-wide { grid-column: auto; }
    .compact-form { flex-wrap: wrap; }
}

.readonly-value {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    padding: .7rem .8rem;
    border: 1px solid var(--border, #d9dee7);
    border-radius: .55rem;
    background: #f5f7fa;
    font-weight: 600;
}

/* v0.3.0 – členské příspěvky */
.fees-filter { flex: 1 1 720px; }
.fees-filter input[type="search"] { min-width: 260px; }
.fees-stats .money-total { font-size: 1.35rem; }
.settings-form { align-items: end; }
.settings-note { flex: 1 1 280px; }
.settings-note input { width: 100%; }
.footer-toolbar { margin-top: .75rem; justify-content: space-between; }
.fee-row-cancelled td { background: #fffaf0; }
.fee-row-paid td:first-child { border-left: 3px solid var(--primary); }
.plain-list { margin: 0; padding-left: 1.2rem; }
.plain-list li + li { margin-top: .35rem; }
.detail-list { margin: 0; display: grid; gap: .55rem; }
.detail-list > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: .75rem; border-bottom: 1px solid var(--line); padding-bottom: .45rem; }
.detail-list > div:last-child { border-bottom: 0; padding-bottom: 0; }
.detail-list dt { color: var(--muted); }
.detail-list dd { margin: 0; font-weight: 600; }
.danger-zone { border-color: #fecaca; }
.danger-zone .card-header { background: #fff7f7; }
@media (max-width: 760px) {
    .fees-filter { width: 100%; }
    .fees-filter label, .fees-filter input, .fees-filter select { width: 100%; }
    .detail-list > div { grid-template-columns: 1fr; gap: .1rem; }
}
