/* ==========================================================================
   events_stats.css — صفحة «برهان الأحداث» (events_evidence.html)
   مخصّصة للصفحة (extra_css). ألوان الأحكام الثلاثة متغيّراتٌ محلية تُعاد للوضع الليلي.
   ========================================================================== */

.es-wrap {
    --es-match: #2e7d4f;
    --es-near: #b7791f;
    --es-mismatch: #c0392b;
    --es-match-oy: #7cc49a;
    --es-near-oy: #e3bd73;
    max-width: 1180px;
    margin: 34px auto 0;
    padding: 1.4rem 1.6rem;
    color: var(--text-main);
    line-height: 1.85;
}
[data-theme="dark"] .es-wrap {
    --es-match: #5fcf8f;
    --es-near: #f0b44c;
    --es-mismatch: #ff7b6b;
    --es-match-oy: #3a8f5e;
    --es-near-oy: #a8813a;
}

.es-hero { text-align: center; margin-bottom: 1.4em; }
.es-hero h1 { color: var(--primary); font-size: clamp(1.6em, 3.6vw, 2.2em); margin: 0 0 0.4em; }
.es-hero p { max-width: 860px; margin: 0 auto; }
.es-hero .es-subtitle { font-size: 1.15em; font-weight: 700; color: var(--accent, var(--primary)); margin: -0.2em auto 0.9em; }

.es-section { margin: 2em 0; }
.es-section > h2 { color: var(--primary); font-size: 1.25em; margin: 0 0 0.7em; }
.es-section h3 { font-size: 1.05em; margin: 1.2em 0 0.4em; }
.es-method ul { padding-inline-start: 1.3em; margin: 0; }
.es-method li { margin-bottom: 0.45em; }
.es-reasons { padding-inline-start: 1.4em; margin: 0; }
.es-reasons li { margin-bottom: 0.5em; }
.es-reasons q { quotes: none; font-weight: 700; }
.es-note { font-size: 0.92em; opacity: 0.85; margin: 0.6em 0 0; }

/* ===== بطاقات الملخص ===== */
.es-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.es-card {
    padding: 1rem 1.2rem;
    border-radius: var(--main-radius);
    border: var(--glass-border);
    background: var(--main-bg-glass);
    box-shadow: var(--main-shadow);
}
.es-card h3 { margin: 0 0 0.6rem; font-size: 1.05em; }
.es-bar { display: flex; height: 14px; border-radius: 7px; overflow: hidden; background: color-mix(in srgb, var(--text-main) 10%, transparent); }
.es-seg { display: block; height: 100%; }
.es-seg.es-match, .es-dot.es-match { background: var(--es-match); }
.es-seg.es-near, .es-dot.es-near { background: var(--es-near); }
.es-seg.es-mismatch, .es-dot.es-mismatch { background: var(--es-mismatch); }
.es-seg.es-match-oy, .es-dot.es-match-oy { background: var(--es-match-oy); }
.es-seg.es-near-oy, .es-dot.es-near-oy { background: var(--es-near-oy); }
.es-counts { list-style: none; margin: 0.7rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.3rem 1.1rem; font-size: 0.95em; }
.es-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: middle; }

/* ===== وسوم الأحكام ===== */
.es-tag { display: inline-block; font-size: 0.85em; font-weight: 700; white-space: nowrap; }
.es-tag.es-match { color: var(--es-match); }
.es-tag.es-near { color: var(--es-near); }
.es-tag.es-mismatch { color: var(--es-mismatch); }
.es-tag.es-match-oy { color: var(--es-match); opacity: 0.8; }
.es-tag.es-near-oy { color: var(--es-near); opacity: 0.85; }
.es-oy-note { display: block; font-size: 0.8em; opacity: 0.75; }
.es-tag.es-none { opacity: 0.6; }
.es-night {
    display: inline-block;
    font-size: 0.78em;
    padding: 0 0.5em;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--primary) 45%, transparent);
    color: var(--primary);
}

