/* ============================================================
   assets/tm-tags.css — Time & Materials (extra-work) tag manager
   ============================================================ */

/* ── List stats ── */
.tm-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:12px 0 16px; }
.tm-stat { background:var(--surface,#fff); border:1px solid var(--line,#E5E7EB); border-radius:12px; padding:12px 14px; }
.tm-stat-h { font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint,#9AA5B1); font-weight:700; display:flex; align-items:center; gap:6px; }
.tm-stat-h i { font-size:13px; }
.tm-stat-v { font-size:22px; font-weight:700; margin-top:6px; color:var(--ink,#1F2933); }
.tm-stat-s { font-size:11px; color:var(--ink-soft,#616E7C); margin-top:2px; }
@media (max-width:820px){ .tm-stats { grid-template-columns:repeat(2,1fr); } }

/* ── List table ── */
.tm-tablewrap { overflow-x:auto; border:1px solid var(--line,#E5E7EB); border-radius:12px; background:var(--surface,#fff); }
.tm-table { width:100%; border-collapse:collapse; font-size:13px; }
.tm-table thead th { text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint,#9AA5B1); font-weight:700; padding:10px 12px; border-bottom:1px solid var(--line,#E5E7EB); white-space:nowrap; }
.tm-table thead th.r { text-align:right; } .tm-table thead th.c { text-align:center; }
.tm-table td { padding:11px 12px; border-bottom:1px solid var(--line-soft,#F1F3F5); vertical-align:middle; }
.tm-table td.r { text-align:right; } .tm-table td.c { text-align:center; }
.tm-table tbody tr:last-child td { border-bottom:none; }
.tm-row { cursor:pointer; transition:background .1s; }
.tm-row:hover { background:var(--hover,#F8FAFC); }
.tm-sub { font-size:11px; color:var(--ink-soft,#616E7C); margin-top:2px; }
.tm-none { text-align:center; color:var(--ink-faint,#9AA5B1); padding:22px 12px; font-size:12px; }
.tm-rowact { white-space:nowrap; }
.tm-pill { display:inline-block; font-size:10px; font-weight:700; padding:2px 9px; border-radius:999px; text-transform:uppercase; letter-spacing:.04em; }

/* ── Editor ── */
.tm-editor { display:flex; flex-direction:column; gap:12px; }
.tm-editor .pt-card { padding:14px 16px; }
.tm-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.tm-grid3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }
@media (max-width:680px){ .tm-grid2, .tm-grid3 { grid-template-columns:1fr; } }
.tm-fld { display:flex; flex-direction:column; gap:4px; margin-bottom:10px; }
.tm-fld label { font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint,#9AA5B1); font-weight:700; }
.tm-fld input, .tm-fld select, .tm-fld textarea { width:100%; padding:8px 10px; border:1px solid var(--line,#E5E7EB); border-radius:8px; font-size:13px; font-family:inherit; background:var(--surface,#fff); color:var(--ink,#1F2933); }
.tm-fld input:disabled, .tm-fld select:disabled, .tm-fld textarea:disabled { background:var(--hover,#F8FAFC); color:var(--ink-soft,#616E7C); }
.tm-fld textarea { resize:vertical; }

.tm-sec-h { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; font-size:13px; font-weight:700; color:var(--ink,#1F2933); }
.tm-sec-h i { color:var(--accent,#4F46E5); margin-right:4px; }

/* ── Line tables ── */
.tm-lines-wrap { overflow-x:auto; }
.tm-lines { width:100%; border-collapse:collapse; font-size:12px; }
.tm-lines thead th { text-align:left; font-size:9px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint,#9AA5B1); font-weight:700; padding:4px 6px; white-space:nowrap; }
.tm-lines td { padding:3px 6px; vertical-align:middle; }
.tm-lines input { padding:6px 8px; border:1px solid var(--line,#E5E7EB); border-radius:6px; font-size:12px; font-family:inherit; background:var(--surface,#fff); color:var(--ink,#1F2933); }
.tm-lines input:disabled { background:var(--hover,#F8FAFC); }
.tm-lines .tm-none { text-align:center; }

/* ── Totals ── */
.tm-totals { }
.tm-tot-row { display:flex; align-items:center; gap:12px; padding:7px 0; border-bottom:1px solid var(--line-soft,#F1F3F5); font-size:13px; }
.tm-tot-row > span:first-child { flex:0 0 90px; color:var(--ink-soft,#616E7C); font-weight:600; }
.tm-tot-mk { flex:1; font-size:12px; color:var(--ink-faint,#9AA5B1); }
.tm-tot-mk input { padding:5px 7px; border:1px solid var(--line,#E5E7EB); border-radius:6px; font-size:12px; margin-right:4px; }
.tm-tot-row b { flex:0 0 auto; font-variant-numeric:tabular-nums; }
.tm-tot-grand { display:flex; align-items:center; justify-content:space-between; padding:12px 0 2px; font-size:16px; font-weight:700; }
.tm-tot-grand b { color:var(--accent,#4F46E5); font-variant-numeric:tabular-nums; }

/* ── Signatures ── */
.tm-sigs { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:680px){ .tm-sigs { grid-template-columns:1fr; } }
.tm-sig { border:1px dashed var(--line,#E5E7EB); border-radius:10px; padding:12px; text-align:center; }
.tm-sig-role { font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint,#9AA5B1); font-weight:700; margin-bottom:8px; }
.tm-sig-img { max-height:64px; max-width:100%; }
.tm-sig-empty { height:64px; display:flex; align-items:center; justify-content:center; color:var(--ink-faint,#C1C7CD); font-size:12px; font-style:italic; }
.tm-sig-meta { font-size:11px; color:var(--ink-soft,#616E7C); margin:8px 0; min-height:14px; }
.tm-sig-dt { color:var(--ink-faint,#9AA5B1); }

/* ── Sign pad modal ── */
.tm-sigpad-wrap { position:relative; margin:6px 0; }
.tm-sigpad { width:100%; height:150px; border:1px solid var(--line,#E5E7EB); border-radius:8px; background:#fff; touch-action:none; cursor:crosshair; }
.tm-sigclear { position:absolute; top:6px; right:6px; font-size:11px; background:rgba(255,255,255,.9); border:1px solid var(--line,#E5E7EB); border-radius:6px; padding:3px 8px; cursor:pointer; color:var(--ink-soft,#616E7C); }
.tm-sig-note { font-size:11px; color:var(--ink-faint,#9AA5B1); text-align:center; }

/* ── Actions ── */
.tm-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:4px 0 8px; }
.btn-icon { background:none; border:none; cursor:pointer; color:var(--ink-soft,#616E7C); padding:4px 6px; border-radius:6px; font-size:15px; display:inline-flex; align-items:center; }
.btn-icon:hover { background:var(--hover,#F1F3F5); color:var(--ink,#1F2933); }