/* CODSHIPX AI CRM — R121 LIVE BUSINESS DASHBOARD */

.cx-r121-kpi-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}

.cx-r121-kpi{
  appearance:none;
  width:100%;
  height:238px;
  min-width:0;
  border:1px solid #e5e9ef;
  border-radius:18px;
  background:#fff;
  padding:20px;
  text-align:left;
  display:flex;
  flex-direction:column;
  cursor:pointer;
  box-shadow:0 8px 28px rgba(15,23,42,.045);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.cx-r121-kpi:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(15,23,42,.075);
  border-color:#d7dde6;
}

.cx-r121-kpi:focus-visible{
  outline:3px solid rgba(132,204,22,.28);
  outline-offset:2px;
}

.cx-r121-kpi-head{
  display:flex;
  align-items:center;
  gap:10px;
}

.cx-r121-kpi-head small{
  font-size:10px;
  line-height:1;
  font-weight:800;
  letter-spacing:.12em;
  color:#6b7280;
}

.cx-r121-kpi-symbol{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#f3f5f7;
  color:#111827;
  font-size:17px;
  font-weight:800;
}

.cx-r121-kpi-value{
  display:block;
  margin-top:18px;
  font-size:clamp(25px,2vw,36px);
  line-height:1;
  font-weight:800;
  letter-spacing:-.04em;
  color:#111827;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.cx-r121-kpi-value.health-value{
  font-size:27px;
}

.cx-r121-kpi>p{
  margin:10px 0 14px;
  min-height:34px;
  font-size:12px;
  line-height:1.45;
  color:#6b7280;
}

