/* ================== پیمانکاریِ ساختمان (۴۰٫۲۲) ==================
   سبک‌های ماژولِ construction.js — روی پوستهٔ styles.css/theme.css می‌نشیند. */
.cn-bar{position:relative;height:20px;border-radius:99px;background:color-mix(in srgb,var(--line) 70%,transparent);overflow:hidden;min-width:70px}
.cn-bar i{position:absolute;inset-inline-start:0;top:0;bottom:0;border-radius:99px;transition:width .3s}
/* ۴۰٫۲۲: برچسب با هالهٔ زمینه — روی هر رنگِ نوار خوانا (mix-blend-mode رنگِ نارنجی روی آبی می‌ساخت) */
.cn-bar b{position:absolute;inset:0;font-size:13.5px;line-height:20px;text-align:center;color:var(--ink);font-weight:700;
  text-shadow:0 0 3px var(--card),0 0 3px var(--card),0 0 2px var(--card)}
.cn-bar.sm{height:18px}.cn-bar.sm b{font-size:13.5px;line-height:18px}
.cn-late{color:var(--bad);font-weight:700}
.cn-alerts ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.cn-alert{display:flex;gap:10px;align-items:center;width:100%;text-align:start;border:0;background:none;padding:7px 8px;border-radius:9px;cursor:pointer;color:var(--ink);font:inherit;font-size:13.5px}
.cn-alert:hover{background:var(--brand-soft)}
.cn-alert i{display:inline-flex;color:var(--warn)}.cn-alerts li.late .cn-alert i,.cn-alerts li.late .cn-alert small{color:var(--bad)}
.cn-alert span{flex:1}.cn-alert small{color:var(--muted);white-space:nowrap}
.cn-head{display:grid;gap:12px}
.cn-head-t{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.cn-head-t h2{margin:0;font-size:18px}
.cn-head-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:6px 18px}
.cn-head-g>div,.cn-head-p>div{display:flex;flex-direction:column;gap:2px;font-size:13.5px}
.cn-head .k,.cn-kv td.k{color:var(--muted);font-size:12.5px}
.cn-head-p{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cn-kv td.k{width:170px;white-space:nowrap}
.cn-tabs{flex-wrap:wrap}
.cn-quick{display:flex;flex-wrap:wrap;gap:8px}
.cn-tree td.depth-1{padding-inline-start:28px}.cn-tree td.depth-2{padding-inline-start:48px}.cn-tree td.depth-3{padding-inline-start:68px}.cn-tree td.depth-4{padding-inline-start:88px}
.cn-tree tr.cn-parent td{background:color-mix(in srgb,var(--brand-soft) 35%,transparent)}
.cn-gantt{display:grid;gap:4px;font-size:12.5px}
.cn-g-row{display:grid;grid-template-columns:150px 1fr 48px;gap:8px;align-items:center}
.cn-g-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-g-name.depth-1{padding-inline-start:12px}.cn-g-name.depth-2{padding-inline-start:24px}.cn-g-name.depth-3,.cn-g-name.depth-4{padding-inline-start:36px}
.cn-g-track{position:relative;height:18px;background:color-mix(in srgb,var(--line) 50%,transparent);border-radius:6px;overflow:hidden}
.cn-g-track span{position:absolute;height:7px;border-radius:4px}
.cn-g-plan{top:2px;background:var(--muted);opacity:.55}
.cn-g-act{top:10px;background:var(--brand)}.cn-g-act.late{background:var(--bad)}
.cn-g-today{position:absolute;top:0;bottom:0;width:2px;background:var(--warn)}
.cn-g-pct{text-align:center;color:var(--muted)}
.cn-g-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:10px;font-size:12.5px;color:var(--muted)}
.cn-g-legend i{display:inline-block;width:18px;height:7px;border-radius:4px;vertical-align:middle;margin-inline-end:4px;position:static}
.cn-g-legend i.cn-g-today{width:2px;height:14px}
.cn-defects{display:grid;gap:4px}
.cn-defects label{display:flex;align-items:center;gap:8px;margin:0;font-weight:400;padding:4px 0;border-bottom:1px solid var(--line)}
.cn-defects label input[type=checkbox]{width:auto}.cn-defects label span{flex:1}.cn-defects label span.done{text-decoration:line-through;color:var(--muted)}
.cn-file{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:2px 0}
.cn-url{word-break:break-all;background:color-mix(in srgb,var(--line) 50%,transparent);padding:10px 12px;border-radius:9px;font-size:13.5px}
.cn-check{display:flex;align-items:center;gap:8px;margin:8px 0;font-weight:400}.cn-check input{width:auto}
.cn-est-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cn-est-head{display:grid;grid-template-columns:2fr 1fr 2fr;gap:12px}.cn-est-head .ff{margin:0}
.cn-est-wrap{overflow:auto}
.cn-est input,.cn-est select{min-width:0;padding:5px 7px;font-size:13.5px}
.cn-est input.cn-c{width:90px}.cn-est input.cn-d{width:100%;min-width:220px}.cn-est input.cn-n{width:110px;text-align:end}
.cn-est td{padding:4px 5px;vertical-align:middle}.cn-est td.num{white-space:nowrap;font-variant-numeric:tabular-nums}
.cn-est tr.cn-sub td{background:color-mix(in srgb,var(--brand-soft) 45%,transparent);font-size:13px}
.cn-est-tot .totbox{max-width:420px;margin-inline-start:auto}
.cn-est-tot .r{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);gap:12px}
.cn-est-tot .r.grand{border-bottom:0;font-size:15px}
.cn-est-tot input.cn-pct{width:64px;display:inline-block;padding:3px 6px;text-align:center;margin:0 4px}
#cn-rep table td.num,.panel table td.num{text-align:end;white-space:nowrap;font-variant-numeric:tabular-nums}
#cn-rep tfoot tr.tot td{border-top:2px solid var(--line);background:color-mix(in srgb,var(--brand-soft) 40%,transparent)}
@media (max-width:760px){
  .cn-head-p{grid-template-columns:1fr}
  .cn-est-head{grid-template-columns:1fr}
  .cn-g-row{grid-template-columns:100px 1fr 44px}
  .cn-kv td.k{width:120px}
}

/* ۴۰٫۲۵: طرف‌حساب‌های پیمانکاری، عواملِ پروژه و راهنمای شروع */
.cn-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.cn-tag{font-size:13.5px}
.cn-tel{white-space:nowrap;text-decoration:none}
.cn-pt-new{flex-wrap:wrap;gap:6px}
.cn-pt-tabs{flex-wrap:wrap}
.cn-pp h3 .badge{vertical-align:middle}
.cn-pp tr.cn-pp-off td{opacity:.7}
.cn-guide-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cn-guide-h h3{margin:0}
.cn-guide-l{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;counter-reset:none}
.cn-guide-l a{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;color:var(--ink);text-decoration:none;height:100%;box-sizing:border-box}
.cn-guide-l a:hover{background:var(--brand-soft)}
.cn-guide-l .n{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:color-mix(in srgb,var(--line) 70%,transparent);font-weight:700;font-size:13.5px}
.cn-guide-l .t{font-weight:700;font-size:13.5px}
.cn-guide-l small{color:var(--muted);font-size:13.5px}
.cn-guide-l li.done .n{background:var(--ok);color:#fff}
.cn-guide-l li.done small{color:var(--ok)}
@media (max-width:640px){
  .cn-guide-l{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .cn-pt-new .btn{flex:1 1 auto}
}
