/* ==========================================================================
   Week page («کریپتوتایم» → one week) — template-parts/week/board.php
   ==========================================================================

   Plain CSS for the same reason as every other feature file here: style.css is
   a Tailwind build that cannot be rebuilt, so new markup carries its own
   `arz-wk*` classes. Colours are the theme's own (primary 0 223 154, danger
   255 25 59, warning 255 195 0, gray-700 55 59 79) and switch through the
   tokens `theme-mode.css` defines under `html.dark-mode`.
   Logical properties throughout, so the page is right-to-left without a
   single `[dir=rtl]` rule.
   ========================================================================== */

.arz-wk {
    --wk-surface: #fff;
    --wk-soft: rgb(242 244 250);
    --wk-line: rgb(232 234 242);
    --wk-title: rgb(16 17 26);
    --wk-text: rgb(55 59 79);
    --wk-muted: rgb(104 109 135);
    --wk-pos: rgb(0 168 116);
    --wk-pos-fill: rgb(0 223 154);
    --wk-pos-tint: rgb(230 252 245);
    --wk-neg: rgb(220 20 50);
    --wk-neg-fill: rgb(255 25 59);
    --wk-neg-tint: rgb(255 232 235);
    --wk-neu: rgb(176 128 0);
    --wk-neu-fill: rgb(255 195 0);
    --wk-neu-tint: rgb(255 249 230);
    --wk-event: rgb(2 153 242);
    --wk-event-tint: rgb(230 245 254);
    --wk-radius: 14px;

    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    padding: 16px;
    color: var(--wk-text);
}

/* Flex and grid children default to min-width:auto, so the day strip's seven
   82px columns pushed the whole page wider than a phone instead of scrolling
   inside itself. */
.arz-wk > *, .arz-wk__hero > * { min-width: 0; }

html.dark-mode .arz-wk {
    --wk-surface: rgb(var(--arz-c-block));
    --wk-soft: rgb(var(--arz-c-over));
    --wk-line: rgb(var(--arz-c-border));
    --wk-title: rgb(var(--arz-c-title-strong));
    --wk-text: rgb(var(--arz-c-text));
    --wk-muted: rgb(var(--arz-c-muted));
    --wk-pos: rgb(var(--arz-c-primary-strong));
    --wk-pos-tint: rgb(var(--arz-c-primary-tint));
    --wk-neg: rgb(255 110 128);
    --wk-neg-tint: rgb(var(--arz-c-danger-tint));
    --wk-neu: rgb(255 210 80);
    --wk-neu-tint: rgb(var(--arz-c-warning-tint));
    --wk-event: rgb(90 190 255);
    --wk-event-tint: rgb(var(--arz-c-info-tint));
}

@media (min-width: 768px) {
    .arz-wk { padding: 24px 32px 32px; gap: 24px; }
}

/* ---------------------------------------------------------------- hero */

.arz-wk__hero {
    display: grid;
    gap: 16px;
    padding: 20px;
    border-radius: var(--wk-radius);
    background:
        radial-gradient(120% 140% at 100% 0%, var(--wk-hero-tint, var(--wk-soft)) 0%, transparent 60%),
        var(--wk-surface);
    border: 1px solid var(--wk-line);
}
.arz-wk--pos .arz-wk__hero, .arz-wk__hero.arz-wk--pos { --wk-hero-tint: var(--wk-pos-tint); }
.arz-wk__hero.arz-wk--neg { --wk-hero-tint: var(--wk-neg-tint); }
.arz-wk__hero.arz-wk--neu { --wk-hero-tint: var(--wk-neu-tint); }

@media (min-width: 1024px) {
    .arz-wk__hero {
        grid-template-columns: 1.2fr 1fr;
        grid-template-areas: "main top" "gauge top" "extras extras";
        padding: 28px;
        column-gap: 32px;
    }
    .arz-wk__hero-main { grid-area: main; }
    .arz-wk__gauge { grid-area: gauge; align-self: end; }
    .arz-wk__top { grid-area: top; }
    .arz-wk__extras { grid-area: extras; }
}

.arz-wk__range { margin: 0; font-size: 14px; color: var(--wk-muted); }

.arz-wk__verdict {
    margin: 6px 0 12px;
    font-size: 20px;
    line-height: 1.6;
    font-weight: 700;
    color: var(--wk-title);
}
.arz-wk__verdict strong {
    display: inline-block;
    margin-inline-start: 6px;
    padding: 2px 12px;
    border-radius: 999px;
    font-size: 16px;
    background: var(--wk-soft);
    color: var(--wk-text);
}
.arz-wk__hero.arz-wk--pos .arz-wk__verdict strong { background: var(--wk-pos-tint); color: var(--wk-pos); }
.arz-wk__hero.arz-wk--neg .arz-wk__verdict strong { background: var(--wk-neg-tint); color: var(--wk-neg); }
.arz-wk__hero.arz-wk--neu .arz-wk__verdict strong { background: var(--wk-neu-tint); color: var(--wk-neu); }

