/* Saros v30 — «صحتي» › «رياضتي»: week table + «تمرين اليوم». Monochrome, light + dark from the theme variables. */
.health-page [data-health-card="workouts"] .health-card-content{gap:12px}
.wk30-cap{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:0 2px 4px;font-size:12px;font-weight:600;color:var(--muted)}
.wk30-cap small{font-weight:400;font-size:11px;white-space:nowrap}

/* ---------- week table ---------- */
.wk30-week{display:grid;min-width:0;cursor:default}
.wk30-list{list-style:none;margin:0;padding:0;display:grid}
.wk30-row{display:grid;grid-template-columns:78px minmax(0,1fr);align-items:center;gap:8px;min-height:31px;padding:3px 8px}
.wk30-row+.wk30-row{border-top:1px solid color-mix(in srgb,var(--border) 70%,transparent)}
.wk30-row.is-sel{border-radius:9px;background:var(--surface-2);outline:1px solid var(--border);border-top-color:transparent;min-height:38px}
.wk30-row.is-sel+.wk30-row{border-top-color:transparent}
.wk30-day{display:flex;align-items:baseline;gap:5px;font-size:12px;font-weight:600;white-space:nowrap;align-self:start;padding-top:4px}
.wk30-day small{font-size:10.5px;color:var(--muted);font-weight:400}
.wk30-row.is-sel .wk30-day{font-weight:800}
.wk30-row.is-sel .wk30-day small{color:var(--text)}
.wk30-row.is-rest .wk30-day{color:var(--muted);font-weight:500}
.wk30-row[aria-current="date"]:not(.is-sel) .wk30-day{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.wk30-cells{display:grid;min-width:0}
.wk30-cell{display:grid;grid-template-columns:minmax(0,1fr) 66px;align-items:center;gap:8px;min-height:25px}
.wk30-work{display:flex;align-items:baseline;gap:6px;min-width:0;font-size:12.5px;color:var(--text)}
button.wk30-work{border:0;background:transparent;padding:2px 0;margin:0;font:inherit;font-size:12.5px;text-align:right;cursor:pointer;border-radius:6px}
button.wk30-work:hover .wk30-name{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
button.wk30-work:focus-visible{outline:2px solid var(--muted);outline-offset:2px}
.wk30-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.wk30-dur{flex:none;font-size:11px;color:var(--muted)}
.wk30-rest{color:var(--muted);font-size:11.5px}
.wk30-cell[data-st="done"] .wk30-name{color:var(--muted)}
.wk30-state{display:flex;align-items:center;gap:5px;justify-content:flex-start;min-width:0}
.wk30-st{font-size:11px;color:var(--muted);white-space:nowrap}
.wk30-mark{width:17px;height:17px;border-radius:50%;display:grid;place-items:center;flex:none}
.wk30-mark.is-done{background:var(--text);color:var(--surface)}
.wk30-mark.is-missed{border:1.4px dashed var(--muted);color:var(--muted)}
.wk30-tick{display:flex;align-items:center;gap:5px;cursor:pointer}
.wk30-tick input{width:18px;height:18px;margin:0;flex:none;accent-color:var(--text);cursor:pointer}
.wk30-tick input:disabled{cursor:not-allowed}
.wk30-tick input:disabled+.wk30-st{opacity:.55}
.wk30-row.is-sel .wk30-st{color:var(--text);font-weight:600}

/* ---------- «تمرين اليوم» ---------- */
.health-page .health-card .wk30-today{display:grid;gap:8px;border-top:1px solid var(--border);padding-top:12px;cursor:default}
.wk30-plan{display:grid;gap:6px}
.wk30-plan+.wk30-plan{border-top:1px dashed var(--border);padding-top:8px}
.wk30-plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-width:0}
.wk30-plan-title{display:grid;min-width:0}
.wk30-plan-title b{font-size:13.5px;font-weight:700;overflow-wrap:anywhere}
.wk30-plan-title small{font-size:11px;color:var(--muted)}
.wk30-plan .ui-action{width:25px;height:25px;min-width:25px;opacity:.6;flex:none}
.wk30-plan .ui-action:hover{opacity:1}
.wk30-ex{list-style:none;margin:0;padding:0;display:grid}
.wk30-ex li{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:3px 10px;font-size:12px;border-inline-start:2px solid var(--border)}
.wk30-ex li span{min-width:0;overflow-wrap:anywhere}
.wk30-ex li small{flex:none;font-size:11.5px;color:var(--muted);white-space:nowrap}
.wk30-notes{margin:0;font-size:11px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wk30-restday{margin:0;display:grid;gap:2px}
.wk30-restday b{font-size:13px;font-weight:700}
.wk30-restday small{font-size:11.5px;color:var(--muted)}
.wk30-today .v306-no-plan{margin:0}

/* large card: table and today side by side */
@media(min-width:1100px){
 .health-page .health-card.size-large[data-health-card="workouts"] .health-card-content{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start;column-gap:24px}
 .health-page .health-card.size-large[data-health-card="workouts"] .health-habit-summary{grid-column:1/-1}
 .health-page .health-card.size-large[data-health-card="workouts"] .wk30-today{border-top:0;padding-top:0}
}
/* narrow cards / phone */
.wk30-week.is-small .wk30-row{grid-template-columns:64px minmax(0,1fr);padding-inline:6px;gap:6px}
.wk30-week.is-small .wk30-cell{grid-template-columns:minmax(0,1fr) auto}
.wk30-week.is-small .wk30-dur,.wk30-week.is-small .wk30-cap small{display:none}
@media(max-width:420px){
 .wk30-row{grid-template-columns:70px minmax(0,1fr);padding-inline:6px;gap:6px}
 .wk30-cell{grid-template-columns:minmax(0,1fr) 60px;gap:6px}
}
/* v30.7: details = one icon in the card's corner */
.health-open-icon{width:34px;height:34px;min-width:34px;padding:0;display:grid;place-items:center;border-radius:10px;border:1px solid transparent;background:transparent;color:var(--muted);cursor:pointer}
.health-open-icon:hover,.health-open-icon:focus-visible{border-color:var(--border);color:var(--text);background:var(--surface-2)}
/* v30.8: 12-column card grid (widths set by data-span from health-v30.js) + edge handle for resizing */
.health-page .health-grid.hc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:stretch}
.health-page .health-grid.hc-grid>.health-card{min-width:0;grid-column:span 4}
.health-page .health-grid.hc-grid>.health-card[data-span="1"]{grid-column:span 1}.health-page .health-grid.hc-grid>.health-card[data-span="2"]{grid-column:span 2}
.health-page .health-grid.hc-grid>.health-card[data-span="3"]{grid-column:span 3}.health-page .health-grid.hc-grid>.health-card[data-span="4"]{grid-column:span 4}
.health-page .health-grid.hc-grid>.health-card[data-span="5"]{grid-column:span 5}.health-page .health-grid.hc-grid>.health-card[data-span="6"]{grid-column:span 6}
.health-page .health-grid.hc-grid>.health-card[data-span="7"]{grid-column:span 7}.health-page .health-grid.hc-grid>.health-card[data-span="8"]{grid-column:span 8}
.health-page .health-grid.hc-grid>.health-card[data-span="9"]{grid-column:span 9}.health-page .health-grid.hc-grid>.health-card[data-span="10"]{grid-column:span 10}
.health-page .health-grid.hc-grid>.health-card[data-span="11"]{grid-column:span 11}.health-page .health-grid.hc-grid>.health-card[data-span="12"]{grid-column:1/-1}
.health-page .health-card{position:relative}
.health-page .hc-resize{position:absolute;inset-inline-end:3px;top:50%;transform:translateY(-50%);width:14px;height:46px;padding:0;display:grid;place-items:center;border:1px solid var(--border);border-radius:7px;background:var(--surface);color:var(--muted);cursor:ew-resize;opacity:0;transition:opacity .15s;touch-action:none;z-index:2}
.health-page .health-card:hover>.hc-resize,.health-page .hc-resize:focus-visible,.health-page .health-card.is-resizing>.hc-resize{opacity:1}
.health-page .hc-resize:hover,.health-page .health-card.is-resizing>.hc-resize{color:var(--text);border-color:var(--text)}
.health-page .health-card.is-resizing{outline:2px dashed var(--text);outline-offset:3px}
.hc-tip{position:absolute;top:12px;inset-inline-start:50%;transform:translateX(50%);padding:4px 12px;border-radius:20px;background:var(--text);color:var(--surface);font-size:12px;font-weight:700;pointer-events:none;z-index:3}
body.hc-resizing,body.hc-resizing *{cursor:ew-resize!important;user-select:none!important}
@media(max-width:650px){.health-page .hc-resize{display:none}.health-page .health-grid.hc-grid{gap:12px}}
@media(hover:none){.health-page .hc-resize{opacity:.55}}
/* full row keeps the side-by-side layout of «large» content */
@media(min-width:1100px){
 .health-page .health-card.size-full[data-health-card="workouts"] .health-card-content{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start;column-gap:24px}
}
/* v30.8 (Sara's choice «ب»): cards have a maximum height so rows stay tidy; longer content scrolls inside the card.
   «رياضتي» keeps its full height. Phones show cards one under the other, so no cap there. */
@media(min-width:651px){
 .health-page .health-grid.hc-grid>.health-card:not([data-health-card="workouts"]){max-height:470px}
 .health-page .health-grid.hc-grid>.health-card:not([data-health-card="workouts"])>.health-card-content{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--muted-2) transparent;padding-inline-end:4px}
 .health-page .health-grid.hc-grid>.health-card>.health-card-footer{flex:none}
 /* one scroller per card: inner lists stop scrolling on their own inside a capped card */
 .health-page .health-grid.hc-grid>.health-card:not([data-health-card="workouts"]) .health-scroll-list{max-height:none;overflow:visible}
}

