/* ===================================================
   SPRINT 14 — DAILY OPS TRACKER
   =================================================== */

/* ── KPIs ── */
.s14-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:.55rem;margin:1rem 0 1.25rem}
.s14-kpi{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:12px;padding:.8rem .6rem;text-align:center;position:relative;overflow:hidden;transition:transform .2s}
.s14-kpi:hover{transform:translateY(-2px)}
.s14-kpi::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;border-radius:0 0 12px 12px}
.s14-kpi-accent::after{background:var(--accent)}.s14-kpi-info::after{background:var(--info)}
.s14-kpi-warning::after{background:var(--warning)}.s14-kpi-success::after{background:var(--success)}
.s14-kpi-purple::after{background:var(--purple)}.s14-kpi-danger::after{background:var(--danger)}
.s14-kpi-icon{font-size:1.2rem;margin-bottom:.2rem}
.s14-kpi-val{font-size:.95rem;font-weight:900;color:var(--text-primary);line-height:1.2}
.s14-kpi-lbl{font-size:.58rem;color:var(--text-muted);font-weight:600;margin-top:.12rem}

/* ── Pipeline ── */
.s14-pipeline{display:flex;gap:.35rem;overflow-x:auto;padding:.25rem 0 .75rem;scrollbar-width:none;margin-bottom:.85rem}
.s14-pipeline::-webkit-scrollbar{display:none}
.s14-pipe-btn{display:inline-flex;flex-direction:column;align-items:center;gap:.18rem;padding:.55rem .7rem;border-radius:10px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);cursor:pointer;white-space:nowrap;min-width:72px;transition:all .18s;font-family:inherit}
.s14-pipe-btn:hover{background:rgba(255,255,255,0.07);border-color:rgba(255,255,255,0.15)}
.s14-pipe-active{background:rgba(255,255,255,0.06)!important}
.s14-pipe-icon{font-size:1rem}
.s14-pipe-lbl{font-size:.58rem;color:var(--text-secondary);font-weight:600}
.s14-pipe-cnt{font-size:.65rem;font-weight:900;border-radius:20px;padding:.05rem .4rem;min-width:16px;text-align:center}

