/* work-order-view.modals.css -- Quick Schedule calendar modal, v22 hover-expand clone, and the global responsive overrides (must stay last)

   Part 6 of 6. The stylesheet reached 79KB in one file, and the push tooling
   takes whole-file content, so every rule change re-emitted the whole thing.
   Split on the section boundaries that were already there. Load order is the
   cascade -- it is fixed in work-order-view.html and must not be reordered.
   No rule changed in this split. */

/* ============================================================
   QUICK SCHEDULE MODAL (ledger) — combines Classic's Quick Schedule
   action with the Schedule-Required click-to-calendar behavior.
   ============================================================ */
.sched-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:300;align-items:flex-start;justify-content:center;padding:40px 24px;}
.sched-overlay.open{display:flex;}
.sched-modal{background:var(--bg);border:1px solid var(--border-2);border-radius:12px;width:100%;max-width:1180px;max-height:calc(100vh - 80px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.55);}
.sm-head{display:flex;align-items:center;padding:15px 20px;border-bottom:1px solid var(--border);flex-shrink:0;}
.sm-head iconify-icon.sh-cal{font-size:20px;color:var(--blue);margin-right:10px;}
.sm-head h3{font-size:16px;font-weight:700;color:var(--text);margin:0;}
.sm-head .sh-x{margin-left:auto;color:var(--text-secondary);font-size:22px;cursor:pointer;padding:4px;border-radius:6px;}
.sm-head .sh-x:hover{background:var(--hover);color:var(--text);}
.sm-body{display:grid;grid-template-columns:220px 1fr;min-height:0;flex:1;}
.sm-side{border-right:1px solid var(--border);padding:16px;overflow-y:auto;}
.sm-sl{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--text-disabled);margin:0 0 8px;}
.sm-field{background:var(--paper);border:1px solid var(--border-2);border-radius:7px;padding:8px 11px;font-size:13px;color:var(--text);display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.sm-field .fk{color:var(--text-secondary);} .sm-field .fv{margin-left:auto;color:var(--text);} .sm-field iconify-icon{color:var(--text-secondary);font-size:16px;}
.sm-field.search iconify-icon{order:-1;margin-left:0;}
.sm-wocard{background:var(--blue-16);border:1px solid var(--blue-24);border-radius:8px;padding:11px;margin-top:4px;}
.sm-wocard .n{font-size:13px;font-weight:600;color:var(--text);}
.sm-wocard .m{font-size:11px;color:var(--text-secondary);margin-top:3px;line-height:1.5;}
.sm-wocard .b{display:inline-block;margin-top:8px;background:var(--green-15);color:var(--green);font-size:10px;font-weight:600;padding:2px 8px;border-radius:10px;}
.sm-qh{margin-top:16px;border-top:1px solid var(--border);padding-top:14px;}
.sm-qh .row{display:flex;justify-content:space-between;font-size:12px;padding:4px 0;color:var(--text-secondary);}
.sm-qh .row b{color:var(--text);font-weight:600;} .sm-qh .row b.link{color:var(--blue);cursor:pointer;}
.sm-cal{display:flex;flex-direction:column;min-width:0;}
.sm-ctop{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap;}
.sm-today{border:1px solid var(--border-2);background:transparent;color:var(--text);font-size:12px;font-weight:600;padding:6px 12px;border-radius:7px;}
.sm-nav{display:flex;align-items:center;gap:6px;color:var(--text-secondary);}
.sm-nav iconify-icon{font-size:18px;cursor:pointer;padding:3px;border-radius:5px;} .sm-nav iconify-icon:hover{background:var(--hover);color:var(--text);}
.sm-dr{font-size:13px;font-weight:600;color:var(--text);}
.sm-seg{display:inline-flex;border:1px solid var(--border-2);border-radius:7px;overflow:hidden;}
.sm-seg span{padding:5px 11px;font-size:12px;font-weight:600;color:var(--text-secondary);border-right:1px solid var(--border-2);cursor:pointer;}
.sm-seg span:last-child{border-right:none;} .sm-seg span.on{background:var(--blue);color:#fff;}
.sm-tog{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text-secondary);margin-left:auto;}
.sm-sw{width:32px;height:18px;border-radius:10px;background:var(--green);position:relative;cursor:pointer;}
.sm-sw::after{content:"";position:absolute;top:2px;right:2px;width:14px;height:14px;border-radius:50%;background:#fff;}
.sm-views{display:inline-flex;border:1px solid var(--border-2);border-radius:7px;overflow:hidden;}
.sm-views span{padding:5px 11px;font-size:11px;font-weight:600;color:var(--text-secondary);border-right:1px solid var(--border-2);text-transform:uppercase;letter-spacing:.3px;cursor:pointer;}
.sm-views span:last-child{border-right:none;} .sm-views span.on{background:var(--blue-16);color:var(--blue);}
.sm-gridwrap{overflow-y:auto;flex:1;min-height:0;}
.sm-grid{display:grid;grid-template-columns:48px repeat(5,1fr);}
.sm-gh{padding:8px 6px;text-align:center;border-bottom:1px solid var(--border);border-right:1px solid var(--border);}
.sm-gh:last-child{border-right:none;}
.sm-gh.today{background:var(--blue-16);border-top:2px solid var(--blue);}
.sm-gh .d{font-size:12px;font-weight:600;color:var(--text);}
.sm-gh .a{font-size:10px;color:var(--green);margin-top:2px;}
.sm-gh.corner{background:transparent;}
.sm-tcol{font-size:10px;color:var(--text-disabled);text-align:right;padding:4px 6px 0 0;border-right:1px solid var(--border);border-bottom:1px solid var(--border);}
.sm-gc{border-right:1px solid var(--border);border-bottom:1px solid var(--border);height:46px;position:relative;}
.sm-gc:nth-child(6n){border-right:none;}
.sm-appt{position:absolute;inset:3px;background:var(--blue);border-radius:5px;padding:4px 6px;overflow:hidden;z-index:2;}
.sm-appt .an{font-size:10px;font-weight:600;color:#fff;line-height:1.2;} .sm-appt .as{font-size:9px;color:rgba(255,255,255,.85);}
.sm-ghost{position:absolute;inset:3px;border:1.5px dashed var(--blue);border-radius:5px;background:var(--blue-16);display:flex;align-items:center;justify-content:center;color:var(--blue);font-size:10px;font-weight:600;z-index:1;cursor:pointer;text-align:center;}
.sm-foot{display:flex;align-items:center;gap:10px;padding:12px 16px;border-top:1px solid var(--border);flex-shrink:0;flex-wrap:wrap;}
.sm-foot .hint{font-size:11px;color:var(--text-secondary);display:flex;align-items:center;gap:5px;}
.sm-foot .hint iconify-icon{font-size:14px;}
.sm-foot .btns{margin-left:auto;display:flex;gap:8px;}
.sm-btn{font-size:12px;font-weight:600;padding:8px 16px;border-radius:7px;border:1px solid var(--border-2);background:transparent;color:var(--text);}
.sm-btn:hover{border-color:var(--blue);}
.sm-btn.pri{background:var(--green);border-color:var(--green);color:#fff;} .sm-btn.pri:hover{filter:brightness(1.05);}
@media(max-width:820px){ .sm-body{grid-template-columns:1fr;} .sm-side{display:none;} }

/* ============================================================
   v22 HOVER-EXPAND ON TRUNCATED CELLS
   v18 made the subgroup tables table-layout:fixed, which is what lets a
   column keep the width you drag it to - and is also why a cell too narrow
   for its value clips with an ellipsis. Hovering a clipped cell now draws
   the whole value. v22 also gives the HEADERS the same clip, which they
   never had: a long header used to spill into its neighbour.

   The overlay is a body-level element rather than the cell itself growing,
   because .lg-tscroll scrolls horizontally and clips its children - anything
   expanding inside the table is cut off at the table's edge. The catalog
   popover and the column picker render on <body> for the same reason.

   It is a CLONE of the cell, so status pills, the stacked part identity and
   the warranty switch all come across. The identity and muted rules are
   restated here because the originals are scoped under .lg-table td.item and
   do not reach a clone that lives outside the table.

   v22.1: the clone paints its OWN opaque surface and does not copy the
   cell's. A selected row's cells are var(--blue-16) - a 16%-alpha tint - so
   copying it drew the clone see-through and the text underneath bled into
   it. An untinted cell is var(--paper), identical to the card it floats
   over, so copying that made the clone invisible as a raised thing either
   way. It now takes the popover treatment used by the menus, the column
   picker and the catalog list: a lighter surface and a heavy drop shadow.

   NET-NEW: the ERP does nothing with an overflowing grid cell - no tooltip,
   no expansion - so this is a proposal, not a fidelity fix.
   ============================================================ */
.cx{position:fixed;z-index:160;display:none;box-sizing:border-box;
    background:var(--paper-hover);border:1px solid var(--border-2);border-radius:8px;
    box-shadow:0 14px 40px rgba(0,0,0,.5);
    padding:12px 14px;font-size:13.5px;font-weight:500;color:var(--text);
    width:max-content;max-width:460px;pointer-events:none;}
.cx.show{display:block;}
/* a header keeps its own type: uppercase, smaller, secondary */
.cx.head{padding:9px 14px;font-size:10.5px;font-weight:600;text-transform:uppercase;
    letter-spacing:.4px;color:var(--text-secondary);}
.cx.num{text-align:right;}
/* the resize grabber is part of a header cell but means nothing in a clone */
.cx .rz{display:none;}
.cx .idn,.cx .idsub{display:block;}
.cx .idsub{margin-top:3px;font-size:11.5px;font-weight:400;color:var(--text-secondary);}
.cx .muted{color:var(--text-disabled);}

/* ============================================================
   v49: ACTIVITY EXPANDS INLINE. v44 moved the pane into a 560px drawer that
   overlaid the page; Tim did not like the full-height sidebar, so the rail
   itself grows to the same width IN PLACE and the ledger narrows beside it.
   The pane never moves now, which makes this simpler than v44 was: no
   body-level shell, no appendChild dance, no handler-survival argument - just
   a class on the ledger and one grid-template-columns override.
   CLICK-ONLY (Tim): Expand toggles, and nothing collapses on pointer-out.
   THE TOTALS CARD WIDENS TOO (Tim) - it shares .lv-side, so it comes along
   for free and the column stays aligned.
   Loads after ledger.css, which is what lets it override .lv-body.
   ============================================================ */
.act-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.act-head-t{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--text-disabled);}
.act-expand{display:flex;align-items:center;gap:5px;margin-left:auto;background:transparent;border:1px solid var(--border-2);border-radius:7px;padding:4px 9px;color:var(--text-secondary);font-size:11px;font-weight:600;cursor:pointer;}
.act-expand iconify-icon{font-size:14px;}
.act-expand:hover{border-color:var(--blue);color:var(--text);}
.lv.act-wide .act-expand{border-color:var(--blue);color:var(--blue);}
/* the rail column - and the Totals card under it - take the wider track */
.lv.act-wide .lv-body{grid-template-columns:minmax(0,1fr) 560px;}
/* the message body is new (v44) and only the ledger rail carries it - Classic's
   feed is untouched. Two lines while the rail is narrow, everything once it is
   expanded, which is what expanding is FOR. */
.feed-msg{font-size:12.5px;color:var(--text-secondary);line-height:1.5;margin-top:5px;}
.lv-rail .feed-msg{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.lv.act-wide .lv-rail .feed-msg{-webkit-line-clamp:unset;overflow:visible;}
/* the sub-tabs get room to breathe at the wider size */
.lv.act-wide .act-tabs{margin-bottom:12px;}

@media(max-width:1180px){
  .main-grid,.details-panel,.two-col,.lv-body{grid-template-columns:1fr;}
  /* v49: .lv.act-wide .lv-body out-specifies the line above (three selectors
     against one), so without this the expanded rail would hold 560px on a
     narrow window instead of collapsing with everything else. */
  .lv.act-wide .lv-body{grid-template-columns:1fr;}
  .sumbar,.statbar{flex-wrap:wrap;} .sumcell,.statcell{border-right:none;border-bottom:1px solid var(--border);}
  .lv-rail{position:static;} .bb-stats{gap:16px;} .lv-id-right{gap:14px;}
  .lv-side{position:static;}
}
