/* ============================================================
   clients/assets/client.css — MAC Client Project Portal
   ============================================================ */
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Work Sans',sans-serif;background:#F2F0EB;color:#124559;min-height:100vh;}

/* Error page */
.cv-error-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;}
.cv-error-card{background:#fff;border:1px solid #d8d4cc;border-radius:12px;padding:40px 44px;text-align:center;max-width:420px;}
.cv-error-logo{width:44px;height:44px;border-radius:10px;background:#F15A24;color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.cv-error-card h1{font-size:20px;font-weight:700;color:#124559;margin-bottom:8px;}
.cv-error-card p{font-size:13px;color:#7a8fa0;line-height:1.6;}

/* Header */
.cv-header{background:#124559;}
.cv-header-inner{max-width:960px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;}
.cv-brand{display:flex;align-items:center;gap:12px;}
.cv-logo{width:36px;height:36px;border-radius:8px;background:#F15A24;color:#fff;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;}
.cv-eyebrow{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);}
.cv-client-name{color:#fff;font-size:15px;font-weight:600;}
.cv-updated{text-align:right;}
.cv-updated-date{color:rgba(255,255,255,.9);font-size:12px;}
.cv-accent{height:3px;background:linear-gradient(90deg,#54BCAB,#F15A24);}

/* Main */
.cv-main{max-width:960px;margin:0 auto;padding:26px 24px 60px;}
.cv-proj-name{font-size:22px;font-weight:800;letter-spacing:-.4px;color:#124559;}
.cv-proj-sub{font-size:12px;color:#7a8fa0;margin-top:4px;}

/* KPI cards */
.cv-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 22px;}
.cv-kpi{background:#fff;border:1px solid #e2ded6;border-radius:10px;padding:14px 16px;}
.cv-kpi-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#7a8fa0;}
.cv-kpi-value{font-size:22px;font-weight:700;color:#124559;margin-top:4px;}
.cv-kpi-value.teal{color:#0F6E56;}
.cv-kpi-bar{height:5px;background:#ece9e3;border-radius:3px;margin-top:10px;overflow:hidden;}
.cv-kpi-bar-fill{height:100%;background:#1D9E75;border-radius:3px;transition:width .3s;}
.cv-kpi-sub{font-size:11px;color:#993C1D;margin-top:2px;}

/* Tabs */
.cv-tabs{display:flex;gap:4px;border-bottom:1px solid #d8d4cc;margin-bottom:20px;}
.cv-tab{font-family:'Work Sans',sans-serif;padding:10px 18px;font-size:13px;font-weight:500;color:#7a8fa0;background:none;border:none;border-bottom:3px solid transparent;cursor:pointer;transition:all .15s;}
.cv-tab:hover{color:#124559;}
.cv-tab.active{color:#124559;font-weight:700;border-bottom-color:#F15A24;}

.cv-loading{text-align:center;padding:60px 0;color:#7a8fa0;font-size:13px;}

/* Sections + task rows */
.cv-section{margin-bottom:22px;}
.cv-sec-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.cv-sec-pip{width:4px;height:14px;border-radius:2px;background:#54BCAB;flex-shrink:0;}
.cv-sec-title{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#124559;flex:1;}
.cv-sec-badge{font-size:10px;font-weight:600;padding:2px 9px;border-radius:50px;}
.cv-sec-badge.complete{color:#0F6E56;background:#E1F5EE;}
.cv-sec-badge.in-progress{color:#854F0B;background:#FAEEDA;}
.cv-sec-badge.not-started{color:#5F5E5A;background:#F1EFE8;}
.cv-sec-badge.on-hold{color:#993C1D;background:#FAECE7;}
.cv-sec-badge.at-risk{color:#A32D2D;background:#FCEBEB;}

.cv-tasklist{background:#fff;border:1px solid #e2ded6;border-radius:10px;overflow:hidden;}
.cv-task{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid #efece6;font-size:13px;cursor:default;}
.cv-task:last-child{border-bottom:none;}
.cv-task.commentable{cursor:pointer;}
.cv-task.commentable:hover{background:#faf8f4;}
.cv-task-dot{width:15px;height:15px;border-radius:50%;flex-shrink:0;border:2px solid #b4b2a9;}
.cv-task-dot.Completed{border-color:#1D9E75;background:#1D9E75;}
.cv-task-dot.In-Progress{border-color:#BA7517;background:#FAC775;}
.cv-task-dot.On-Hold{border-color:#D85A30;background:#F5C4B3;}
.cv-task-dot.Cancelled{border-color:#A32D2D;background:#F7C1C1;}
.cv-task-name{flex:1;color:#124559;font-weight:500;}
.cv-task-pct{font-size:11px;font-weight:700;color:#854F0B;background:#FAEEDA;padding:2px 9px;border-radius:50px;}
.cv-task-due{font-size:11px;color:#7a8fa0;white-space:nowrap;}
.cv-task-due.done{color:#0F6E56;}
.cv-comment-ind{font-size:11px;color:#7a8fa0;}

/* Timeline view */
.cv-tl{background:#fff;border:1px solid #e2ded6;border-radius:10px;overflow:hidden;}
.cv-tl-row{display:grid;grid-template-columns:220px 1fr;border-bottom:1px solid #efece6;min-height:44px;align-items:center;}
.cv-tl-row:last-child{border-bottom:none;}
.cv-tl-head{background:#f7f5f1;min-height:38px;border-bottom:2px solid #e2ded6;}
.cv-tl-name{padding:8px 14px;font-size:12px;font-weight:500;color:#124559;border-right:1px solid #efece6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cv-tl-sec-row{background:#f7f5f1;}
.cv-tl-sec-row .cv-tl-name{font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;}
.cv-tl-track{position:relative;height:100%;min-height:44px;}
.cv-tl-tick{position:absolute;font-size:9px;color:#7a8fa0;top:12px;white-space:nowrap;}
.cv-tl-bar{position:absolute;top:11px;height:22px;border-radius:6px;overflow:hidden;display:flex;align-items:center;}
.cv-tl-bar span{padding:0 8px;font-size:10px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cv-tl-today{position:absolute;top:0;bottom:0;width:2px;background:#F15A24;opacity:.55;z-index:3;}

/* Calendar view */
.cv-cal{background:#fff;border:1px solid #e2ded6;border-radius:10px;padding:16px;}
.cv-cal .fc .fc-button{background:#124559;border-color:#124559;font-size:12px;padding:5px 12px;text-transform:capitalize;}
.cv-cal .fc .fc-button:hover{background:#0d3345;}
.cv-cal .fc .fc-toolbar-title{font-size:17px;font-weight:700;color:#124559;}

/* Comment drawer */
.cv-drawer-bg{position:fixed;inset:0;background:rgba(18,69,89,.35);z-index:98;display:none;}
.cv-drawer-bg.vis{display:block;}
.cv-drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:95vw;background:#fff;box-shadow:-10px 0 30px rgba(18,69,89,.18);z-index:99;transform:translateX(100%);transition:transform .22s;display:flex;flex-direction:column;}
.cv-drawer.vis{transform:translateX(0);}
.cv-drawer-head{padding:16px 20px;border-bottom:1px solid #e2ded6;display:flex;align-items:center;justify-content:space-between;background:#f7f5f1;}
.cv-drawer-title{font-size:14px;font-weight:700;color:#124559;flex:1;padding-right:10px;}
.cv-drawer-close{background:none;border:none;font-size:15px;color:#7a8fa0;cursor:pointer;padding:4px 8px;border-radius:4px;}
.cv-drawer-close:hover{background:#ece9e3;color:#124559;}
.cv-drawer-body{flex:1;overflow-y:auto;padding:16px 20px;}
.cv-comment{background:#f7f5f1;border:1px solid #e2ded6;border-radius:8px;padding:10px 12px;margin-bottom:10px;}
.cv-comment.mac{background:#eef6f4;border-color:#c9e5df;}
.cv-comment-author{font-size:12px;font-weight:700;color:#124559;}
.cv-comment-time{font-size:10px;color:#7a8fa0;margin-left:6px;}
.cv-comment-body{font-size:12.5px;color:#124559;line-height:1.5;margin-top:4px;white-space:pre-wrap;word-break:break-word;}
.cv-comment-empty{font-size:12px;color:#7a8fa0;font-style:italic;text-align:center;padding:20px 0;}
.cv-composer{border-top:1px solid #e2ded6;padding:14px 20px;background:#faf8f4;}
.cv-composer input,.cv-composer textarea{width:100%;font-family:'Work Sans',sans-serif;font-size:12.5px;border:1px solid #d8d4cc;border-radius:6px;padding:8px 10px;outline:none;background:#fff;color:#124559;}
.cv-composer input:focus,.cv-composer textarea:focus{border-color:#54BCAB;}
.cv-composer textarea{margin-top:8px;resize:vertical;min-height:60px;}
.cv-composer-actions{display:flex;justify-content:flex-end;margin-top:8px;}
.cv-post-btn{font-family:'Work Sans',sans-serif;font-size:12px;font-weight:700;padding:7px 18px;border-radius:50px;border:none;background:#F15A24;color:#fff;cursor:pointer;}
.cv-post-btn:hover{background:#D34E24;}
.cv-post-btn:disabled{background:#b4b2a9;cursor:not-allowed;}

/* Footer */
.cv-foot{margin-top:28px;padding-top:16px;border-top:1px solid #d8d4cc;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#7a8fa0;flex-wrap:wrap;gap:8px;}
.cv-foot-dim{color:#b4b2a9;font-size:10px;}

@media (max-width:680px){
  .cv-kpis{grid-template-columns:1fr;}
  .cv-tl-row{grid-template-columns:130px 1fr;}
}