/* Store-only Excel roster. Timeline is deliberately LTR in all languages; names use auto direction. */
body.store-roster-page .topbar { gap:0; padding-inline:8px; }
body.store-roster-page .topbar .mini-mark { display:none; }
body.store-roster-page .topbar-brand { min-width:32px; }
body.store-roster-page .topbar-brand strong { font-size:15px; }
body.store-roster-page .topbar-back:not([hidden]) { width:36px; min-width:36px; padding:0; margin-inline:0; }
body.store-roster-page .topbar-action { flex:0 0 44px; width:44px; height:44px; padding:10px; }
body.store-roster-page .topbar-action[aria-pressed="true"] { background:rgba(255,255,255,.22);border-radius:50%; }
body.store-roster-page #main { padding:8px 8px calc(90px + var(--safe-bottom)); }
.store-roster { min-width:0; }
.roster-nav { display:flex;align-items:center;gap:2px;white-space:nowrap;margin-bottom:6px; }
.roster-nav select { flex:1;min-width:50px;max-width:100%;text-overflow:ellipsis;border:0;background:transparent;padding:0;font-size:12px;height:44px;min-height:44px; }
.roster-nav input[type="month"] { width:112px;min-width:0;padding:0;border:0;background:transparent;font-size:13px;min-height:44px; }
.roster-nav > button { min-height:44px;width:28px;padding:0;border:0;background:transparent;color:inherit;font-size:17px;flex-shrink:0; }
.roster-nav > .roster-today { width:auto;min-width:34px;font-size:12px; }
.roster-nav > .roster-month { width:80px;font-size:13px; }
.roster-date-label { position:sticky;left:54px;display:block;width:max-content;max-width:110px;text-align:center; }
.roster-date-label small { display:block;color:#696d75;font-size:11px;font-weight:400; }
.roster-grid [data-roster-date] { text-align:left; }
.roster-scroll { overflow:auto;max-width:100%;max-height:calc(100dvh - 190px - var(--safe-top));border:1px solid var(--line);border-radius:8px;background:white;overscroll-behavior:contain; }
.roster-grid { border-collapse:separate;border-spacing:0;width:max-content;font-size:12px;table-layout:fixed; }
.roster-grid th,.roster-grid td { text-align:center;padding:0;border-right:1px solid #e8e9ec;border-bottom:1px solid #e8e9ec;min-width:46px; }
.roster-grid th { background:#f7f8fa; }
.roster-grid thead { position:sticky;top:0;z-index:3; }
.roster-grid thead th { padding:5px 2px; }
.roster-grid thead th>small { display:block;color:#696d75;font-size:11px;font-weight:400; }
.roster-grid .roster-time { position:sticky;left:0;width:52px;min-width:52px;max-width:52px;z-index:2;background:#f7f8fa; }
.roster-grid thead .roster-time { z-index:4; }
.roster-grid .roster-time small { display:block;font-size:9px;font-weight:400; }
.roster-grid tbody td,.roster-grid tbody th { height:32px; }
.roster-grid button { border:0;border-radius:0;background:transparent;color:inherit;font:inherit;display:block;width:100%;min-height:32px;padding:3px;cursor:pointer; }
.roster-grid button:focus-visible { outline:2px solid #e60012;outline-offset:-2px; }
.roster-grid .roster-count { background:#eaf5fc;min-width:44px; }
.roster-grid .roster-sales { min-width:62px;font-size:11px; }
.roster-grid .roster-person { width:116px;min-width:116px;max-width:116px; }
.roster-person strong { font-size:12px;font-weight:600;display:block;white-space:normal;overflow-wrap:anywhere;line-height:1.3; }
.roster-person small { display:block;white-space:normal;font-size:10px;color:#666; }
.roster-grid .roster-shift { width:116px;max-width:116px;white-space:normal;overflow-wrap:anywhere;font-weight:400; }
.roster-grid .roster-on { background:#fff0f1;color:#d6081a; }
.roster-grid .roster-draft { box-shadow:inset 0 -2px #2087d9; }
.roster-grid .roster-draft.roster-on { background:#e0efff;color:#096fc3; }
.roster-grid .roster-unknown { background:#fff4d9;color:#86580d; }
.roster-grid .roster-range { background:#b9dcff;outline:2px solid #1482e2;outline-offset:-2px; }
.roster-selecting .roster-cell[data-editable="true"] { touch-action:none;user-select:none;-webkit-touch-callout:none; }
.roster-grid .is-today { color:#e60012; }
.roster-grid tfoot td,.roster-grid tfoot th { height:32px;font-weight:500; }
.roster-grid tfoot td { background:white; }
.roster-editbar,.roster-tools { display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:4px 0; }
.roster-editbar button { width:auto;flex:0 0 auto;padding:6px 9px;min-height:40px;font-size:12px; }
.roster-tools button { border:0;background:transparent;padding:8px;min-height:40px;font-size:12px; }
.roster-tools [aria-pressed="true"] { color:#d50012;border-bottom:2px solid #d50012; }
.roster-tools span,.roster-filter-status,.roster-sales-status { font-size:12px;color:#60636b; }
.roster-filter-status { display:flex;align-items:center;gap:8px; }
.roster-clear-filter { border:0;background:transparent;min-height:36px;min-width:36px; }
.roster-sales-status { padding:4px 0; }
.roster-sales-status button { min-height:32px;font-size:12px;padding:2px 10px; }
.roster-filter-fields { display:flex;gap:8px;margin-block:10px; }
.roster-filter-fields>select,.roster-filter-fields>label { min-width:0;flex:1; }
.roster-filter-fields input,.roster-filter-fields select { width:100%;min-width:0; }
.roster-option { display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line);text-align:start; }
.roster-option input[type="checkbox"],.roster-option input[type="radio"] { flex:0 0 20px;width:20px;height:20px;accent-color:#e60012; }
.roster-option span { min-width:0;overflow-wrap:anywhere; }
.roster-option small { display:block;color:#676b74;font-size:12px; }
#roster-options { max-height:45dvh;overflow:auto; }
.roster-segment { display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) 36px;gap:6px;align-items:center;margin:8px 0; }
.roster-segment input { min-width:0; }
.roster-segment small { grid-column:1/-1; }
.roster-weekdays { display:flex;flex-wrap:wrap;gap:12px; }
.roster-weekdays label { display:flex;gap:5px;align-items:center; }
.roster-weekdays input { width:20px;height:20px; }
@media (min-width:768px) { .roster-grid{font-size:13px}.roster-nav{max-width:620px}.roster-scroll{max-height:calc(100dvh - 210px)} }
@media (orientation:landscape) and (max-height:500px) {
 .store-roster{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px}
 .roster-nav{flex:1 1 65%;max-width:none;margin:0}
 .roster-filter-status{flex:0 0 auto}
 .roster-editbar,.roster-tools{padding:2px 0}
 .roster-tools{margin-inline-start:auto}
 .roster-scroll{width:100%;flex:1 1 100%;max-height:calc(100dvh - 158px)}
 body.store-roster-page #main{padding-top:4px}
}