@media (min-width: 768px) {
    .arz-wk__verdict { font-size: 24px; }
}

.arz-wk__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.arz-wk__stats li {
    padding: 6px 12px;
    border-radius: 10px;
    background: var(--wk-soft);
    font-size: 14px;
    color: var(--wk-muted);
}
.arz-wk__stats b { color: var(--wk-title); font-size: 16px; }
.arz-wk__stats .is-pos, .arz-wk__stats .is-pos b { color: var(--wk-pos); }
.arz-wk__stats .is-neg, .arz-wk__stats .is-neg b { color: var(--wk-neg); }

/* gauge — physical left→right on purpose: red, then green, in any language */
.arz-wk__gauge { direction: ltr; }
.arz-wk__gauge-track {
    position: relative;
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--wk-neg-fill), var(--wk-neu-fill) 50%, var(--wk-pos-fill));
}
.arz-wk__gauge-needle {
    position: absolute;
    top: 50%;
    left: var(--arz-needle, 50%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--wk-surface);
    border: 4px solid var(--wk-title);
    transform: translate(-50%, -50%);
    box-shadow: 0 2px 6px rgb(0 0 0 / .18);
    transition: left .6s cubic-bezier(.2, .8, .2, 1);
}
.arz-wk__gauge-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    font-size: 12px;
    color: var(--wk-muted);
}

/* top story */
.arz-wk__top {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 18px;
    border-radius: 12px;
    background: var(--wk-surface);
    border: 1px solid var(--wk-line);
    border-inline-start: 4px solid var(--wk-muted);
    text-decoration: none;
    color: inherit;
    transition: transform .2s ease, box-shadow .2s ease;
}
.arz-wk__top.is-pos { border-inline-start-color: var(--wk-pos-fill); }
.arz-wk__top.is-neg { border-inline-start-color: var(--wk-neg-fill); }
.arz-wk__top:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgb(16 17 26 / .08); }
.arz-wk__top-label { font-size: 12px; font-weight: 700; color: var(--wk-muted); letter-spacing: 0; }
.arz-wk__top-title { font-size: 17px; line-height: 1.8; font-weight: 700; color: var(--wk-title); }
.arz-wk__top-meta { font-size: 13px; color: var(--wk-muted); }

.arz-wk__extras { display: grid; gap: 12px; }
.arz-wk__podcast { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 14px; }
.arz-wk__podcast .wp-audio-shortcode { max-width: 420px; }
.arz-wk__summary { border-radius: 10px; background: var(--wk-soft); padding: 12px 16px; }
.arz-wk__summary summary { cursor: pointer; font-weight: 700; color: var(--wk-title); }
.arz-wk__summary > div { margin-top: 10px; line-height: 2; }

/* ---------------------------------------------------------------- day strip */

.arz-wk__days {
    position: sticky;
    top: 0;
    z-index: 5;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(82px, 1fr);
    gap: 8px;
    margin-inline: -16px;
    padding: 10px 16px;
    overflow-x: auto;
    scrollbar-width: none;
    background: color-mix(in srgb, var(--wk-surface) 92%, transparent);
    backdrop-filter: saturate(1.4) blur(8px);
    -webkit-backdrop-filter: saturate(1.4) blur(8px);
    border-bottom: 1px solid var(--wk-line);
    scroll-snap-type: x proximity;
}
.arz-wk__days::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .arz-wk__days { margin-inline: -32px; padding-inline: 32px; } }

.arz-wk__chip {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 4px 6px;
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid var(--wk-line);
    background: var(--wk-surface);
    color: var(--wk-text);
    text-decoration: none;
    scroll-snap-align: start;
    transition: border-color .2s, background-color .2s, transform .2s;
}
.arz-wk__chip:hover { transform: translateY(-1px); border-color: var(--wk-muted); }
.arz-wk__chip-day { font-size: 12px; color: var(--wk-muted); white-space: nowrap; }
.arz-wk__chip-date { grid-row: 2; font-size: 18px; font-weight: 700; color: var(--wk-title); }
.arz-wk__chip-count {
    grid-row: 1 / 3;
    grid-column: 2;
    align-self: center;
    min-width: 26px;
    padding: 2px 6px;
    border-radius: 999px;
    background: var(--wk-soft);
    font-size: 12px;
    text-align: center;
}
.arz-wk__chip-bar { grid-column: 1 / -1; }
.arz-wk__chip.is-none .arz-wk__chip-bar, .arz-wk__chip.is-future .arz-wk__chip-bar { opacity: .35; }
.arz-wk__chip.is-future { opacity: .7; }
.arz-wk__chip.is-today { border-color: var(--wk-title); box-shadow: inset 0 0 0 1px var(--wk-title); }
.arz-wk__chip.is-active { background: var(--wk-soft); border-color: var(--wk-title); }