.cx-r121-kpi-foot{
  margin-top:auto;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.cx-r121-kpi-foot span{
  min-width:0;
  padding:9px 10px;
  border-radius:11px;
  background:#f7f8fa;
}

.cx-r121-kpi-foot small,
.cx-r121-kpi-foot b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.cx-r121-kpi-foot small{
  margin-bottom:3px;
  font-size:9px;
  font-weight:700;
  color:#858c97;
}

.cx-r121-kpi-foot b{
  font-size:11px;
  color:#252a32;
}

.cx-r121-kpi.income{
  border-top:3px solid #84cc16;
}

.cx-r121-kpi.sold{
  border-top:3px solid #2563eb;
}

.cx-r121-kpi.returns{
  border-top:3px solid #f59e0b;
}

.cx-r121-kpi.customers{
  border-top:3px solid #8b5cf6;
}

.cx-r121-kpi.health.healthy{
  border-top:3px solid #22c55e;
}

.cx-r121-kpi.health.attention{
  border-top:3px solid #f59e0b;
}

.cx-r121-kpi.health.critical{
  border-top:3px solid #ef4444;
}


/* Exact visual equality for the four large owner panels. */

.cx-dv2-main,
.cx-dv2-lower{
  align-items:stretch !important;
}

.cx-dv2-main>.cx-dv2-card,
.cx-dv2-lower>.cx-dv2-card{
  height:420px !important;
  min-height:420px !important;
  max-height:420px !important;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

.cx-dv2-attention .cx-dv2-priority-list,
.cx-dv2-pipeline .cx-dv2-pipeline-list{
  min-height:0;
  overflow:auto;
}

.cx-dv2-momentum .cx-dv2-momentum-grid{
  flex:1;
  align-content:start;
}


/* Orders & fulfilment replaces Quick actions. */

.cx-r121-orders{
  position:relative;
}

.cx-r121-order-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:18px;
}

.cx-r121-order-grid>div{
  min-width:0;
  padding:15px 16px;
  border:1px solid #edf0f3;
  border-radius:14px;
  background:#fafbfc;
}

.cx-r121-order-grid>div.wide{
  grid-column:1/-1;
}

.cx-r121-order-grid>div.attention{
  background:#fff9ed;
  border-color:#f5dfae;
}

.cx-r121-order-grid small,
.cx-r121-order-grid strong,
.cx-r121-order-grid span{
  display:block;
}

.cx-r121-order-grid small{
  margin-bottom:6px;
  color:#757d88;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.cx-r121-order-grid strong{
  color:#161b22;
  font-size:23px;
  line-height:1.05;
  letter-spacing:-.03em;
}

.cx-r121-order-grid span{
  margin-top:5px;
  color:#8a919c;
  font-size:10px;
  line-height:1.35;
}

.cx-r121-orders-open{
  appearance:none;
  border:0;
  margin-top:auto;
  width:100%;
  min-height:44px;
  border-radius:13px;
  background:#15191f;
  color:#fff;
  font-size:12px;
  font-weight:750;
  cursor:pointer;
}

.cx-r121-orders-open:hover{
  opacity:.92;
}


@media (max-width:1380px){
  .cx-r121-kpi-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:980px){
  .cx-r121-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .cx-dv2-main>.cx-dv2-card,
  .cx-dv2-lower>.cx-dv2-card{
    height:auto !important;
    min-height:360px !important;
    max-height:none !important;
  }
}

@media (max-width:620px){
  .cx-r121-kpi-grid{
    grid-template-columns:1fr;
  }

  .cx-r121-kpi{
    height:auto;
    min-height:214px;
  }

  .cx-r121-order-grid{
    grid-template-columns:1fr;
  }

  .cx-r121-order-grid>div.wide{
    grid-column:auto;
  }
}

/* ==========================================================
   CODSHIPX AI CRM — R122 DASHBOARD FLOW / OVERFLOW FIX
   Large dashboard cards size to their real content.
   No content clipping.
   ========================================================== */

.cx-dv2-main,
.cx-dv2-lower{
  align-items:stretch !important;
}

/*
 * Remove the R121 fixed 420px clipping rule.
 * Grid row height is now determined by the tallest card,
 * so each pair stays visually equal without cutting content.
 */
.cx-dv2-main > .cx-dv2-card,
.cx-dv2-lower > .cx-dv2-card{
  height:auto !important;
  min-height:460px !important;
  max-height:none !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}

.cx-dv2-main,
.cx-dv2-lower{
  grid-auto-rows:minmax(460px,auto) !important;
}

/* Keep Orders & fulfilment compact enough to stay balanced. */
.cx-r121-orders{
  height:auto !important;
  min-height:460px !important;
  max-height:none !important;
  overflow:visible !important;
}

.cx-r121-orders .cx-r121-order-grid{
  gap:8px !important;
  margin-top:12px !important;
}

.cx-r121-orders .cx-r121-order-grid > div{
  padding:12px 14px !important;
}

.cx-r121-orders .cx-r121-order-grid strong{
  font-size:21px !important;
}

.cx-r121-orders-open{
  margin-top:14px !important;
  flex:0 0 44px !important;
}

/*
 * Floating Codi / Live Agents controls must not cover the final
 * dashboard card content at the bottom of the page.
 */
.command-page.cx-dashboard-v2{
  padding-bottom:100px !important;
}

@media (max-width:980px){
  .cx-dv2-main,
  .cx-dv2-lower{
    grid-auto-rows:auto !important;
  }

  .cx-dv2-main > .cx-dv2-card,
  .cx-dv2-lower > .cx-dv2-card,
  .cx-r121-orders{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
}

/* CODSHIPX_AI_CRM_R122_DASHBOARD_NO_CLIP */

/* ==========================================================
   CODSHIPX AI CRM — R123 REAL BUSINESS DASHBOARD
   ========================================================== */

.cx-r123-signal-list{
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
  margin-top:16px;
}

.cx-r123-signal-list button{
  appearance:none;
  border:1px solid #e8ebef;
  background:#fafbfc;
  border-radius:14px;
  padding:12px 14px;
  display:grid;
  grid-template-columns:minmax(120px,1fr) auto;
  grid-template-areas:
    "label value"
    "copy action";
  gap:4px 12px;
  text-align:left;
  cursor:pointer;
}

.cx-r123-signal-list button.warn{
  border-color:#f2d7a1;
  background:#fff9ee;
}

.cx-r123-signal-list button.soft-warn{
  border-color:#eee2cb;
  background:#fcfaf5;
}

.cx-r123-signal-list button.clear{
  background:#f8faf9;
}

.cx-r123-signal-list span{
  grid-area:label;
  font-size:11px;
  font-weight:800;
  color:#606977;
}

.cx-r123-signal-list strong{
  grid-area:value;
  font-size:18px;
  color:#171b22;
}

.cx-r123-signal-list small{
  grid-area:copy;
  color:#89919d;
  font-size:10px;
}

.cx-r123-signal-list b{
  grid-area:action;
  color:#56616f;
  font-size:10px;
}


.cx-r123-pipeline-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:11px;
  margin-top:18px;
}

.cx-r123-pipeline-grid>div{
  min-height:126px;
  padding:16px;
  border:1px solid #e9edf2;
  border-radius:15px;
  background:#fafbfc;
  display:flex;
  flex-direction:column;
}

.cx-r123-pipeline-grid small{
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:#7b8491;
}

.cx-r123-pipeline-grid strong{
  margin-top:9px;
  font-size:27px;
  line-height:1;
  color:#171b22;
}

.cx-r123-pipeline-grid span{
  margin-top:auto;
  padding-top:9px;
  font-size:11px;
  color:#7f8895;
}

.cx-r123-pipeline-grid .active{
  border-top:3px solid #2563eb;
}

.cx-r123-pipeline-grid .fulfilled{
  border-top:3px solid #22c55e;
}

.cx-r123-pipeline-grid .cancelled{
  border-top:3px solid #f59e0b;
}

.cx-r123-pipeline-grid .returned{
  border-top:3px solid #ef4444;
}

.cx-r123-text-action{
  appearance:none;
  border:0;
  background:transparent;
  color:#586271;
  font-size:11px;
  font-weight:750;
  cursor:pointer;
}


.cx-r123-momentum-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:17px;
}

.cx-r123-momentum-grid>div{
  min-height:88px;
  padding:14px 15px;
  border:1px solid #e9edf1;
  border-radius:14px;
  background:#fafbfc;
}

.cx-r123-momentum-grid small,
.cx-r123-momentum-grid strong{
  display:block;
}

