/* Estreka Ratsaklubi — Disainisüsteem (navy-steel)
   Laetakse style.css JÄREL ja kirjutab üle tokenid.
   Kandiline, minimalistlik, navy aktsent logo toonis, SVG-ikoonid.
   Vt: Rakenduse kaasaegne kujundus/design_handoff_estreka/README.md */

:root {
    /* Aktsentvärv — navy steel */
    --primary-color: #1a5580;
    --primary-dark: #103a57;
    --primary-light: #2c78a8;

    /* Lisatoonid (kujunduse README) */
    --header-gradient: linear-gradient(135deg, #1a5580 0%, #103a57 100%);
    --admin-sidebar: #0c2c42;
    --accent-bg: #eef4f8;      /* hele aktsent-taust */
    --accent-border: #cfe0ea;  /* aktsent-ääris */
    --on-navy-light: #9cc4dd;  /* hele tekst navy peal */

    /* Kandilised kastid: nurgaraadius 0.
       --radius-full säilib ringidele (avatarid, pillid). */
    --radius-sm: 0;
    --radius: 0;
    --radius-md: 0;
    --radius-lg: 0;
    --radius-xl: 0;
    --radius-2xl: 0;
    --radius-full: 9999px;
}

/* ===== DS KOMPONENDID (ds-*) — Etapp 3/4 kasutab ===== */
.ds-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    flex-shrink: 0;
}

/* Sektsioonisilt — VERSAALIS väike */
.ds-section-label {
    font-size: var(--font-size-xs);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gray-500);
    font-weight: 600;
}

/* Kaart */
.ds-card {
    background: #fff;
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    padding: var(--spacing-6);
}

/* Nupp */
.ds-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-2);
    padding: var(--spacing-3) var(--spacing-5);
    border-radius: var(--radius);
    border: 1px solid transparent;
    font-weight: 600;
    font-size: var(--font-size-sm);
    cursor: pointer;
    text-decoration: none;
    transition: background var(--transition-fast), border-color var(--transition-fast);
}
.ds-btn-primary {
    background: var(--primary-color);
    color: #fff;
}
.ds-btn-primary:hover { background: var(--primary-dark); }
.ds-btn-secondary {
    background: #fff;
    color: var(--gray-800);
    border-color: var(--gray-300);
}
.ds-btn-secondary:hover { border-color: var(--primary-color); color: var(--primary-color); }

/* Tabel */
.ds-table {
    width: 100%;
    border-collapse: collapse;
}
.ds-table th, .ds-table td {
    padding: var(--spacing-3);
    text-align: left;
    border-bottom: 1px solid var(--gray-200);
    white-space: nowrap;
}
.ds-table th {
    font-size: var(--font-size-xs);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--gray-500);
    font-weight: 600;
}

/* Statistikaplokk */
.ds-stat {
    background: #fff;
    border: 1px solid var(--gray-200);
    border-left: 3px solid var(--primary-color);
    padding: var(--spacing-4);
}
/* display:block on kohustuslik, mitte kosmeetika: number ja silt on <span>-id
   ja jäid muidu ühele reale kokku ("5Starti"). Varem päästis juhuslik
   reavahetus markupis, mis renderdus tühikuna — ja inline-elemendil ei
   mõjunud ka silid margin-top. (2026-07-30) */
.ds-stat .ds-stat-number {
    display: block;
    font-size: var(--font-size-3xl);
    font-weight: 800;
    color: var(--gray-900);
    line-height: 1.1;
}
.ds-stat .ds-stat-label {
    display: block;
    font-size: var(--font-size-xs);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--gray-500);
    margin-top: 6px;
    line-height: 1.3;
}
/* Selgitav rida numbri all — statistikalehe terminid (nt "veatu sõit")
   vajavad lahtimõtestamist kohe numbri juures (2026-07-30). */
.ds-stat .ds-stat-hint {
    display: block;
    font-size: 12px;
    text-transform: none;
    letter-spacing: 0;
    color: var(--gray-500);
    margin-top: 3px;
    line-height: 1.35;
}
.ds-note {
    font-size: 13px;
    color: var(--gray-500);
    margin: 8px 0 14px;
}

/* Silt/badge */
.ds-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-1);
    padding: 2px var(--spacing-2);
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
    font-size: var(--font-size-xs);
    font-weight: 700;
    letter-spacing: 0.03em;
}

/* Teade */
.ds-alert {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-2);
    padding: var(--spacing-3) var(--spacing-4);
    border: 1px solid var(--gray-200);
    border-left: 3px solid var(--primary-color);
    background: var(--gray-50);
    font-size: var(--font-size-sm);
}
.ds-alert-warning { border-left-color: var(--warning-color); }
.ds-alert-error { border-left-color: var(--danger-color); }

/* --- Vitriin (moodul 2; navy-steel reavaade) --- */
.ds-year-filter { display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0 24px; }
.ds-timeline { display: flex; flex-direction: column; gap: 14px; }
.ds-timeline-card { display: flex; gap: 0; align-items: stretch; padding: 0;
    overflow: hidden; text-decoration: none; color: inherit; }