/* v30.8: «رياضتي» at صف كامل — approved design (tasawur 4) */
.health-page [data-health-card="workouts"].size-full .health-card-content:has(>.w4){display:block}
.w4-top{display:flex;align-items:center;gap:22px;margin:0 2px 14px;flex-wrap:wrap}
.w4-kpi{display:flex;align-items:baseline;gap:7px}.w4-kpi strong{font-size:26px;font-weight:700;line-height:1}.w4-kpi span{font-size:12px;color:var(--muted)}
.w4-segs{display:flex;gap:4px}.w4-segs i{width:22px;height:6px;border-radius:4px;background:var(--surface-2);border:1px solid var(--border)}.w4-segs i.on{background:var(--text);border-color:var(--text)}
.w4-bar{width:150px;height:6px;border-radius:4px;background:var(--surface-2);overflow:hidden}.w4-bar i{display:block;height:100%;width:0;background:var(--text)}
.w4-range{margin-inline-start:auto;font-size:11.5px;color:var(--muted)}
.w4-grid{border:1px solid var(--border);border-radius:14px;overflow:hidden}
.w4-head,.w4-body{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.w4-head{background:color-mix(in srgb,var(--surface-2) 70%,transparent);border-bottom:1px solid var(--border)}
.w4-h{display:flex;align-items:baseline;justify-content:center;gap:6px;padding:8px 4px}
.w4-h span{font-size:11.5px;color:var(--muted)}.w4-h b{font-size:14px;font-weight:700}
.w4-h.is-sel{background:var(--text)}.w4-h.is-sel span,.w4-h.is-sel b{color:var(--surface)}
.w4-h[aria-current="date"]:not(.is-sel) b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.w4-h+.w4-h,.w4-c+.w4-c{border-inline-start:1px solid color-mix(in srgb,var(--border) 75%,transparent)}
.w4-c{padding:10px;display:flex;flex-direction:column;gap:8px;min-width:0}
.w4-c.is-sel{background:color-mix(in srgb,var(--surface-2) 75%,transparent)}
.w4-rest{margin:auto;display:grid;justify-items:center;gap:3px;color:var(--muted);font-size:11.5px;opacity:.8;padding:10px 0}
.w4-w{display:grid;gap:3px;min-width:0;padding-inline-start:9px;border-inline-start:2px solid var(--text);justify-items:start}
.w4-w.is-missed{border-inline-start-style:dashed;border-inline-start-color:var(--muted)}
.w4-w.is-done{border-inline-start-color:color-mix(in srgb,var(--text) 45%,transparent)}
.w4-w+.w4-w{margin-top:4px}
.w4-name{font-size:12.5px;font-weight:700;line-height:1.35;overflow-wrap:anywhere;color:var(--text);text-align:right}
button.w4-name{border:0;background:transparent;padding:0;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
button.w4-name:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
button.w4-name:focus-visible{outline:2px solid var(--muted);outline-offset:2px;border-radius:4px}
.w4-dur{font-size:11px;color:var(--muted)}
.w4-ex{list-style:none;margin:3px 0 0;padding:0;display:grid;gap:2px;width:100%}
.w4-ex li{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font-size:11px;line-height:1.45;min-width:0}
.w4-ex li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.w4-ex li em{font-style:normal;color:var(--muted);white-space:nowrap;font-size:10.5px}
.w4-st{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--muted);margin-top:4px;width:max-content}
.w4-st svg{width:11px;height:11px}
.w4-st.is-done{color:var(--text)}
.w4-st.is-tick{color:var(--text);font-weight:600;cursor:pointer}.w4-st.is-tick input{width:15px;height:15px;margin:0;accent-color:var(--text);cursor:pointer}
.w4-st.is-tick input:disabled{cursor:not-allowed}
/* v30.8.1: details sized to the screen, logs behind «السجل» */
.health-page .section-heading.fit-head{display:flex;align-items:center;gap:8px}
.health-page .section-heading.fit-head>h2{margin-inline-end:auto}
.fit-log-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border:1px solid var(--border);border-radius:10px;background:transparent;color:var(--text);font:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap}
.fit-log-btn small{color:var(--muted);font-size:11px}
.fit-log-btn:hover,.fit-log-btn:focus-visible{border-color:var(--text);background:var(--surface-2)}
.fit-log-body .health-history{max-height:none;overflow:visible}
.fit-log-tools{margin-bottom:6px}
body.hc-fit .app-footer{display:none}
.health-page.fit .page-heading,.health-page.fit>.health-notice,.health-page.fit>aside.health-notice,.health-page.fit .health-storage-footer{display:none!important}
.health-page.fit .health-dashboard-toolbar{margin-bottom:12px}
.health-page.fit .health-detail{max-width:none;margin:0;padding:18px 22px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.health-page.fit .health-detail.has-cols{display:flex;flex-direction:column;overflow:hidden}
.health-page.fit .health-detail.has-cols>.section-heading{flex:none;margin-bottom:10px}
.fit-cols{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:22px}
.fit-col{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;display:flex;flex-direction:column;gap:12px;padding-inline-end:4px}
.fit-col+.fit-col{border-inline-start:1px solid var(--border);padding-inline-start:22px}
.fit-col .ml-chart{max-height:230px}
.health-page.fit .health-detail .health-chart{max-height:240px}
.health-page.fit .health-detail.has-cols>.v18-sleep-journal.fit-cols{flex:1;min-height:0}
.health-page.fit .fit-sleep .v18-chart-scroll{max-height:100%}
.health-page.fit .fit-cols .health-chart{max-height:230px}
@media(max-height:820px){.health-page.fit .fit-cols .health-chart{max-height:190px}.fit-col .ml-chart{max-height:170px}}
.health-page.fit .fit-cols.fit-low{flex:1 1 auto;min-height:150px}
.health-page.fit .health-detail.has-cols>*:not(.fit-cols){flex:none}
/* v30.8.4: «سدس» — the smallest card: tighter padding, the numbers a touch smaller, nothing cut off */
.health-page .health-card.size-xsmall{padding:13px;min-width:0}
.health-page .health-card.size-xsmall header{margin-bottom:10px;gap:4px}
.health-page .health-card.size-xsmall .health-card-title{font-size:11.5px}
.health-page .health-card.size-xsmall .health-metric{font-size:26px}
.health-page .health-card.size-xsmall .health-ring{width:72px;height:72px}
.health-page .health-card.size-xsmall .health-ring strong{font-size:16px}
.health-page .health-card.size-xsmall .health-card-footer{flex-wrap:wrap;gap:5px}
.health-page .health-card.size-xsmall .health-card-footer>*{min-width:0}