/* Command Center, Action Center, Bills & Payments, Social Media, Team Tasks & Receiving (Nov 5 2026). Uses the colors of app.css (light + dark). */

/* Command Center tiles */
.ops-hub{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.ops-hub .tile{min-height:118px;display:flex;flex-direction:column}
.ops-hub .tile .s{margin-top:auto;padding-top:4px}
.tile.soon{background:var(--gray-soft);border-style:dashed}.tile.soon .n{color:var(--faint)}

/* Action Center cards: a red frame around each thing Fishel must do */
.acard{background:var(--panel);border:2px solid var(--red-line);border-left:6px solid var(--red);border-radius:12px;padding:16px 18px;margin-bottom:14px;display:flex;flex-direction:column;gap:10px}
.acard.urgent{box-shadow:0 0 0 3px var(--red-soft)}
.acard-top{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.acard-t{font-size:18px;line-height:1.3}
.acard-lines{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px 18px;background:var(--bg);border-radius:10px;padding:10px 12px}
.steps{background:var(--red-soft);border:1px solid var(--red-line);border-radius:10px;padding:10px 14px}
.steps .lbl{color:var(--red)}
.steps ol{margin:6px 0 0;padding-left:22px}.steps li{margin:3px 0;color:var(--ink)}
.btn.big{min-height:48px;font-size:15px;padding:11px 20px}
@media (max-width:600px){.acard .actions .btn{flex:1 1 100%;justify-content:center}}

/* empty states */
.ops-empty{background:var(--panel);border:1px dashed var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;color:var(--muted)}
.card .ops-empty{border:0;padding:8px 0}
.ops-empty b{color:var(--ink);font-size:15px}
.ops-empty p{margin:0;font-size:14px}
.ops-empty-ic{width:34px;height:34px;border-radius:999px;background:var(--green-soft);color:var(--green);display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.ops-warn{color:var(--amber)}
.ops-late{color:var(--red)}
.ops-sec{margin-bottom:16px}
.tablebox.flat{border:0;border-radius:0}

/* forms */
.ops-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:12px 16px}
.ops-form.three{grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))}
.ops-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.ops-form label.wide{grid-column:1/-1}
.ops-form .inp{width:100%;font-weight:400}
input.inp[type=date]{min-height:42px}
.rform{border:2px solid var(--accent-line)}
.hist.sys .sub,.hist.sys b{color:var(--faint);font-weight:400}
.tools select{min-width:170px}

/* phone fix: the search box in the top bar pushed the avatar 18px off screen at 390px wide (seen while testing, Nov 5 2026) */
.top .search{min-width:0}
.ops-src{margin-top:20px}.ops-src .row{padding:8px 0}
.view:focus-visible{outline:0}   /* the page itself gets focus after each menu click; no frame around the whole page */
.ops-empty-ic.wait{background:var(--gray-soft);color:var(--muted)}