.ds-timeline-card:hover h2 { color: var(--primary-color); }
.ds-timeline-date { width: 88px; flex-shrink: 0; text-align: center;
    background: var(--gray-50, #f8fafc);
    border-right: 1px solid var(--gray-200, #e2e8f0);
    display: flex; flex-direction: column; align-items: center;
    justify-content: center; padding: 16px 8px; }
.ds-timeline-date .ds-stat-number { font-size: 30px; }
.ds-timeline-body { flex: 1; padding: 20px 24px; }
.ds-timeline-body h2 { margin: 0 0 8px; font-size: 19px; }
.ds-timeline-meta { display: flex; gap: 12px; align-items: center;
    font-size: 13px; color: var(--gray-500, #64748b); margin-bottom: 10px;
    flex-wrap: wrap; }
.ds-timeline-stats { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13px;
    color: var(--gray-500, #64748b); }
.ds-timeline-stats strong { color: var(--gray-700, #334155); }
.ds-timeline-photo { width: 150px; flex-shrink: 0; object-fit: cover; }
@media (max-width: 600px) {
    .ds-timeline-card { flex-direction: column; gap: 0; }
    .ds-timeline-date { width: 100%; flex-direction: row; gap: 8px;
        border-right: none; border-bottom: 1px solid var(--gray-200, #e2e8f0);
        padding: 10px 14px; justify-content: flex-start; }
    .ds-timeline-body { padding: 14px; }
    .ds-timeline-photo { width: 100%; height: 160px; }
}
.ds-photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 8px; margin: 16px 0 24px; }
.ds-photo-grid img { width: 100%; height: 110px; object-fit: cover; display: block; }

/* --- Võistluse alamleht (vitriin 3.0) --- */
/* Fotogalerii: kõik pildid ühes aknas — mobiilis näpuga, töölaual nooltega.
   object-fit: contain, sest võistlusfotodelt ei tohi sportlasi välja lõigata. */
.ds-gallery { position: relative; margin: 16px 0 24px; }
.ds-gallery-track {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
    scroll-behavior: smooth; overscroll-behavior-x: contain;
    border-radius: var(--radius); background: var(--gray-100, #f1f5f9);
    scrollbar-width: none; -ms-overflow-style: none;
}
.ds-gallery-track::-webkit-scrollbar { display: none; }
.ds-gallery-slide { flex: 0 0 100%; scroll-snap-align: center; display: block; }
.ds-gallery-slide img { width: 100%; height: 440px; object-fit: contain; display: block; }
.ds-gallery-nav {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 40px; height: 40px; border-radius: 50%; border: none; cursor: pointer;
    background: rgba(0, 0, 0, 0.55); color: #fff;
    display: none; align-items: center; justify-content: center; padding: 0;
}
.ds-gallery-nav:hover { background: rgba(0, 0, 0, 0.75); }
.ds-gallery-nav .ds-icon { width: 22px; height: 22px; }
.ds-gallery-prev { left: 12px; }
.ds-gallery-next { right: 12px; }
.ds-gallery-count {
    position: absolute; right: 12px; bottom: 12px;
    background: rgba(0, 0, 0, 0.6); color: #fff;
    font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px;
}
.ds-gallery-hint { font-size: 12px; color: var(--gray-500, #64748b); margin-top: 6px; }
@media (min-width: 641px) {
    .ds-gallery-multi .ds-gallery-nav { display: flex; }
}
@media (max-width: 640px) {
    .ds-gallery-slide img { height: 260px; }
}
.ds-share-row { display: flex; gap: 10px; flex-wrap: wrap; margin: 18px 0; }
.ds-results-cards { display: none; }
.ds-rc-group { border: 1px solid var(--gray-200, #e2e8f0); border-radius: var(--radius);
    padding: 12px 14px; margin-bottom: 10px; }
.ds-rc-name { display: flex; align-items: center; gap: 4px; font-weight: 600;
    margin-bottom: 4px; }
.ds-rc-start { display: flex; flex-wrap: wrap; gap: 4px 10px; padding: 7px 0;
    border-top: 1px solid var(--gray-100, #f1f5f9); font-size: 14px; }
.ds-rc-start:first-of-type { border-top: none; }
.ds-rc-place { font-weight: 600; white-space: nowrap; }
.ds-rc-detail { color: var(--gray-500, #64748b); overflow-wrap: anywhere; }
@media (max-width: 640px) {
    .ds-results-table { display: none; }
    .ds-results-cards { display: block; }
}
.ds-avatar-sm { width: 28px; height: 28px; object-fit: cover; border-radius: 0;
    vertical-align: middle; margin-right: 8px; }
.ds-hero { padding: 32px 0; }
.ds-hero h1 { font-size: 32px; margin: 8px 0 16px; }
.ds-hero p { max-width: 640px; }

/* --- Klubistatistika tulbad --- */
.ds-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 16px; margin: 24px 0; }
.ds-bars { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.ds-bar-row { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.ds-bar-label { min-width: 96px; }
.ds-bar-track { flex: 1; background: var(--gray-100, #f0f0f0); height: 20px; }
.ds-bar-fill { display: block; height: 100%; background: var(--primary-color); }
.ds-bar-value { min-width: 40px; text-align: right; font-weight: 700; }

/* --- Moodul 3: profiili sügavus --- */
.ds-post-meta { display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
    margin-bottom: 8px; }
.ds-post-actions { display: flex; gap: 8px; margin-top: 12px; }
.ds-form-row { margin-bottom: 12px; }
.ds-form-row label { display: block; font-weight: 600; margin-bottom: 4px; }
.ds-form-row input[type=text], .ds-form-row input[type=url],
.ds-form-row input[type=date], .ds-form-row select, .ds-form-row textarea {
    width: 100%; max-width: 640px; padding: 8px; border: 1px solid var(--gray-300, #ccc); }
.ds-form-inline { display: flex; gap: 16px; flex-wrap: wrap; }
.ds-form-inline > span { flex: 0 1 200px; }
.ds-video { position: relative; padding-bottom: 56.25%; height: 0; max-width: 640px; }
.ds-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* Instagrami manused on püstised (postitus/reel) — kõrgem kast, kitsam laius */
.ds-video-tall { padding-bottom: 125%; max-width: 400px; }
@media (min-width: 480px) { .ds-video-tall { padding-bottom: 500px; } }

/* Postituse KÜLGES olevad fotod — suured nagu video, mitte galerii-pisipildid.
   Üksik foto täislaiuses (kuni video laiuseni), mitu kahes veerus. */
.ds-photo-post { display: grid; grid-template-columns: repeat(2, 1fr);
    gap: 8px; margin: 16px 0; max-width: 640px; }
.ds-photo-post.one { grid-template-columns: 1fr; }
.ds-photo-post img { width: 100%; height: 240px; object-fit: cover;
    display: block; border-radius: 10px; }
.ds-photo-post.one img { height: auto; max-height: 520px; object-fit: cover; }
@media (max-width: 480px) { .ds-photo-post img { height: 160px; } }

/* Kabjaplaks — hobuseteemaline meeldimine */
.kp-form { display: inline-block; margin: 6px 0 14px; }
.fd-comments { margin-top: 4px; }
.fd-comments .ds-comment-form textarea { margin-top: 6px; }
.kp-btn { display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
    font-size: 13px; font-weight: 600; padding: 6px 12px; border-radius: 9999px;
    border: 1px solid var(--gray-300, #cbd5e1); background: transparent;
    color: var(--gray-600, #6b7280); }
.kp-btn svg { width: 15px; height: 15px; }
.kp-btn:hover { border-color: var(--primary-color, #9184d9); color: var(--primary-color, #9184d9); }
.kp-btn.mine { border-color: var(--primary-color, #9184d9); color: var(--primary-color, #9184d9);
    background: rgba(145, 132, 217, .1); }
.ds-photo-cell { position: relative; }
.ds-photo-cell form { position: absolute; top: 4px; right: 4px; }
/* Galerii pealdise+nähtavuse vorm EI ole nurga-ülekate nagu kustutusnupp, vaid
   täisrida (pealdis, nähtavuse valik, 2 nuppu) — absoluutsena oli see lahtrist
   laiem (mõõdetud 768px: vorm 195px, lahter 174px) ja kuna ainult `right` oli
   seotud, kasvas VASAKULE: esimeses veerus üle ekraaniserva (left -9px), mujal
   naaberfoto peale. Ülekattena murduks see omakorda 98px kõrguseks ja kataks
   110px pildi ära — seega tõsta voogu, pildi alla. */
/* NB spetsiifilisus: `.ds-photo-cell form` on klass+element (0,1,1), seega paljas
   `.ds-photo-meta-form` (0,1,0) EI kirjutaks position'it üle. Vaja kahte klassi. */
.ds-photo-cell .ds-photo-meta-form {
    position: static;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}
.ds-photo-cell .ds-photo-meta-form input[name="caption"] { flex: 1 1 100%; min-width: 0; }
.ds-photo-cell .ds-photo-meta-form select { flex: 1 1 auto; min-width: 0; }
.ds-btn-xs { padding: 2px 6px; font-size: 12px; }
.ds-muted { color: var(--gray-500, #666); }
.ds-goal-done { text-decoration: line-through; opacity: .7; }
.ds-comment { border-top: 1px solid var(--gray-200, #ddd); padding: 8px 0; }
.ds-comment-meta { font-size: 13px; color: var(--gray-500, #666); }
.ds-member-head { display: flex; gap: 16px; align-items: flex-start; }
.ds-member-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 12px; }
.ds-member-card { display: flex; flex-direction: column; align-items: center;
    gap: 8px; text-decoration: none; padding: 16px; }
.ds-member-noavatar { font-size: 40px; opacity: .4; }
.ds-comment-form textarea { width: 100%; max-width: 640px; display: block; margin-bottom: 6px; }

/* --- Moodul 4: sotsiaalne kiht --- */
.ds-feed-author { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.ds-feed-author img { border-radius: 50%; }
.ds-feed-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 800px) { .ds-feed-layout { grid-template-columns: 1fr; } }
.ds-bday-today { font-weight: 700; color: var(--primary-color); }
.ds-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%;
    background: var(--danger-color, #c00); margin-left: 6px; }
.ds-msg-thread { display: flex; flex-direction: column; gap: 8px; max-width: 640px;
    margin-bottom: 16px; }
.ds-msg { padding: 8px 12px; border-radius: 0; max-width: 80%; }
.ds-msg-mine { align-self: flex-end; background: var(--accent-bg); }
.ds-msg-theirs { align-self: flex-start; background: var(--gray-100, #f0f0f0); }
.ds-msg-time { font-size: 12px; color: var(--gray-500, #666); margin-top: 2px; }
.ds-convo { display: flex; gap: 10px; align-items: center; padding: 10px 0;
    border-top: 1px solid var(--gray-200, #ddd); text-decoration: none; }

/* --- Moodul 5: suhtlus & teavitused --- */
.ds-notif { display: flex; gap: 10px; align-items: baseline; padding: 10px 0;
    border-top: 1px solid var(--gray-200, #ddd); }
.ds-notif-unread { font-weight: 700; }
.ds-notif-unread::before { content: ''; display: inline-block; width: 8px; height: 8px;
    border-radius: 50%; background: var(--primary-color, #5865f2); flex-shrink: 0;
    align-self: center; }
/* loetud teavitus: mahedam toon, et lugemata värsked eristuksid selgelt */
.ds-notif-read { color: var(--gray-500, #888); }
.ds-notif-read a { color: var(--gray-600, #666); }
/* väike silt Uus / Loetud kirje ees */
.ds-notif-tag { display: inline-block; font-size: 11px; font-weight: 700;
    line-height: 1; text-transform: uppercase; letter-spacing: .04em;
    padding: 3px 7px; border-radius: 999px; margin-right: 6px; vertical-align: middle; }
.ds-notif-tag-new { background: var(--accent-bg); color: var(--primary-color, #5865f2); }
.ds-notif-tag-read { background: var(--gray-200, #eee); color: var(--gray-500, #888);
    font-weight: 600; }
.ds-event-badge { display: inline-flex; gap: 6px; align-items: center;
    background: var(--accent-bg); padding: 2px 8px; font-weight: 600; }
.ds-answer-accepted { border-left: 3px solid var(--primary-color); background: var(--accent-bg);
    padding: 10px 12px; }
.ds-answer { border-top: 1px solid var(--gray-200, #ddd); padding: 10px 0; }
/* lugemata ettepanek: sama muster mis vastuvõetud vastusel — aktsentriba +
   mahe taust. Lugemata ei ole viga, seega aktsent, mitte danger (vrd .ds-notif-unread). */
.ds-suggestion-unread { border-left: 3px solid var(--primary-color); background: var(--accent-bg);
    padding: 10px 12px; }

/* ===== LEHEMUSTER (pg-*) — liikme lehtede jagatud paigutus
   Vt Tulemused.dc.html: tagasilink + päis + stat-plokid + filtrikiibid +
   tabel koht-badge'idega. ===== */

/* Tagasilink lehe ülaservas */
.pg-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--gray-500, #64748b);
    margin-bottom: 16px;
    text-decoration: none;
}
.pg-back:hover { color: var(--primary-color); }

/* Lehe päis: versaalis silt + pealkiri vasakul, tegevusnupp paremal */
.pg-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 28px;
}
.pg-head .ds-section-label { margin-bottom: 6px; letter-spacing: 0.1em; }
.pg-head h1 {
    font-size: 30px;
    font-weight: 800;
    line-height: 1.15;
    color: var(--gray-900, #0f172a);
    margin: 0;
}
.pg-head-sub { font-size: 14px; color: var(--gray-500, #64748b); margin: 6px 0 0; }

/* Stat-plokkide rida (kasuta sees .ds-stat plokke) */
.pg-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 24px;
}
.pg-stats .ds-stat { padding: 18px 20px; }

/* Filtririba: kiibid vasakul, lisavalik (nt hooaeg) paremal */
.pg-filterbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}
.pg-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.pg-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    background: #fff;
    color: var(--gray-600, #475569);
    border: 1px solid var(--gray-300, #cbd5e1);
    text-decoration: none;
    cursor: pointer;
}
.pg-chip:hover { border-color: var(--primary-color); color: var(--primary-color); }
.pg-chip.active {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

/* Tabel valges kaardis; kitsal ekraanil kerib rõhtsalt */
.pg-table-wrap {
    background: #fff;
    border: 1px solid var(--gray-200, #e2e8f0);
    overflow-x: auto;
}
.pg-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}
.pg-table th {
    text-align: left;
    padding: 14px 20px;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--gray-500, #64748b);
    font-weight: 700;
    border-bottom: 1px solid var(--gray-200, #e2e8f0);
}
.pg-table td {
    padding: 16px 20px;
    font-size: 14px;
    color: var(--gray-600, #475569);
    border-bottom: 1px solid var(--gray-100, #f1f5f9);
    vertical-align: middle;
}
.pg-table tbody tr:last-child td { border-bottom: none; }
.pg-table tbody tr { transition: background 0.12s; }
.pg-table tbody tr:hover { background: var(--gray-50, #f8fafc); }
.pg-table .pg-td-strong { font-weight: 600; color: var(--gray-900, #0f172a); }
.pg-td-date { white-space: nowrap; }
.pg-td-date .pg-td-year { font-size: 12px; color: var(--gray-400, #94a3b8); }

/* Koha-badge: poodium navy, muu hall */
.pg-place {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 4px;
    background: var(--gray-100, #f1f5f9);
    color: var(--gray-600, #475569);
    font-size: 13px;
    font-weight: 700;
}
.pg-place.podium {
    background: var(--primary-color);
    color: #fff;
    font-weight: 800;
}

/* Hele navy silt (nt distsipliin/tüüp) */
.pg-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    background: var(--accent-bg);
    color: var(--primary-color);
    font-size: 12px;
    font-weight: 700;
    border: 1px solid var(--accent-border);
}

/* Hooajavalik filtririba paremas servas */
.pg-season {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--gray-500, #64748b);
}
.pg-season select {
    padding: 8px 14px;
    background: #fff;
    border: 1px solid var(--gray-300, #cbd5e1);
    font-weight: 600;
    font-size: 13px;
    color: var(--gray-900, #0f172a);
    cursor: pointer;
}

/* Filtrite paneel: töölaual tavaline riba (nagu seni), mobiilis alt avanev
   paneel üle sisu — sama muster mis võistluskalendri .vk-filters.
   Märkus: <details> ei näita suletuna sisu, seepärast avab lehe skript
   selle töölaual kohe (vt athlete/results.php inline-skript). */
.pg-filtersheet { min-width: 0; }
.pg-filtersheet > summary { display: none; }
.pg-sheet-backdrop, .pg-sheet-head { display: none; }
.pg-fcount { background: var(--primary-color); color: #fff; font: 700 11px inherit;
    padding: 1px 7px; border-radius: 9999px; }

/* Reasisesed ikoontegevused (muuda/kustuta) */
.pg-row-actions { display: inline-flex; gap: 4px; }
.pg-row-actions form { display: inline-flex; }
.pg-row-actions a, .pg-row-actions button {
    color: var(--gray-400, #94a3b8);
    display: inline-flex;
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
}
.pg-row-actions a:hover, .pg-row-actions button:hover { color: var(--primary-color); }
.pg-row-actions .pg-action-danger:hover { color: var(--danger-color, #dc2626); }

@media (max-width: 900px) {
    .pg-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .pg-head h1 { font-size: 24px; }
    .pg-stats { gap: 8px; }
}

/* Mobiilis muutub filtririba alt avanevaks paneeliks üle sisu: reas hoitav
   ruum on 0, alles jääb ainult "Filtrid" nupp. Piir 768px = sama, mis
   tab-riba oma (nocturne.css). Paneel katab tab-riba (z-index 300). */
@media (max-width: 768px) {
    .pg-filtersheet > summary {
        display: flex; align-items: center; gap: 8px; cursor: pointer;
        list-style: none; padding: 10px 15px; margin-bottom: 16px;
        font: 600 13px inherit; color: var(--gray-600, #475569);
        background: var(--noct-surface, #fff);
        border: 1px solid var(--gray-300, #cbd5e1);
    }
    .pg-filtersheet > summary::-webkit-details-marker { display: none; }
    .pg-filtersheet > summary svg { width: 16px; height: 16px; flex-shrink: 0; }
    .pg-filtersheet > .pg-sheet-backdrop {
        display: block; position: fixed; inset: 0; z-index: 399;
        background: rgba(0, 0, 0, .55);
    }
    .pg-filtersheet > .pg-filterbar {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 400;
        flex-direction: column; align-items: stretch; justify-content: flex-start;
        gap: 14px; margin: 0;
        /* dvh arvestab mobiilibrauseri dünaamilist tööriistariba, vh mitte */
        max-height: calc(100vh - 96px);
        max-height: calc(100dvh - 96px);
        overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
        background: var(--noct-surface, #fff);
        border-top: 1px solid var(--gray-300, #cbd5e1);
        padding: 0 16px calc(16px + env(safe-area-inset-bottom, 0px));
        box-shadow: 0 -10px 34px rgba(0, 0, 0, .5);
        animation: pg-sheet-up .18s ease-out;
    }
    .pg-filtersheet .pg-sheet-head {
        display: flex; align-items: center; justify-content: space-between;
        position: sticky; top: 0; z-index: 1;
        margin: 0 -16px 2px; padding: 14px 16px 12px;
        background: var(--noct-surface, #fff);
        border-bottom: 1px solid var(--gray-200, #e2e8f0);
        font: 700 15px inherit; color: var(--gray-900, #0f172a);
    }
    .pg-filtersheet .pg-sheet-close {
        background: none; border: 0; padding: 0 6px; cursor: pointer;
        font: 400 26px/1 inherit; color: var(--gray-500, #64748b);
    }
    /* Paneelis on kogu ekraani laius — kibud murduvad ridadele */
    .pg-filtersheet .pg-chips { flex-wrap: wrap; }
    .pg-filtersheet .pg-season { justify-content: space-between; }
    .pg-filtersheet .pg-season select { flex: 1; min-width: 0; }
    body.pg-sheet-open { overflow: hidden; }
}
@keyframes pg-sheet-up {
    from { transform: translateY(14px); opacity: 0; }
    to   { transform: none; opacity: 1; }
}

/* --- 6-lehe uuendus: jagatud komponendid (vt specs/2026-07-22-kuus-lehte-disain-design.md) --- */

/* Otsinguväli (päises/tööriistaribal) */
.ds-search { display: flex; align-items: center; gap: 8px; padding: 10px 14px;
    background: #fff; border: 1px solid var(--gray-300, #cbd5e1); min-width: 240px; }
.ds-search input { border: none; outline: none; background: transparent;
    font: inherit; font-size: 14px; color: var(--gray-900, #0f172a); width: 100%; }
.ds-search svg { color: var(--gray-400, #94a3b8); flex-shrink: 0; }

/* Horisontaalselt keritav kiibirida (mobiilil) */
.ds-chiprow { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; flex-wrap: wrap; }
.ds-chiprow::-webkit-scrollbar { height: 6px; }
@media (max-width: 600px) { .ds-chiprow { flex-wrap: nowrap; } }

/* Segmenteeritud lüliti (nt Kõik / Ainult jälgitavad) */
.ds-segment { display: inline-flex; border: 1px solid var(--gray-300, #cbd5e1); background: #fff; }
.ds-segment a { padding: 9px 18px; font-size: 13px; font-weight: 600; color: var(--gray-600, #475569); }
.ds-segment a + a { border-left: 1px solid var(--gray-300, #cbd5e1); }
.ds-segment a.active { background: var(--primary-color); color: #fff; }

/* Tühi olek */
.ds-empty { background: #fff; border: 1px dashed var(--gray-300, #cbd5e1);
    padding: 48px 24px; text-align: center; }
.ds-empty svg { color: var(--gray-300, #cbd5e1); margin: 0 auto 14px; display: block; }
.ds-empty h3 { font-size: 16px; font-weight: 700; color: var(--gray-900, #0f172a); margin-bottom: 4px; }
.ds-empty p { font-size: 14px; color: var(--gray-500, #64748b); margin: 0; }

/* Loenduri täpp kiibil (nt vastamata 2) */
.ds-chip-count { background: var(--danger-color, #ef4444); color: #fff; font-size: 11px;
    font-weight: 700; padding: 0 6px; border-radius: 9999px; }

/* Võistluskalender: kuusildid, allika-sildid, huvi-nupp */
.ds-cal-month { font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
    color: var(--gray-400, #94a3b8); font-weight: 700; margin: 0 0 10px; }
.ds-source { padding: 1px 8px; font-size: 10px; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase; }
.ds-source-net { background: var(--gray-100, #f1f5f9); color: var(--gray-500, #64748b); }
.ds-source-club { background: var(--accent-bg, #eef4f8); color: var(--primary-color);
    border: 1px solid var(--accent-border, #cfe0ea); }
.ds-interest { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px;
    font-size: 13px; font-weight: 600; background: #fff; color: var(--gray-600, #475569);
    border: 1px solid var(--gray-300, #cbd5e1); cursor: pointer; }
.ds-interest.active { background: var(--accent-bg, #eef4f8); color: var(--primary-color);
    border-color: var(--accent-border, #cfe0ea); }

/* Tulemused: rekordi märgis + mobiili kaardivaade */
.pg-record { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px;
    padding: 1px 7px; background: var(--accent-bg, #eef4f8); color: var(--primary-color);
    border: 1px solid var(--accent-border, #cfe0ea); font-size: 10px; font-weight: 700;
    letter-spacing: .03em; text-transform: uppercase; }
.pg-cards { display: none; flex-direction: column; gap: 12px; }
.pg-card { background: #fff; border: 1px solid var(--gray-200, #e2e8f0); padding: 16px;
    display: flex; gap: 14px; align-items: flex-start; }
@media (max-width: 600px) {
    .pg-table-wrap { display: none; }
    .pg-cards { display: flex; }
}

/* Galerii postituste-grupid (2026-07-28) */
.ds-gal-group { margin: 12px 0 18px; }
.ds-gal-group-head { display: flex; align-items: center; justify-content: space-between;
                     gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.ds-gal-group-head strong { font-size: 15px; margin-right: 8px; }
.ds-gal-group-head .ds-muted { font-size: 13px; margin-right: 8px; }


/* ============ Kontakt-mull (km-*) — spec 2026-07-29 ============ */
.km-juur { position: fixed; right: 18px; bottom: 18px; z-index: 380; }
.km-nupp { width: 54px; height: 54px; border-radius: var(--radius-full); border: none;
  background: var(--primary-color); color: #fff; cursor: pointer; display: flex;
  align-items: center; justify-content: center; box-shadow: 0 4px 16px rgba(0,0,0,.25);
  position: relative; z-index: 391; }
.km-nupp:hover { background: var(--primary-dark); }
.km-taust { display: none; }
.km-paneel { display: none; position: absolute; right: 0; bottom: 66px; width: 320px;
  max-width: calc(100vw - 36px); background: var(--gray-100, #fff);
  border: 1px solid var(--gray-200); border-radius: 12px; padding: 18px;
  box-shadow: 0 10px 34px rgba(0,0,0,.3); z-index: 390; }
.km-juur.km-lahti .km-paneel { display: block; }
.km-juur.km-lahti .km-taust { display: block; position: fixed; inset: 0; z-index: 389; }
.km-sulge { position: absolute; top: 8px; right: 10px; border: none; background: none;
  font-size: 22px; line-height: 1; color: var(--gray-500); cursor: pointer; }
.km-tervitus { margin: 0 24px 12px 0; color: var(--gray-800); font-size: 14.5px; line-height: 1.5; }
.km-wa { display: block; text-align: center; background: #25d366; color: #fff;
  font-weight: 600; padding: 11px 14px; border-radius: 8px; text-decoration: none; }
.km-wa:hover { background: #1fb959; color: #fff; }
.km-voi { text-align: center; color: var(--gray-500); font-size: 12.5px; margin: 10px 0; }
.km-vorm { display: flex; flex-direction: column; gap: 8px; }
.km-vorm input, .km-vorm textarea { width: 100%; border: 1px solid var(--gray-300);
  border-radius: 8px; padding: 9px 12px; font: inherit; font-size: 14px;
  background: var(--gray-50, #fff); color: var(--gray-900); }
.km-vorm textarea { resize: vertical; }
.km-hunnik { position: absolute !important; left: -9999px !important; height: 1px; opacity: 0; }
.km-saada { border: none; border-radius: 8px; padding: 11px 14px; font-weight: 600;
  background: var(--primary-color); color: #fff; cursor: pointer; }
.km-saada:hover { background: var(--primary-dark); }
.km-viga { color: #e05d5d; font-size: 13px; }
.km-kinnitus { color: var(--gray-800); font-size: 14.5px; line-height: 1.5; padding: 6px 0; }
@media (max-width: 768px) {
  .km-juur { bottom: 84px; right: 14px; }
}
/* ---------------------------------------------------------------
   Voo kaart (vitriin + liikme postitus) — üks karkass, 2026-07-31
   Kord on ALATI: postitaja → meedia → tekst → jalus → kommentaarid.
   Ühtegi tekstielementi meedia ette (v.a .fd-card-top).
   --------------------------------------------------------------- */
.fd-card { padding: 0; overflow: hidden; }

/* postitaja */
.fd-card-top { display: flex; align-items: center; gap: 9px; padding: 11px 14px; }
.fd-card-top img,
.fd-card-avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover;
    flex-shrink: 0; }
.fd-card-avatar { display: flex; align-items: center; justify-content: center;
    background: var(--accent-bg); border: 1px solid var(--accent-border);
    color: var(--primary-color); font-size: 11px; font-weight: 800; }
.fd-card-who { min-width: 0; }
.fd-card-who strong { display: block; font-size: 12.5px; line-height: 1.2;
    color: var(--gray-900); }
.fd-card-who a { color: inherit; text-decoration: none; }
.fd-card-who a:hover { text-decoration: underline; }
/* block + oma line-height: inline'ina päris see ümbriselt 25.6px reakõrguse ja
   postitaja rida oli 63px (eelarve 54) */
.fd-card-when { display: block; font-size: 11px; line-height: 1.35;
    color: var(--gray-500); }

/* meedia — kuvasuhe, mitte fikseeritud px: kaardi kõrgus ei hüppa */
.fd-card-media { position: relative; display: flex; align-items: center;
    justify-content: center; width: 100%; aspect-ratio: 21 / 9;
    overflow: hidden; background: var(--gray-100); }
.fd-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fd-card-count { position: absolute; right: 10px; bottom: 10px;
    padding: 3px 9px; border-radius: var(--radius-sm, 8px);
    background: rgba(0, 0, 0, .62); color: #fff; font-size: 11px; font-weight: 700;
    pointer-events: none; }

/* Mitu fotot: lohistatav riba samas 21:9 slotis. Puhkeolekus näeb välja nagu
   "esimene + loendur", aga fotod 2..N jäävad voost kättesaadavaks (varem oli
   iga foto eraldi klõbitav ruudustikus — seda ei tohi ära kaotada). */
.fd-card-strip { justify-content: flex-start; overflow-x: auto;
    scroll-snap-type: x mandatory; scrollbar-width: none;
    overscroll-behavior-x: contain; }
.fd-card-strip::-webkit-scrollbar { display: none; }
.fd-card-strip > a { flex: 0 0 100%; height: 100%; scroll-snap-align: center; }

/* fotota vitriinikanne: senine viie variandi rotatsioon, uues slotis */
.fd-card-media.ph .ds-icon { width: 48px; height: 48px; color: #fff; opacity: .55; }
.fd-card-media.ph.v1 { background: linear-gradient(135deg, #6c5ce7, #9184d9); }
.fd-card-media.ph.v2 { background: linear-gradient(135deg, #0f766e, #14b8a6); }
.fd-card-media.ph.v3 { background: linear-gradient(135deg, #b45309, #f59e0b); }
.fd-card-media.ph.v4 { background: linear-gradient(135deg, #9d174d, #ec4899); }
.fd-card-media.ph.v5 { background: linear-gradient(135deg, #1e3a8a, #3b82f6); }

/* video asendab meediasloti ja jääb samasse kohta (16:9) */
.fd-card .ds-video { max-width: 100%; margin: 0; }

/* sisu */
.fd-card-body { display: flex; flex-direction: column; gap: 9px; padding: 14px; }
.fd-card-body h2 { margin: 0; font-size: 17px; font-weight: 800; line-height: 1.22;
    color: var(--gray-900);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; }
.fd-card-body h2 a { color: inherit; text-decoration: none; }
.fd-card-body h2 a:hover { text-decoration: underline; }
.fd-card-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px;
    min-width: 0; font-size: 12.5px; color: var(--gray-600); }
.fd-card-meta .ds-icon { width: 14px; height: 14px; color: var(--gray-500); }
.fd-card-meta .sep { color: var(--gray-300); }
.fd-card-lead { margin: 0; font-size: 13px; line-height: 1.5; color: var(--gray-600);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; }

/* statistika ühel real (kolme lahtri riba oli kõrguse-eelarvele liiga kallis) */
.fd-card-stats { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
    min-width: 0; font-size: 12.5px; color: var(--gray-600); }
.fd-card-stats .sep { color: var(--gray-300); }
.fd-card-best { display: inline-flex; align-items: center; padding: 2px 8px;
    border-radius: var(--radius-sm, 8px); background: var(--accent-bg);
    border: 1px solid var(--accent-border); color: var(--primary-color);
    font-size: 11.5px; font-weight: 700; }

/* jalus */
.fd-card-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
    padding: 9px 14px; border-top: 1px solid var(--gray-200); }
.fd-card-foot .kp-form { margin: 0; }
/* puutekõrgus: 40px on mugav ka pöidlaga (44px nupp + 2×9px polster teeks
   jaluse 62px kõrguseks, mis lõhuks kaardi kõrguse-eelarve) */
.fd-card-foot .kp-btn { min-height: 40px; }
.fd-card-link { display: inline-flex; align-items: center; gap: 3px; margin-left: auto;
    min-height: 40px; font-size: 12.5px; font-weight: 700; color: var(--primary-color);
    text-decoration: none; }
.fd-card-link .ds-icon { width: 14px; height: 14px; }
/* admini moderatsioon: sama rida, aga eraldi otsas (linki ei pruugi olla) */
.fd-card-mod { margin: 0 0 0 auto; }

/* kommentaarid: summary on alati näha, sisu avaneb kaardi lõppu.
   <details> töötab ka ilma JS-ita, nagu senine .fd-sc-komm. */
.fd-card-komm > summary { list-style: none; cursor: pointer; display: flex;
    align-items: center; gap: 7px; min-height: 40px; padding: 6px 14px;
    font-size: 12.5px; font-weight: 600; color: var(--gray-600); }
.fd-card-komm > summary::-webkit-details-marker { display: none; }
.fd-card-komm > summary:hover { color: var(--primary-color); }
.fd-card-komm > summary .ds-icon { width: 15px; height: 15px; flex-shrink: 0; }
.fd-card-komm > summary .ds-icon:last-child { width: 14px; height: 14px;
    margin-left: auto; transition: transform .15s ease; }
.fd-card-komm[open] > summary .ds-icon:last-child { transform: rotate(180deg); }
.fd-card-komm .fd-comments { margin: 0; padding: 0 14px 14px; }
.fd-card-komm .ds-comment + .ds-comment { margin-top: 10px; }
.fd-card-komm .ds-comment-form textarea { width: 100%; }

/* lauaarvutil sama kaart, veidi suurem tüpograafia */
@media (min-width: 700px) {
  .fd-card-body h2 { font-size: 19px; }
  .fd-card-lead { font-size: 13.5px; -webkit-line-clamp: 3; }
}