/* ===== الجدول ===== */
.es-table-wrap { overflow-x: auto; }
.es-table { width: 100%; min-width: 860px; border-collapse: collapse; font-size: 0.93em; }
.es-table th, .es-table td {
    padding: 0.55em 0.6em;
    vertical-align: top;
    text-align: start;
    border-bottom: 1px solid color-mix(in srgb, var(--primary) 16%, transparent);
}
.es-table thead th {
    background: color-mix(in srgb, var(--primary) 12%, transparent);
    color: var(--primary);
    white-space: nowrap;
}
.es-id { opacity: 0.7; white-space: nowrap; }
.es-name { font-weight: 700; min-width: 9em; }
.es-text { min-width: 18em; }
.es-weekday { font-weight: 700; }
.es-date { display: block; }
.es-quote { display: block; font-size: 0.88em; opacity: 0.8; quotes: "«" "»"; }
.es-cal { white-space: nowrap; }
.es-day { display: block; }
.es-stored { white-space: nowrap; font-size: 0.92em; }
.es-stored a { color: var(--primary); }
.es-sub { opacity: 0.75; }
.es-others { margin-top: 0.4em; font-size: 0.9em; }
.es-others summary { cursor: pointer; color: var(--primary); }
.es-others ul { margin: 0.3em 0 0; padding-inline-start: 1.1em; }
.es-others li { margin-bottom: 0.35em; }
.es-others q { display: block; quotes: "«" "»"; }
.es-mini { display: inline-block; margin-inline-end: 1em; }
/* رابط صفحة الشهر تحت الحكم (تقويم الخالق، والشهر القمري المقابل للهجري) */
.es-month-link { display: block; margin-top: 0.2em; font-size: 0.82em; color: var(--primary); text-decoration: none; white-space: nowrap; }
.es-month-link:hover { text-decoration: underline; }

.es-links { display: flex; flex-wrap: wrap; gap: 1.2rem; justify-content: center; margin: 2em 0 0; }
.es-links a { color: var(--primary); font-weight: 700; text-decoration: none; }

/* الجوال: كل حدثٍ بطاقةٌ مستقلّة بدل جدولٍ عريض يحتاج تمريرًا أفقيًّا */
@media (max-width: 700px) {
    .es-wrap { padding: 1rem 0.9rem; margin-top: 18px; }
    .es-table { min-width: 0; }
    .es-table thead { display: none; }
    .es-table, .es-table tbody, .es-table tr, .es-table th, .es-table td { display: block; width: auto; }
    .es-table tr {
        margin-bottom: 0.9rem;
        padding: 0.6rem 0.8rem;
        border-radius: var(--main-radius);
        border: var(--glass-border);
        background: var(--main-bg-glass);
    }
    .es-table th, .es-table td { border: 0; padding: 0.25em 0; }
    .es-table .es-id { float: inline-end; }
    .es-table .es-name { font-size: 1.05em; }
    .es-table td[data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 0.8em;
        color: var(--primary);
        opacity: 0.85;
    }
    .es-cal, .es-stored { white-space: normal; }
    .es-cal .es-day { display: inline; margin-inline-end: 0.5em; }
}

/* «قراءة أخرى» تحت الحدث (notes في events_narrations.json) — لا تغيّر الحكم */
.es-note-alt {
    margin-top: 0.5em;
    padding: 0.5em 0.8em;
    border-inline-start: 3px solid var(--primary);
    border-radius: 6px;
    background: color-mix(in srgb, var(--primary) 7%, transparent);
    font-size: 0.9em;
    white-space: normal;
}
.es-note-alt summary { cursor: pointer; font-weight: 700; color: var(--primary); }
.es-note-alt p { margin: 0.4em 0 0; }

/* ===================== شاهد الفصل والأنواء ===================== */
.ss-event {
    margin: 1.2em 0 1.8em;
    padding-top: 0.4em;
    border-top: 1px solid color-mix(in srgb, var(--text-main) 12%, transparent);
}
.ss-event > h3 { font-size: 1.1em; margin: 0.6em 0; }
.ss-when { font-weight: 400; font-size: 0.9em; opacity: 0.8; }
.ss-texts { display: grid; gap: 0.6em; margin-bottom: 0.9em; }
.ss-text {
    margin: 0;
    padding: 0.6em 0.9em;
    border-inline-start: 3px solid var(--primary);
    background: color-mix(in srgb, var(--text-main) 4%, transparent);
    border-radius: 6px;
}
.ss-text p { margin: 0 0 0.3em; line-height: 1.9; }
.ss-text cite { font-size: 0.85em; font-style: normal; opacity: 0.8; }
.ss-text cite a { color: var(--primary); }
.ss-table { min-width: 640px; }
.ss-table tbody th { text-align: start; font-weight: 600; width: 34%; }
.ss-marker th { font-weight: 700; }
.ss-line { display: block; }
.ss-method { padding-inline-start: 1.3em; margin: 0; }
.ss-method li { margin-bottom: 0.45em; }