/* SIRROMConnect — .um2 unified modal + ordering/commercial modal styles.
   Ported additively from the CaterCare shell (dedicated modal <style> blocks + .um2 .wo-* overrides).
   .um2 selectors are more specific than the base .wo-* modal, so they never affect SIRROM's existing
   openWO maintenance/hazard/feedback modals. .um2 redeclares its own color tokens locally (light).
   The html[data-theme="dark"] rules are inert in SIRROM (no theme system) and left as-is. */

/* --- .um2 .wo-menu overrides (from main style block) --- */
.um2 .wo-menu { background:var(--surface-2); border-color:var(--border); box-shadow:0 12px 34px rgba(0,0,0,.45); left:0; right:auto; }
.um2 .wo-menu button { color:var(--text-2); }
.um2 .wo-menu button svg { color:var(--text-3); }
.um2 .wo-menu button:hover { background:var(--surface); color:var(--text-1); }
.um2 .wo-menu button.danger { color:#f87171; }
.um2 .wo-menu button.danger svg { color:#f87171; }
.um2 .wo-menu button.danger:hover { background:rgba(220,38,38,.16); }

/* --- ordering / commercial modal styles (dedicated blocks) --- */
#pw-modal { position:fixed; inset:0; z-index:210; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(15,23,42,.55); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
#pw-modal.open { display:flex; }
.pwm-card { width:min(94vw,400px); background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:0 18px 50px rgba(15,23,42,.28); padding:1.5rem 1.5rem 1.25rem; }
.pwm-head { font-size:1.125rem; font-weight:700; color:var(--text-1); }
.pwm-sub { font-size:.8125rem; color:var(--text-2); margin-top:.25rem; margin-bottom:1.1rem; line-height:1.45; }
.pwm-field { margin-bottom:.85rem; }
.pwm-field label { display:block; font-size:.75rem; font-weight:600; color:var(--text-2); margin-bottom:.3rem; }
.pwm-field input { width:100%; height:2.5rem; border:1px solid var(--border); background:var(--surface-2); color:var(--text-1); border-radius:8px; padding:0 12px; font-size:.875rem; font-family:inherit; box-sizing:border-box; }
.pwm-field input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(143,207,105,.2); }
.pwm-msg { display:none; font-size:.8125rem; line-height:1.45; margin:.1rem 0 .35rem; }
.pwm-msg.err { display:block; color:#dc2626; }
.pwm-msg.ok { display:block; color:#15803d; }
.pwm-actions { display:flex; gap:10px; margin-top:1rem; }
.pwm-btn { flex:1; height:2.5rem; border-radius:8px; font-size:.875rem; font-weight:600; font-family:inherit; cursor:pointer; border:1px solid var(--border); }
.pwm-cancel { background:var(--surface); color:var(--text-2); }
.pwm-cancel:hover { background:var(--surface-2); }
.pwm-save { background:var(--accent); color:#fff; border-color:var(--accent); }
.pwm-save:hover { background:#7bc057; }
.pwm-save:disabled { opacity:.6; cursor:default; }
/* ── Unified centered-card modals ─────────────────────────────────────────────
   Converts the legacy right-side DRAWERS (feedback, maintenance, Take 5,
   Return-to-Work, calendar — all .wo-panel) into centered cards that match the
   orders pt-modal-card, so every detail modal shares one consistent shell.
   Higher-specificity + late source order so it cleanly overrides the drawer rules. */
#fb-modal, #wo-modal, #cal-day-panel, #t5-modal, #rtw-modal {
  align-items: center; justify-content: center; padding: 1.5rem;
}
#fb-modal.open, #wo-modal.open, #cal-day-panel.open, #t5-modal.open, #rtw-modal.open { display: flex; }
#fb-modal .wo-panel, #wo-modal .wo-panel, #cal-day-panel .wo-panel, #t5-modal .wo-panel, #rtw-modal .wo-panel {
  position: relative; inset: auto;
  width: 100%; max-width: min(42rem, 96vw); max-height: 88vh;
  border: 1px solid var(--border); border-radius: 16px;
  box-shadow: 0 20px 60px rgba(15,23,42,.30);
  transform: translateY(14px) scale(.985); opacity: 0;
  transition: transform .34s cubic-bezier(.16,1,.3,1), opacity .26s ease;
}
#fb-modal.open .wo-panel, #wo-modal.open .wo-panel, #cal-day-panel.open .wo-panel, #t5-modal.open .wo-panel, #rtw-modal.open .wo-panel {
  transform: translateY(0) scale(1); opacity: 1;
}
/* Footer to match the orders card (subtle grey bar) for a consistent finish. */
#fb-modal .wo-foot, #wo-modal .wo-foot, #t5-modal .wo-foot, #rtw-modal .wo-foot { background: var(--surface-2); }

/* ── Unified modal (.um-*) — clean centered-card detail modal ─────────────────── */
.um-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:22px 24px 16px; flex-shrink:0; }
.um-title { font-size:1.35rem; font-weight:600; letter-spacing:-.015em; line-height:1.25; color:var(--text-1); }
.um-x { width:34px; height:34px; border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--text-2); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .12s,border-color .12s; }
.um-x:hover { background:#fef2f2; border-color:#fca5a5; color:#dc2626; }
.um-divider { height:1px; background:var(--border-soft); margin:0 24px; flex-shrink:0; }
.um-bar-wrap { padding:18px 24px 4px; flex-shrink:0; }
.um-bar { display:flex; gap:6px; }
.um-bar-seg { flex:1; height:6px; border-radius:99px; background:#e5e7eb; }
.um-bar-seg.on { background:var(--accent); }
.um-bar-lbls { display:flex; margin-top:8px; font-size:var(--text-sm); }
.um-bar-lbls > span { flex:1; color:var(--text-3); }
.um-bar-lbls > span:nth-child(2) { text-align:center; }
.um-bar-lbls > span:last-child { text-align:right; }
.um-bar-lbls > span.cur { color:var(--text-1); font-weight:700; }
.um-body { flex:1; overflow-y:auto; padding:16px 24px 8px; }
.um-body::-webkit-scrollbar { width:4px; } .um-body::-webkit-scrollbar-thumb { background:var(--border); border-radius:2px; }
.um-rows { display:flex; flex-direction:column; gap:13px; }
.um-row { display:flex; align-items:center; font-size:var(--text-md); }
.um-row-lbl { display:flex; align-items:center; gap:8px; width:140px; flex-shrink:0; color:var(--text-3); }
.um-row-lbl svg { flex-shrink:0; }
.um-row-val { font-weight:500; color:var(--text-1); }
.um-row-val input, .um-row-val select { font:inherit; font-weight:500; border:1px solid var(--border); border-radius:7px; padding:5px 9px; background:var(--surface); color:var(--text-1); outline:none; }
.um-row-val input:focus, .um-row-val select:focus { border-color:#93c5fd; box-shadow:0 0 0 3px rgba(147,197,253,.2); }
.um-sec-lbl { font-size:var(--text-md); font-weight:600; color:var(--text-1); margin:20px 0 9px; }
.um-photowrap { margin-top:4px; }
.um-photos { display:flex; gap:9px; flex-wrap:wrap; }
.um-thumb { width:84px; height:84px; border-radius:10px; overflow:hidden; border:1px solid var(--border); padding:0; cursor:pointer; background:#f3f4f6; }
.um-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.um-compose { margin-top:12px; }
.um-compose-actions { display:flex; justify-content:flex-end; margin-top:8px; }
.um-add-note { background:var(--surface-2); border:1px solid var(--border); border-radius:8px; padding:7px 14px; font-size:var(--text-sm); font-weight:600; color:var(--text-1); cursor:pointer; }
.um-add-note:hover { background:var(--surface); border-color:#cbd5e1; }
.um-foot { flex-shrink:0; display:flex; align-items:center; gap:9px; padding:13px 24px; border-top:1px solid var(--border-soft); background:#fafbfc; }
.um-kebab { width:36px; height:36px; border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--text-3); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.um-kebab:hover { background:var(--surface-2); }
.um-foot-primary { border:none; background:var(--accent); color:#fff; border-radius:9px; padding:9px 18px; font-size:var(--text-md); font-weight:600; cursor:pointer; }
.um-foot-primary:hover { filter:brightness(1.05); }
.um-foot-primary.reopen { background:var(--surface); color:var(--text-2); border:1px solid var(--border); }

/* ── Work-order modal — right slide-in drawer (single column) ─────────────────── */
#wo-modal, #fb-modal, #t5-modal { align-items:stretch; justify-content:flex-end; padding:20px; background:rgba(15,23,42,.55); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
#wo-modal .wo-panel, #fb-modal .wo-panel, #t5-modal .wo-panel { position:relative; inset:auto; width:min(calc(100vw - 40px), max(400px, 38vw), 580px); max-width:none; height:100%; max-height:none; border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 18px 50px rgba(15,23,42,.24); padding:0; overflow:hidden; transform:translateX(calc(100% + 28px)); opacity:1; transition:transform .34s cubic-bezier(.16,1,.3,1); }
#wo-modal.open .wo-panel, #fb-modal.open .wo-panel, #t5-modal.open .wo-panel { transform:translateX(0); opacity:1; }
#order-modal { position:fixed; inset:0; z-index:100; display:none; align-items:stretch; justify-content:flex-end; padding:20px; background:rgba(15,23,42,.55); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
#order-modal.open { display:flex; }
#order-modal .wo-panel { position:relative; inset:auto; width:min(calc(100vw - 40px), max(400px, 38vw), 580px); max-width:none; height:100%; max-height:none; border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 18px 50px rgba(15,23,42,.24); padding:0; overflow:hidden; transform:translateX(calc(100% + 28px)); opacity:1; transition:transform .34s cubic-bezier(.16,1,.3,1); }
#order-modal.open .wo-panel { transform:translateX(0); }
.ord-meta { display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.ord-mrow { display:flex; justify-content:space-between; gap:10px; font-size:var(--text-sm); padding:7px 0; border-bottom:1px solid var(--border-soft); }
.ord-mrow span { color:var(--text-2); } .ord-mrow b { color:var(--text-1); font-weight:600; text-align:right; }
.um2 .pt-mtable { width:100%; border-collapse:collapse; font-size:var(--text-sm); }
.um2 .pt-mtable th { text-align:left; padding:7px 8px; border-bottom:1px solid var(--border); color:var(--text-3); font-weight:600; font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.04em; }
.um2 .pt-mtable th.r, .um2 .pt-mtable td.r { text-align:right; }
.um2 .pt-mtable td { padding:8px; border-bottom:1px solid var(--border-soft); color:var(--text-1); }
.um2 .pt-mtable tfoot td { border-bottom:none; border-top:1px solid var(--border); padding-top:10px; color:var(--text-1); }
.um2 .pt-citem-uom { font-size:var(--text-xs); color:var(--text-3); background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:1px 5px; margin-left:4px; }
.um2 .pt-mnote { font-size:var(--text-sm); color:var(--text-2); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px 12px; line-height:1.5; }
.um2 .pt-mnote b { color:var(--text-1); }
.ord-sup-input { width:54px; text-align:right; border:1px solid var(--border); border-radius:6px; padding:3px 6px; font:inherit; background:var(--surface); color:var(--text-1); }
.ord-out-btn { margin-left:5px; border:1px solid var(--border); background:transparent; border-radius:6px; padding:2px 7px; cursor:pointer; font-size:11px; color:#f87171; font-family:inherit; }
.um2-ghost { background:transparent; border:1px solid var(--border); color:var(--text-2); border-radius:var(--radius-sm); padding:0 14px; font-weight:600; font-size:var(--text-sm); cursor:pointer; height:40px; display:inline-flex; align-items:center; gap:6px; }
.um2-ghost:hover { background:var(--surface-2); color:var(--text-1); }
.um2-ghost.danger { color:#f87171; } .um2-ghost.danger:hover { background:rgba(220,38,38,.12); color:#f87171; }
#portal-modal { position:fixed; inset:0; z-index:300; display:none; align-items:stretch; justify-content:flex-end; padding:20px; background:rgba(15,23,42,.4); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
#portal-modal.open { display:flex; }
#portal-modal .wo-panel { position:relative; inset:auto; width:min(calc(100vw - 40px), max(400px, 38vw), 580px); max-width:none; height:100%; max-height:none; border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 18px 50px rgba(15,23,42,.2); padding:0; overflow:hidden; transform:translateX(calc(100% + 28px)); opacity:1; transition:transform .34s cubic-bezier(.16,1,.3,1); }
#portal-modal.open .wo-panel { transform:translateX(0); }
.um2.um2-light { --surface:#fff; --surface-2:#f8f9fb; --text-1:#111827; --text-2:#6b7280; --text-3:#9ca3af; --border:#e5e7eb; --border-soft:#f0f2f5; color-scheme:light; }
.um2-light .um-bar-seg { background:#e5e7eb; }
.t5-item { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); padding:8px 11px; margin-bottom:6px; font-size:var(--text-base); color:var(--text-1); line-height:1.45; }
.t5-none { font-size:var(--text-sm); color:var(--text-3); }
.t5-signoff { font-size:var(--text-base); color:var(--text-2); }
.t5-signoff b { color:var(--text-1); font-weight:600; }
.t5-signoff-sep { margin:0 8px; color:var(--text-3); }
.fb-rategrid { display:grid; grid-template-columns:1fr 1fr; gap:9px 18px; }
.fb-raterow { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.fb-ratelbl { font-size:var(--text-sm); color:var(--text-2); }
.fb-rateone { display:flex; align-items:center; gap:10px; font-size:16px; letter-spacing:2px; line-height:1; }
.fb-ratestars { font-size:14px; letter-spacing:1.5px; line-height:1; white-space:nowrap; }
.fb-ratenum { font-size:var(--text-md); font-weight:600; color:var(--text-1); }
.fb-photo { display:block; max-width:160px; border:1px solid var(--border); border-radius:var(--radius-sm); overflow:hidden; cursor:zoom-in; background:var(--surface-2); padding:0; }
.fb-photo img { display:block; width:100%; height:auto; }
.um2-primary.um2-primary-done { background:transparent; color:var(--accent); border:1px solid var(--accent); }
.um2 { display:flex; flex-direction:column; height:100%; background:var(--surface); }
.um2-top { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px 11px 20px; border-bottom:1px solid var(--border-soft); flex-shrink:0; }
.um2-crumb { display:flex; align-items:center; gap:6px; font-size:var(--text-sm); color:var(--text-2); min-width:0; flex-wrap:wrap; }
.um2-crumb-sep { color:var(--text-3); }
.um2-crumb-cur { color:var(--text-1); font-weight:600; }
.um2-crumb-link { background:none; border:none; font:inherit; font-size:var(--text-sm); color:var(--text-2); cursor:pointer; padding:0; }
.um2-crumb-link:hover { color:#46832a; text-decoration:underline; }
.um2-x { width:32px; height:32px; border-radius:var(--radius-sm); border:1px solid var(--border); background:var(--surface); color:var(--text-2); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.um2-x:hover { background:#fef2f2; border-color:#fca5a5; color:#dc2626; }
.um2-body { flex:1; overflow-y:auto; padding:20px 24px 26px; }
.um2-formwrap { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; background:#fff; }
.um2-formframe { width:100%; height:100%; border:none; display:block; background:#fff; }
.um2-fillout { width:100%; height:auto; min-height:100%; }
.um2-fillout iframe { width:100% !important; min-height:560px; border:none !important; display:block; }
.um2-open-ext { display:inline-flex; align-items:center; gap:5px; padding:6px 11px; border-radius:8px; background:var(--accent); color:#fff; font-size:var(--text-sm); font-weight:600; text-decoration:none; white-space:nowrap; }
.um2-open-ext:hover { background:#7bc057; }
.ind-del { background:none; border:none; color:var(--text-3); cursor:pointer; padding:4px 6px; border-radius:6px; display:inline-flex; align-items:center; }
.ind-del:hover { background:#fef2f2; color:#dc2626; }
.um2-formempty { padding:24px 22px; font-size:var(--text-sm); color:var(--text-2); line-height:1.55; }
.triage-add { background:var(--accent); color:#fff; border:1px solid var(--accent); gap:4px; }
.triage-add:hover { filter:brightness(1.04); }
.triage-add svg { color:#fff; }
.um2-reqrow { display:flex; gap:12px; align-items:stretch; margin:16px 0 0; }
.um2-reqimg { position:relative; width:84px; min-height:84px; border-radius:var(--radius-sm); overflow:hidden; flex-shrink:0; background:var(--surface-2); border:1px solid var(--border); padding:0; cursor:zoom-in; display:flex; align-items:center; justify-content:center; }
.um2-reqimg img { width:100%; height:100%; object-fit:cover; display:block; }
.um2-reqimg-ph { color:var(--text-3); cursor:default; }
.um2-reqimg-more { position:absolute; right:3px; bottom:3px; background:rgba(15,23,42,.78); color:#fff; font-size:var(--text-xs); font-weight:700; border-radius:5px; padding:1px 5px; }
.um2-reqcard { flex:1; min-width:0; min-height:0; display:flex; flex-direction:column; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); padding:15px 16px; }
.um2-reqhead { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:15px; }
.um2-reportedby { font-size:var(--text-xs); color:var(--text-3); font-weight:600; white-space:nowrap; flex-shrink:0; }
.um2-eyebrow { font-size:var(--text-sm); font-weight:600; color:var(--text-2); }
.um2-title { font-size:var(--text-lg); font-weight:600; letter-spacing:-.01em; line-height:1.3; color:var(--text-1); }
.um2-chips { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:auto; padding-top:15px; }
.um2-chip { display:inline-flex; align-items:center; gap:5px; height:22px; font-size:var(--text-sm); font-weight:600; color:var(--text-1); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); padding:0 5px; line-height:1; }
.um2-chip svg { color:#46832a; flex-shrink:0; }
.um2-chip-muted { color:var(--text-2); }
.um2-logged { margin-left:auto; align-self:center; font-size:var(--text-xs); font-weight:600; color:var(--text-3); white-space:nowrap; }
.um2-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 14px; }
.um2-detrow { display:flex; gap:12px; align-items:flex-start; }
.um2-detrow > .um2-grid { flex:1; min-width:0; }
.um2-detrow .um2-reqimg { width:calc((100% - 12px) / 3); height:130px; min-height:0; align-self:flex-start; }
.um2-field { display:flex; flex-direction:column; gap:6px; min-width:0; }
.um2-field-lbl { display:flex; align-items:center; gap:6px; font-size:var(--text-xs); font-weight:600; color:var(--text-3); }
.um2-field-lbl svg { color:var(--text-3); flex-shrink:0; }
.um2-field select, .um2-field input { width:100%; font:inherit; font-weight:500; font-size:var(--text-base); border:1px solid var(--border); border-radius:var(--radius-sm); padding:7px 9px; background:var(--surface); color:var(--text-1); outline:none; }
.um2-field-static { width:100%; font-weight:500; font-size:var(--text-base); border:1px solid var(--border); border-radius:var(--radius-sm); padding:7px 9px; background:var(--surface-2); color:var(--text-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.um2-field select:focus, .um2-field input:focus { border-color:#93c5fd; box-shadow:0 0 0 3px rgba(147,197,253,.2); }
.um2-field select { appearance:none; -webkit-appearance:none; background-color:var(--surface); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238c8e93' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 10px center; padding-right:30px; }
.um2-act-filter { appearance:none; -webkit-appearance:none; background-color:var(--surface); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238c8e93' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 7px center; padding:4px 23px 4px 9px; }
.um2-field input[type="date"] { text-transform:uppercase; }
/* Option A: full-width photo banner, compact meta grid, collapsible Notify */
.um2-photobanner { display:block; width:100%; height:150px; margin-top:14px; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; background:var(--surface-2); padding:0; cursor:zoom-in; position:relative; }
.um2-photobanner img { width:100%; height:100%; object-fit:cover; display:block; }
.um2-sec-meta { margin-top:16px; padding-top:0; }
.um2-sec-meta::before { display:none; }
.um2-sec-meta .um2-grid { grid-template-columns:repeat(3, minmax(0,1fr)); gap:11px; }
.um2-sec-meta .um2-field { gap:5px; }
.um2-sec-meta .um2-field-lbl { font-size:10.5px; }
.um2-sec-meta .um2-field select, .um2-sec-meta .um2-field input { padding:5px 8px; font-size:var(--text-sm); box-sizing:border-box; }
.um2-sec-meta .um2-field-static { display:flex; align-items:center; }
.um2-sec-meta .um2-field select { padding-right:23px; background-position:right 7px center; }
.um2-nothead-btn { width:100%; background:none; border:none; padding:0; cursor:pointer; font:inherit; text-align:left; }
.um2-nothead .um2-sec-h { margin:0; line-height:1.2; }
.um2-nothead-r { display:flex; align-items:center; gap:10px; }
.um2-notchev { display:inline-flex; align-items:center; color:var(--text-3); transition:transform .16s ease; }
.um2-notchev svg { display:block; }
.um2-notopen .um2-notchev { transform:rotate(90deg); }
.um2-notsec .um2-nothead { margin-bottom:0; }
.um2-notbody { margin-top:12px; }
.um2 .wo-note { background:var(--surface-2); }
.um2-dd { position:relative; width:100%; }
.um2-dd-trigger { width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; font:inherit; font-weight:500; font-size:var(--text-base); border:1px solid var(--border); border-radius:var(--radius-sm); padding:7px 9px; background:var(--surface); color:var(--text-1); cursor:pointer; text-align:left; }
.um2-dd-trigger:hover { border-color:#5a5b5e; }
.um2-dd-trigger:focus-visible { outline:none; border-color:#93c5fd; box-shadow:0 0 0 3px rgba(147,197,253,.2); }
.um2-dd-chev { flex-shrink:0; color:var(--text-3); transition:transform .15s; }
.um2-dd.open .um2-dd-chev { transform:rotate(180deg); }
.um2-dd-panel { display:none; position:absolute; top:calc(100% + 5px); left:0; right:0; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 10px 28px rgba(0,0,0,.45); padding:4px; z-index:130; }
.um2-dd.open .um2-dd-panel { display:block; }
.um2-dd-opt { display:block; width:100%; text-align:left; font:inherit; font-size:var(--text-base); color:var(--text-1); background:none; border:none; border-radius:7px; padding:7px 9px; cursor:pointer; }
.um2-dd-opt:hover { background:var(--surface); }
.um2-dd-opt.on { color:var(--accent); font-weight:600; }
.um2-dd-compact { width:auto; }
.um2-dd-compact .um2-dd-trigger { width:auto; gap:7px; font-size:var(--text-xs); font-weight:600; color:var(--text-2); padding:4px 9px; }
.um2-dd-compact .um2-dd-panel { left:auto; right:0; min-width:130px; }
.um2-nothead { display:flex; align-items:center; justify-content:space-between; gap:9px; margin-bottom:11px; }
.um2-soon { font-size:var(--text-xs); font-weight:700; letter-spacing:.02em; color:var(--accent); background:rgba(143,207,105,.12); border:1px solid rgba(143,207,105,.32); border-radius:6px; padding:2px 8px; }
.um2-notcard { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); padding:14px; }
.um2-notcontact { display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.um2-noticon { width:34px; height:34px; border-radius:9px; background:var(--surface); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color:var(--accent); flex-shrink:0; }
.um2-notc-txt { min-width:0; }
.um2-notlbl { font-size:var(--text-xs); color:var(--text-3); font-weight:600; }
.um2-notval { font-size:var(--text-base); color:var(--text-1); font-weight:600; }
.um2-nottoggle { display:flex; align-items:center; gap:11px; margin-bottom:14px; }
.um2-switch { width:34px; height:19px; border-radius:99px; background:var(--accent); position:relative; flex-shrink:0; }
.um2-switch::after { content:''; position:absolute; top:2px; right:2px; width:15px; height:15px; border-radius:50%; background:var(--surface); }
.um2-nottoggle-txt { font-size:var(--text-base); color:var(--text-1); line-height:1.4; }
.um2-notmsg { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); padding:11px 12px; font-size:var(--text-base); color:var(--text-2); line-height:1.55; margin-top:6px; }
.um2-notfoot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; }
.um2-notchan { font-size:var(--text-xs); font-weight:600; color:var(--text-2); background:var(--surface); border:1px solid var(--border); border-radius:7px; height:30px; padding:0 10px; display:inline-flex; align-items:center; gap:5px; box-sizing:border-box; }
.um2-notbtn { border:none; background:var(--accent); color:#fff; border-radius:7px; height:30px; padding:0 14px; font-size:var(--text-sm); font-weight:600; display:inline-flex; align-items:center; gap:6px; cursor:pointer; box-sizing:border-box; }
.um2-notbtn:hover { filter:brightness(1.05); }
.um2-notnone { color:var(--text-3); }
.um2-notcard--none .um2-switch { background:var(--border); }
.um2-notcard--none .um2-nottoggle-txt, .um2-notcard--none .um2-nottoggle-txt b { color:var(--text-3); }
.um2-notcard--none .um2-notbtn { background:transparent; color:var(--text-3); border:1px solid var(--border); cursor:not-allowed; }
.um2-notcard--none .um2-notbtn:hover { filter:none; }
.um2-notempty { display:flex; align-items:center; gap:9px; font-size:var(--text-base); color:var(--text-3); }
.um2-notempty svg, .um2-noticon svg, .um2-notchan svg, .um2-notbtn svg { flex-shrink:0; }
.um2 .um-thumb { cursor:zoom-in; transition:transform .1s, border-color .1s; }
.um2 .um-thumb:hover { transform:scale(1.02); border-color:#46832a; }
.um2-statuswrap { margin-bottom:0; }
.um2-statuswrap .um-bar-wrap { padding:0; }
.um2-statusmeta { font-size:var(--text-sm); color:var(--text-3); margin-top:4px; padding:0 2px; }
.um2-sec { margin:19px 0 0; padding-top:19px; position:relative; }
.um2-sec::before { content:''; position:absolute; top:0; left:10px; right:10px; height:1px; background:var(--border); }
.um2-sec-details { margin-top:16px; padding-top:0; }
.um2-sec-details::before { display:none; }
.um2-sec-h { font-size:var(--text-sm); font-weight:600; color:var(--text-2); margin-bottom:11px; }
.um2-acthead { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:11px; }
.um2-act-filter { font:inherit; font-size:var(--text-xs); font-weight:600; color:var(--text-2); border:1px solid var(--border); border-radius:var(--radius-sm); padding:3px 8px; background:var(--surface); cursor:pointer; outline:none; }
.um2-person { display:flex; align-items:center; gap:10px; margin-bottom:11px; }
.um2-avatar { width:32px; height:32px; border-radius:50%; background:var(--surface-2); border:1px solid var(--border); color:var(--text-2); font-size:var(--text-xs); font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.um2-person-name { font-weight:600; font-size:var(--text-md); color:var(--text-1); }
.um2-cd { display:flex; flex-direction:column; gap:9px; }
.um2-cd-row { display:flex; align-items:center; gap:9px; font-size:var(--text-base); color:var(--text-2); }
.um2-cd-row svg { color:var(--text-3); flex-shrink:0; }
.um2 .um-row { font-size:var(--text-base); }
.um2 .um-row-lbl { width:96px; gap:7px; }
.um2 .um-row-val { flex:1; }
.um2 .um-row-val input, .um2 .um-row-val select { width:100%; }
.um2-primary { background:var(--accent); color:#fff; border:none; border-radius:var(--radius-sm); padding:0 18px; font-weight:600; font-size:var(--text-md); cursor:pointer; }
.um2-primary:hover { filter:brightness(1.04); }
.um2-primary.reopen { background:var(--surface); color:var(--text-2); border:1px solid var(--border); }
.um2-iconbtn { width:40px; border-radius:var(--radius-sm); border:1px solid var(--border); background:var(--surface); color:var(--text-2); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.um2-iconbtn:hover { background:var(--surface-2); }
.um2-foot { flex-shrink:0; display:flex; align-items:center; gap:9px; padding:12px 18px; border-top:1px solid var(--border); background:var(--surface-2); }
.um2-foot .um2-iconbtn, .um2-foot .wo-hold-btn, .um2-foot .um2-primary { height:40px; display:inline-flex; align-items:center; justify-content:center; }
.um2-foot .wo-hold-btn { padding:0 16px; border-radius:var(--radius-sm); }
.um2-empty { color:var(--text-3); font-size:var(--text-base); padding:24px 0; text-align:center; }
/* ── Dark modal (experiment) — #282828 surface, light text, green kept ─────────── */
/* Modals follow the app theme: light by default, dark only when the app is in dark mode. */
.um2 {
  --surface: #ffffff;
  --surface-2: #f8f9fb;
  --text-1: #111827;
  --text-2: #6b7280;
  --text-3: #9ca3af;
  --border: #e5e7eb;
  --border-soft: #f0f2f5;
  color-scheme: light;
}
html[data-theme="dark"] .um2 {
  --surface: #282828;
  --surface-2: #333333;
  --text-1: #f3f4f5;
  --text-2: #b6b8bc;
  --text-3: #8c8e93;
  --border: #454648;
  --border-soft: #3a3b3d;
  color-scheme: dark;
}
.um2 .um-bar-seg { background:#454648; }
.um2 .um-bar-seg.on { background:var(--accent); }
html[data-theme="dark"] .um2 .um2-x:hover { background:#3a2020; border-color:#7f3a3a; color:#f87171; }
.um2 .um2-chip svg { color:#a7e08a; }
.um2 .um2-loc svg, .um2 .um2-cd-row svg, .um2 .um2-field-lbl svg { color:var(--text-3); }