/* Lugoda Sentinel — Asset & Safety Register module styles.
   Extends the shared component CSS (card/kpi/pill/table/modal). Dark theme, red accent. */

/* ---- KPI band: clickable tiles ---- */
.reg-kpis .kpi.clk{cursor:pointer;transition:.15s}
.reg-kpis .kpi.clk:hover{border-color:var(--red);transform:translateY(-1px)}

/* ---- filter bar ---- */
.reg-filterbar{margin-bottom:16px}
.reg-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.reg-spacer{flex:1 1 auto}

/* native select / input styled for the dark theme */
.reg-sel,.reg-search{
  background:var(--panel2);border:1px solid var(--line);color:var(--txt);
  font-size:13px;font-family:inherit;padding:8px 11px;border-radius:10px;outline:none;transition:.15s}
.reg-sel{cursor:pointer;min-width:140px;appearance:none;-webkit-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 16px) 16px,calc(100% - 11px) 16px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;
  padding-right:30px}
.reg-search{flex:1 1 240px;min-width:200px}
.reg-sel:focus,.reg-search:focus{border-color:var(--red)}
.reg-sel:hover{border-color:#50505c}
.reg-search::placeholder{color:var(--muted)}
.reg-sel option{background:var(--panel);color:var(--txt)}

.reg-toggle{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);
  background:var(--panel2);border:1px solid var(--line);padding:8px 12px;border-radius:10px;cursor:pointer;user-select:none}
.reg-toggle input{accent-color:var(--red);cursor:pointer}
.reg-toggle:hover{border-color:#50505c}

.reg-modes{display:inline-flex;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.reg-mode{border-radius:0;border:none;background:var(--panel2)}
.reg-mode:hover{background:var(--panel)}
.reg-mode.on{background:var(--red);color:#fff;border-color:var(--red)}
.reg-mode.on:hover{background:var(--red-dark)}

/* ---- table ---- */
.reg-tablecard{overflow:hidden}
.reg-tablewrap{max-height:62vh;overflow:auto}
.reg-table{min-width:1020px}
.reg-table thead th{position:sticky;top:0;background:var(--panel);z-index:2}
.reg-table td .reg-loc-sub{display:block;font-size:11px;color:var(--muted);margin-top:1px}
.reg-table td b{font-size:13px}

.reg-tag{font-family:'Consolas','SF Mono',ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;color:#d9d9e2;white-space:nowrap}
.reg-mono{font-family:'Consolas','SF Mono',ui-monospace,Menlo,monospace;font-size:12px;color:#cfcfd6}
.reg-clsicon{font-size:14px}

.reg-tier{display:inline-block;font-size:10px;font-weight:700;background:#33333c;color:#bbb;padding:2px 7px;border-radius:6px}

/* due-date colour classes */
.due-red{color:#ff8b8b;font-weight:600}
.due-amber{color:var(--amber);font-weight:600}

/* live-link dot on tag */
.reg-livedot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);
  box-shadow:0 0 6px var(--green);vertical-align:middle;margin-left:3px;animation:pulse 2s infinite}

/* sortable headers */
.reg-sortable{cursor:pointer;user-select:none;white-space:nowrap}
.reg-sortable:hover{color:#fff}
.reg-sortable.on{color:var(--red)}

.reg-cap{padding:10px 16px;font-size:12px;border-top:1px solid var(--line)}

/* ---- by-client view ---- */
.reg-clientlist{display:flex;flex-direction:column;gap:12px}
.reg-client{overflow:hidden}
.reg-clienthead{display:flex;align-items:center;gap:12px;padding:13px 16px;cursor:pointer;transition:.15s}
.reg-clienthead:hover{background:var(--panel2)}
.reg-caret{width:14px;color:var(--muted);font-size:13px;flex:0 0 14px}
.reg-client.open .reg-caret{color:var(--red)}
.reg-clientname{flex:1;min-width:0}
.reg-clientname b{font-size:15px}
.reg-clientname span{display:block;font-size:11px;color:var(--muted);margin-top:1px}
.reg-clientcount{font-size:11px;font-weight:700;color:#cfcfd6;background:#2c2c34;padding:3px 10px;border-radius:999px;white-space:nowrap}

.reg-dots{display:flex;gap:6px;flex-wrap:wrap}
.reg-dot{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--muted)}
.reg-dot i{width:8px;height:8px;border-radius:50%;display:inline-block}
.reg-dot.green i{background:var(--green)} .reg-dot.amber i{background:var(--amber)}
.reg-dot.red i{background:var(--red)} .reg-dot.grey i{background:var(--grey)} .reg-dot.blue i{background:var(--blue)}

.reg-clientbody{border-top:1px solid var(--line);overflow-x:auto}
.reg-clientbody .reg-table{min-width:680px}

/* ---- detail modal record grid ---- */
.reg-detail .mhead h3{flex:1;font-size:18px}
.reg-recgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin-bottom:6px}
@media(max-width:640px){.reg-recgrid{grid-template-columns:1fr}}
.reg-recrow{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--ink2);font-size:13px}
.reg-reclabel{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.5px;flex:0 0 auto;align-self:center}
.reg-recval{text-align:right;font-weight:500}

.reg-calblock{margin-top:14px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:6px 14px 12px}
.reg-calhd{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:10px 0 4px;font-weight:700}
.reg-calblock .reg-recrow{border-bottom-color:var(--line)}
.reg-calblock .reg-recrow:last-child{border-bottom:none}

.reg-detailfoot{flex-wrap:wrap}

/* export button accent */
#reg-export{white-space:nowrap}
#reg-export:hover{border-color:var(--green);color:#fff}