/* shared balance bar: green share from the start edge, red for the rest */
.arz-wk__chip-bar, .arz-wk__day-bar {
    display: block;
    height: 4px;
    border-radius: 999px;
    background: var(--wk-neg-fill);
    overflow: hidden;
}
.arz-wk__chip-bar i, .arz-wk__day-bar i {
    display: block;
    height: 100%;
    width: var(--arz-bull, 50%);
    background: var(--wk-pos-fill);
}
.is-none > .arz-wk__chip-bar, .arz-wk__chip.is-none .arz-wk__chip-bar { background: var(--wk-line); }
.arz-wk__chip.is-none .arz-wk__chip-bar i { background: transparent; }

/* ---------------------------------------------------------------- filters */

.arz-wk__filters { display: flex; flex-wrap: wrap; gap: 8px; }
.arz-wk__filter {
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid var(--wk-line);
    background: var(--wk-surface);
    color: var(--wk-text);
    font: inherit;
    font-size: 14px;
    cursor: pointer;
    transition: background-color .2s, border-color .2s, color .2s;
}
.arz-wk__filter:hover { border-color: var(--wk-muted); }
.arz-wk__filter[aria-pressed="true"] { background: var(--wk-title); border-color: var(--wk-title); color: var(--wk-surface); }
.arz-wk__filter.is-pos[aria-pressed="true"] { background: var(--wk-pos); border-color: var(--wk-pos); color: #fff; }
.arz-wk__filter.is-neg[aria-pressed="true"] { background: var(--wk-neg); border-color: var(--wk-neg); color: #fff; }
.arz-wk__filter:focus-visible, .arz-wk__chip:focus-visible { outline: 2px solid var(--wk-pos-fill); outline-offset: 2px; }

/* ---------------------------------------------------------------- days */

.arz-wk__list { display: flex; flex-direction: column; gap: 16px; margin: 0; padding: 0; list-style: none; }

.arz-wk__day {
    position: relative;
    border-radius: var(--wk-radius);
    border: 1px solid var(--wk-line);
    background: var(--wk-surface);
    overflow: hidden;
}
.arz-wk__anchor { position: absolute; top: -96px; }

.arz-wk__day-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    padding: 14px 18px 12px;
    border-bottom: 1px solid var(--wk-line);
    background: var(--wk-day-tint, var(--wk-soft));
}
.arz-wk__day.is-pos { --wk-day-tint: var(--wk-pos-tint); --wk-day-ink: var(--wk-pos); }
.arz-wk__day.is-neg { --wk-day-tint: var(--wk-neg-tint); --wk-day-ink: var(--wk-neg); }
.arz-wk__day.is-neu { --wk-day-tint: var(--wk-neu-tint); --wk-day-ink: var(--wk-neu); }
.arz-wk__day.is-today { border-color: var(--wk-title); }

.arz-wk__day-title { margin: 0; font-size: 17px; font-weight: 700; color: var(--wk-title); display: flex; align-items: center; gap: 8px; }
.arz-wk__today { padding: 1px 10px; border-radius: 999px; background: var(--wk-pos-fill); color: rgb(16 17 26); font-size: 12px; }
.arz-wk__day-status { font-size: 13px; font-weight: 700; color: var(--wk-day-ink, var(--wk-muted)); }
.arz-wk__day-bar { flex: 1 0 100%; }
@media (min-width: 768px) {
    .arz-wk__day-bar { flex: 0 0 140px; margin-inline-start: auto; }
}

.arz-wk__items { margin: 0; padding: 0; list-style: none; }
.arz-wk__item {
    display: flex;
    gap: 12px;
    padding: 14px 18px;
    border-top: 1px solid var(--wk-line);
    border-inline-start: 3px solid transparent;
    transition: background-color .15s;
}
.arz-wk__item:first-child { border-top: 0; }
.arz-wk__item:hover { background: var(--wk-soft); }
.arz-wk__item.is-pos { border-inline-start-color: var(--wk-pos-fill); }
.arz-wk__item.is-neg { border-inline-start-color: var(--wk-neg-fill); }
.arz-wk__item.is-event { border-inline-start-color: var(--wk-event); }

.arz-wk__arrow {
    flex: none;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    font-size: 12px;
    background: var(--wk-soft);
    color: var(--wk-muted);
}
.is-pos > .arz-wk__arrow { background: var(--wk-pos-tint); color: var(--wk-pos); }
.is-neg > .arz-wk__arrow { background: var(--wk-neg-tint); color: var(--wk-neg); }
.is-neu > .arz-wk__arrow { background: var(--wk-neu-tint); color: var(--wk-neu); }
.is-event > .arz-wk__arrow { background: var(--wk-event-tint); color: var(--wk-event); }

.arz-wk__item-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.arz-wk__item-title {
    font-size: 16px;
    line-height: 1.9;
    font-weight: 600;
    color: var(--wk-title);
    text-decoration: none;
}
.arz-wk__item-title:hover { color: var(--wk-pos); }

.arz-wk__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: 13px; color: var(--wk-muted); }
.arz-wk__tag { padding: 1px 8px; border-radius: 6px; background: var(--wk-soft); font-size: 12px; }
.arz-wk__tag--event { background: var(--wk-event-tint); color: var(--wk-event); }
.arz-wk__tag--soon { background: var(--wk-neu-tint); color: var(--wk-neu); }