.cx-r123-momentum-grid small{
  margin-bottom:7px;
  color:#7d8694;
  font-size:10px;
  font-weight:750;
}

.cx-r123-momentum-grid strong{
  color:#171b22;
  font-size:20px;
  letter-spacing:-.025em;
}


.cx-r123-order-grid{
  margin-top:12px !important;
}

.cx-r123-order-grid>div{
  min-height:91px;
}

.cx-r123-orders .cx-r121-orders-open{
  margin-top:12px !important;
}


/*
 * R122 flow lock remains authoritative:
 * dashboard cards grow with content, no clipping.
 */
.cx-dv2-main>.cx-dv2-card,
.cx-dv2-lower>.cx-dv2-card{
  overflow:visible !important;
  max-height:none !important;
}

@media(max-width:720px){
  .cx-r123-pipeline-grid,
  .cx-r123-momentum-grid{
    grid-template-columns:1fr;
  }
}

/* CODSHIPX_AI_CRM_R123_REAL_BUSINESS_DASHBOARD */

/* ==========================================================
   CODSHIPX AI CRM — R124-R4 FINAL DASHBOARD BALANCE
   ========================================================== */

/* Five cards: equal size, no clipped money or status values. */
.cx-r121-kpi-grid{
  gap:14px !important;
  align-items:stretch !important;
}

.cx-r121-kpi{
  min-width:0 !important;
  height:300px !important;
  min-height:300px !important;
  max-height:300px !important;
  padding:18px !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}

.cx-r121-kpi-head{
  min-height:36px !important;
}

.cx-r121-kpi-head small{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  line-height:1.2 !important;
}

.cx-r121-kpi-value{
  margin-top:13px !important;
  font-size:33px !important;
  line-height:1.05 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  font-variant-numeric:tabular-nums;
}

.cx-r121-kpi-value.health-value{
  font-size:24px !important;
  line-height:1.12 !important;
  min-height:54px !important;
  display:flex !important;
  align-items:center !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

.cx-r121-kpi>p{
  margin:9px 0 10px !important;
  min-height:50px !important;
  font-size:11.5px !important;
  line-height:1.4 !important;
}

/*
 * Full width metric rows.
 * Avoid "Pending order..." and "LKR 925,2..."
 */
.cx-r121-kpi-foot{
  margin-top:auto !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:6px !important;
}

.cx-r121-kpi-foot span{
  width:100% !important;
  min-width:0 !important;
  min-height:32px !important;
  padding:7px 9px !important;
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:8px !important;
  align-items:center !important;
}

.cx-r121-kpi-foot small{
  margin:0 !important;
  min-width:0 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  line-height:1.15 !important;
  font-size:9px !important;
}

.cx-r121-kpi-foot b{
  min-width:max-content !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  font-size:10.5px !important;
  line-height:1.15 !important;
  font-variant-numeric:tabular-nums;
}


/* Main dashboard cards align as a clean 2-column row. */
.cx-dv2-main{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}

.cx-dv2-main>.cx-r123-attention,
.cx-dv2-main>.cx-r123-pipeline{
  width:100% !important;
  min-width:0 !important;
  height:auto !important;
  min-height:455px !important;
  max-height:none !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}


/* One real Sales pipeline card only. */
.cx-r123-pipeline{
  padding:22px !important;
}

.cx-r123-pipeline-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  margin-top:18px !important;
}

.cx-r123-pipeline-grid>div{
  min-width:0 !important;
  min-height:130px !important;
  padding:16px !important;
  box-sizing:border-box !important;
}

.cx-r123-pipeline-grid strong{
  font-size:28px !important;
  line-height:1 !important;
  overflow:visible !important;
  text-overflow:clip !important;
  font-variant-numeric:tabular-nums;
}

.cx-r123-pipeline-grid span{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere;
}


/* Needs-attention values never truncate. */
.cx-r123-signal-list button{
  min-width:0 !important;
}

.cx-r123-signal-list strong,
.cx-r123-signal-list small,
.cx-r123-signal-list b{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

.cx-r123-signal-list strong{
  font-variant-numeric:tabular-nums;
}


/* Lower cards grow naturally; no clipping. */
.cx-dv2-lower{
  align-items:stretch !important;
  gap:18px !important;
}

.cx-dv2-lower>.cx-dv2-card{
  height:auto !important;
  min-height:455px !important;
  max-height:none !important;
  overflow:visible !important;
  align-self:stretch !important;
}


/* Order money/values always fully readable. */
.cx-r123-order-grid strong,
.cx-r123-momentum-grid strong{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere;
  font-variant-numeric:tabular-nums;
}


/* Responsive: stop squeezing before values become clipped. */
@media(max-width:1380px){
  .cx-r121-kpi{
    height:auto !important;
    min-height:278px !important;
    max-height:none !important;
  }
}

@media(max-width:980px){
  .cx-dv2-main{
    grid-template-columns:1fr !important;
  }

  .cx-r123-pipeline-grid{
    grid-template-columns:1fr !important;
  }

  .cx-r121-kpi{
    min-height:250px !important;
  }
}

/* CODSHIPX_AI_CRM_R124_R5_UI_BALANCE */