/* MPRES Office — shared styles for the virtual-office pages (on top of intranet.css). Phone-first: everything reflows at 400 px. */
.vo-h2 { font-size: 15px; margin: 0 0 10px; color: var(--ink); }
.vo-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin: 16px 0; }
.vo-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 14px 0; }
.vo-kpi { background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; }
.vo-kpi b { display: block; font-size: 22px; color: #14333B; line-height: 1.1; }
.vo-kpi span { font-size: 12px; color: var(--muted); }
.vo-links { list-style: none; margin: 0; padding: 0; }
.vo-links li { border-bottom: 1px solid var(--line); }
.vo-links a { display: block; padding: 8px 2px; color: #1E4A55; text-decoration: none; font-weight: 500; }
.vo-links a:hover { text-decoration: underline; }
.vo-banner { background: #FFF7E6; border: 1px solid #E4C980; color: #6B4A0B; border-radius: 8px; padding: 10px 14px; margin: 10px 0; font-size: 13.5px; }
.vo-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.vo-table th, .vo-table td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.vo-table th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 700; background: #F6F8F8; }
.vo-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.vo-mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; word-break: break-all; }
.vo-ph { color: #9A5B00; font-weight: 600; }
.vo-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 8px 0; }
.vo-row .field { margin: 0; flex: 1 1 180px; }
.vo-tabs { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin: 10px 0 14px; }
.vo-tabs a { padding: 8px 12px; color: var(--muted); text-decoration: none; border-bottom: 2px solid transparent; font-weight: 500; font-size: 13.5px; }
.vo-tabs a.on { color: #14333B; border-bottom-color: #B7862C; }
.vo-pill { display: inline-block; padding: 1px 8px; border-radius: 99px; font-size: 11.5px; border: 1px solid var(--line-strong); white-space: nowrap; }
.vo-pill.ok { background: #E8F5EC; border-color: #BFE3CA; color: #1D6B3A; }
.vo-pill.warn { background: #FFF4DC; border-color: #F1D493; color: #7A5300; }
.vo-pill.bad { background: #FDECEC; border-color: #F5C2C2; color: #8E1F1F; }
.vo-pill.demo { background: #EEF2FF; border-color: #C7D2FE; color: #3730A3; }
.vo-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 14px; }
.vo-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.vo-note { font-size: 12.5px; color: var(--muted); margin: 6px 0; }
.vo-once { background: #F6F8F8; border: 1px dashed #B7862C; border-radius: 8px; padding: 10px 12px; margin: 10px 0; }
@media (max-width: 560px) { .vo-hide-s { display: none; } .vo-table th, .vo-table td { padding: 6px 5px; } }
@media print { #ss-side, #ss-head, .vo-actions, .no-print { display: none !important; } }
/* one-line info cards (Provider Profile, Course Library, Staff Office — 2026-10-07): the line shows the essentials, click opens details + edit */
.oc-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.oc-bar input[type=search] { flex: 1 1 220px; min-width: 0; }
.oc-bar select { max-width: 100%; }
.oc-count { font-size: 12.5px; color: var(--muted); }
.oc-group { font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; margin: 14px 0 4px; }
details.oc { background: var(--card); border: 1px solid var(--line); border-radius: 8px; margin: 0 0 6px; }
details.oc > summary { list-style: none; cursor: pointer; display: flex; gap: 10px; align-items: center; padding: 9px 12px; min-width: 0; }
details.oc > summary::-webkit-details-marker { display: none; }
details.oc > summary::before { content: '▸'; color: var(--muted); flex: none; }
details.oc[open] > summary::before { content: '▾'; }
details.oc .oc-t { font-weight: 600; color: #14333B; flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
details.oc .oc-m { color: var(--muted); font-size: 13px; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
details.oc .oc-c { flex: none; display: flex; gap: 4px; }
details.oc .oc-b { padding: 4px 14px 12px 32px; border-top: 1px solid var(--line); font-size: 13.5px; }
details.oc .oc-b dl { display: grid; grid-template-columns: minmax(110px, 30%) 1fr; gap: 4px 12px; margin: 8px 0; }
details.oc .oc-b dt { color: var(--muted); }
details.oc .oc-b dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 560px) { details.oc .oc-m { display: none; } details.oc .oc-b { padding-left: 14px; } details.oc .oc-b dl { grid-template-columns: 1fr; } }