.arz-wk__level { display: inline-flex; gap: 3px; }
.arz-wk__level i { width: 12px; height: 5px; border-radius: 999px; background: var(--wk-line); }
.arz-wk__level[data-level="1"] i:nth-child(-n+1),
.arz-wk__level[data-level="2"] i:nth-child(-n+2),
.arz-wk__level[data-level="3"] i:nth-child(-n+3) { background: var(--wk-neu-fill); }
.arz-wk__level[data-level="3"] i { background: var(--wk-pos-fill); }

.arz-wk__weight { display: inline-block; width: 56px; height: 5px; border-radius: 999px; background: var(--wk-line); overflow: hidden; }
.arz-wk__weight i { display: block; height: 100%; width: var(--arz-w); background: var(--wk-muted); }
.is-pos .arz-wk__weight i { background: var(--wk-pos-fill); }
.is-neg .arz-wk__weight i { background: var(--wk-neg-fill); }

.arz-wk__source { color: var(--wk-muted); text-decoration: none; direction: ltr; unicode-bidi: isolate; }
.arz-wk__source:hover { color: var(--wk-pos); text-decoration: underline; }

/* consecutive empty days collapse into one slim row */
.arz-wk__day--empty {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 6px 12px;
    padding: 12px 18px;
    border-style: dashed;
    background: transparent;
    font-size: 14px;
}
.arz-wk__empty-days { color: var(--wk-text); font-weight: 600; }
.arz-wk__empty-note { color: var(--wk-muted); }

/* filtering (set by week.js) */
.arz-wk__item[hidden], .arz-wk__day[hidden] { display: none; }
.arz-wk.is-filtered .arz-wk__day--empty { display: none; }
.arz-wk__no-match { margin: 0; padding: 24px; text-align: center; color: var(--wk-muted); border: 1px dashed var(--wk-line); border-radius: var(--wk-radius); }
.arz-wk__no-match[hidden] { display: none; }

/* ---------------------------------------------------------------- pager */

.arz-wk__pager { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: stretch; }
.arz-wk__pager-link {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid var(--wk-line);
    background: var(--wk-surface);
    text-decoration: none;
    color: var(--wk-text);
    transition: border-color .2s;
}
.arz-wk__pager-link:hover { border-color: var(--wk-pos-fill); }
.arz-wk__pager-link span { font-size: 12px; color: var(--wk-muted); }
.arz-wk__pager-link b { font-size: 14px; color: var(--wk-title); }
.arz-wk__pager-link--prev { grid-column: 1; }
.arz-wk__pager-link--next { grid-column: 3; text-align: end; }
.arz-wk__pager-all { grid-column: 2; align-self: center; font-size: 14px; color: var(--wk-pos); text-decoration: none; white-space: nowrap; }
@media (max-width: 600px) {
    .arz-wk__pager { grid-template-columns: 1fr 1fr; }
    .arz-wk__pager-all { grid-column: 1 / -1; grid-row: 2; text-align: center; }
    .arz-wk__pager-link--next { grid-column: 2; }
}

/* ---------------------------------------------------------------- archive card strip */

.arz-wk-strip { display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.arz-wk-strip i {
    width: 22px;
    height: 8px;
    border-radius: 999px;
    background: rgb(232 234 242);
}
.arz-wk-strip i.is-pos { background: rgb(0 223 154); }
.arz-wk-strip i.is-neg { background: rgb(255 25 59); }
.arz-wk-strip i.is-neu { background: rgb(255 195 0); }
html.dark-mode .arz-wk-strip i:not([class]) { background: rgb(var(--arz-c-border-strong)); }
.arz-wk-top { font-size: 14px; color: rgb(104 109 135); line-height: 1.9; }
.arz-wk-top a { color: inherit; text-decoration: none; }
.arz-wk-top a:hover { color: rgb(0 168 116); }

@media (prefers-reduced-motion: reduce) {
    .arz-wk *, .arz-wk *::before { transition: none !important; }
}