/* ── Toolbar ── */
.s14-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.85rem;align-items:center}
.s14-search{flex:1;min-width:140px;padding:.54rem .8rem;border-radius:9px;border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.04);color:var(--text-primary);font-size:.78rem;font-family:inherit}
.s14-search:focus{outline:none;border-color:rgba(200,169,110,.4)}
.s14-date-f{padding:.5rem .7rem;border-radius:9px;border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.04);color:var(--text-secondary);font-size:.72rem;font-family:inherit;cursor:pointer;color-scheme:dark}
.s14-add-btn{display:inline-flex;align-items:center;gap:.35rem;background:var(--accent);color:#000;border:none;border-radius:9px;padding:.54rem 1rem;font-size:.78rem;font-weight:800;cursor:pointer;white-space:nowrap;font-family:inherit;transition:opacity .18s}
.s14-add-btn:hover{opacity:.88}

/* ── Cards ── */
.s14-list{display:flex;flex-direction:column;gap:.55rem}
.s14-card{display:flex;border-radius:13px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.03);overflow:hidden;cursor:pointer;transition:all .18s}
.s14-card:hover{border-color:rgba(255,255,255,0.15);background:rgba(255,255,255,0.055);transform:translateX(-2px);box-shadow:0 4px 20px rgba(0,0,0,.2)}
.s14-card-bar{width:4px;flex-shrink:0}
.s14-card-inner{flex:1;padding:.75rem .95rem;display:flex;flex-direction:column;gap:.4rem;min-width:0}
.s14-card-top{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.s14-card-num{font-size:.68rem;font-weight:900;color:var(--text-muted);font-family:monospace;letter-spacing:.05em}
.s14-stage-pill{font-size:.6rem;font-weight:700;padding:.14rem .5rem;border-radius:20px;white-space:nowrap}
.s14-today-dot{font-size:.58rem;background:rgba(16,185,129,.15);color:var(--success);border:1px solid rgba(16,185,129,.3);border-radius:20px;padding:.1rem .4rem;font-weight:700}
.s14-card-cust{display:flex;align-items:center;gap:.6rem}
.s14-avatar{width:32px;height:32px;border-radius:50%;font-weight:800;font-size:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.s14-cust-info{flex:1;min-width:0}
.s14-cust-name{font-size:.84rem;font-weight:700;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s14-cust-phone{font-size:.65rem;color:var(--text-muted);margin-top:.05rem}
.s14-card-total{font-size:.9rem;font-weight:900;color:var(--accent);white-space:nowrap;margin-right:auto}
.s14-chips{display:flex;flex-wrap:wrap;gap:.3rem}
.s14-chip{font-size:.6rem;padding:.1rem .45rem;border-radius:20px;background:rgba(255,255,255,0.05);color:var(--text-muted);border:1px solid rgba(255,255,255,0.07);display:inline-flex;align-items:center;gap:.25rem;white-space:nowrap}
.s14-card-actions{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;padding-top:.1rem}
.s14-next-btn{display:inline-flex;align-items:center;gap:.3rem;background:rgba(255,255,255,0.05);border-radius:8px;color:var(--text-secondary);font-size:.68rem;font-weight:700;padding:.28rem .65rem;cursor:pointer;font-family:inherit;transition:all .15s;white-space:nowrap}
.s14-next-btn:hover{background:rgba(255,255,255,0.1);color:var(--text-primary)}
.s14-wa-btn{width:28px;height:28px;border-radius:7px;background:rgba(37,211,102,.1);color:#25D366;border:1px solid rgba(37,211,102,.25);display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-size:.8rem;transition:all .15s;flex-shrink:0}
.s14-wa-btn:hover{background:rgba(37,211,102,.2)}
.s14-del-btn{width:26px;height:26px;border-radius:7px;background:transparent;border:1px solid rgba(255,255,255,0.07);color:var(--text-muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:.68rem;transition:all .15s;margin-right:auto}
.s14-del-btn:hover{background:rgba(239,68,68,.1);color:var(--danger);border-color:rgba(239,68,68,.3)}

/* ── Empty ── */
.s14-empty{text-align:center;padding:3.5rem 1rem;color:var(--text-muted)}

/* ── Modal ── */
.s14-modal-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(6px);z-index:9999;align-items:flex-start;justify-content:center;padding:1rem;overflow-y:auto}
.s14-modal-ov.show{display:flex}
.s14-modal-box{background:linear-gradient(160deg,var(--bg-secondary,#111827) 0%,var(--bg-primary,#0A0E1A) 100%);border:1px solid rgba(255,255,255,0.1);border-radius:18px;padding:1.5rem;width:100%;max-width:540px;margin:auto;box-shadow:0 25px 60px rgba(0,0,0,.5);animation:s14FadeIn .22s ease}
@keyframes s14FadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.s14-modal-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}
.s14-modal-title{font-size:.92rem;font-weight:800;color:var(--text-primary)}
.s14-modal-x{width:28px;height:28px;border-radius:8px;border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.05);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.78rem;transition:all .15s}
.s14-modal-x:hover{background:rgba(239,68,68,.12);color:var(--danger)}
.s14-2col{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}
.s14-section-label{font-size:.7rem;font-weight:700;color:var(--text-muted);letter-spacing:.05em;text-transform:uppercase;margin:.9rem 0 .5rem;padding-bottom:.35rem;border-bottom:1px solid rgba(255,255,255,0.06)}

/* ── Timeline ── */
.s14-tl-hdr{font-size:.72rem;font-weight:700;color:var(--text-muted);margin-bottom:.6rem;display:flex;align-items:center;gap:.35rem}
.s14-tl-row{display:grid;grid-template-columns:28px 1fr;gap:0 .5rem;align-items:flex-start}
.s14-tl-col{display:flex;flex-direction:column;align-items:center}
.s14-tl-dot{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;flex-shrink:0}
.s14-tl-line{width:2px;background:rgba(255,255,255,0.07);flex:1;min-height:18px;margin:2px 0}
.s14-tl-info{padding:.1rem 0 .75rem}
.s14-tl-stage{font-size:.75rem;font-weight:700}
.s14-tl-ts{font-size:.62rem;color:var(--text-muted);margin-top:.1rem}

/* ── Responsive ── */
@media(max-width:640px){
  .s14-kpis{grid-template-columns:repeat(3,1fr)}
  .s14-kpi-val{font-size:.82rem}
  .s14-2col{grid-template-columns:1fr}
}
@media(max-width:380px){
  .s14-kpis{grid-template-columns:repeat(2,1fr)}
}