/* ── icons.css — the one icon set on the desk (banking/js/icons.js) ──
   An icon is the colour of the word beside it: muted on the bar, accent when
   the tab is active, red inside a warning. Sizes: 13px on the department tabs,
   12px on the clock and in the queue, 1em inside pane copy. Tokens from desk.css. */

.gc-ico{ display:inline-block; vertical-align:-.2em; flex:none; }

/* the department tabs: the icon before the word */
.dept{ display:inline-flex; align-items:center; gap:var(--sp-1); }
.dept .gc-ico{ vertical-align:0; opacity:.7; }
.dept:hover .gc-ico,.dept.on .gc-ico,.dept.hot .gc-ico{ opacity:1; }
.dept.on .gc-ico{ color:var(--accent); }

/* a locked function: the drawn lock replaces the css one */
.fn .gc-ico[data-ico="lock"]{ margin-left:var(--sp-1); vertical-align:-.1em; opacity:.7; }

/* the clock */
.spd .gc-ico,#btn-step .gc-ico{ margin-right:var(--sp-1); vertical-align:-.22em; }

/* the queue: the kind carries its icon */
.qi-kind .gc-ico{ margin-right:var(--sp-1); vertical-align:-.25em; }

/* the pane head: swap, fill the desk, close */
.ph-acts{ display:inline-flex; gap:var(--sp-0); margin-left:var(--sp-2); flex:none; }
.ph-acts button{ display:inline-flex; align-items:center; justify-content:center; width:var(--h-icon); height:var(--h-icon); padding:0; border:0; background:transparent; color:var(--dim); cursor:pointer; }
.ph-acts button:hover{ color:var(--text); background:var(--panel-2); }
#grid.max-a:not(.ws) #pane-b,#grid.max-a:not(.ws) #queue,#grid.max-b:not(.ws) #pane-a,#grid.max-b:not(.ws) #queue{ display:none; }
#grid.max-a:not(.ws),#grid.max-b:not(.ws){ grid-template-columns:minmax(0,1fr); }
#grid.max-b:not(.ws) #pane-b{ grid-column:1; grid-row:1 / span 2; }
#grid.max-a .ph-acts [data-act="max"],#grid.max-b .ph-acts [data-act="max"]{ color:var(--accent); }

/* the sheet at the foot of SET: every icon with its name */
.gc-sheet-wrap{ margin-top:var(--sp-3); } .gc-sheet-wrap summary{ cursor:pointer; }
.gc-sheet{ display:grid; grid-template-columns:repeat(auto-fill,minmax(calc(118 * var(--u)),1fr)); gap:var(--sp-1); }
.gc-sheet div{ display:flex; align-items:center; gap:var(--sp-2); padding:var(--sp-1h) var(--sp-2); border:1px solid var(--line); font:var(--fs-1) var(--mono); color:var(--muted); }
.gc-sheet div .gc-ico{ color:var(--text); }