:root{
  --bg:#10001d;--panel:#170026;--panel2:#210035;--border:#39074e;
  --text:#f8f2ff;--muted:#ad96bc;--cyan:#1ff4e4;--pink:#ff3f97;
  --violet:#8f4bff;--blue:#2fa7ff;--yellow:#ffe44d;--orange:#ff9c43;
  --green:#52ff9d;--red:#ff6078
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 15% 0,rgba(143,75,255,.18),transparent 26%),linear-gradient(180deg,#090011,#150023);color:var(--text);font-family:Segoe UI,Arial,sans-serif}
.dashboard{max-width:1700px;margin:auto;padding:20px}
.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}
.eyebrow{font-size:11px;letter-spacing:.14em;color:var(--cyan);font-weight:800}
h1{margin:5px 0 2px;font-size:31px}.heading p{margin:0;color:var(--muted)}
.connection{display:flex;align-items:center;gap:9px;color:#d7c8e1;font-size:12px}.live-dot{width:9px;height:9px;background:var(--green);border-radius:50%;box-shadow:0 0 12px var(--green)}
.filters{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:12px}
.filters label{background:var(--panel);border:1px solid var(--border);padding:9px;border-radius:8px;color:#c5afcf;font-size:9px;letter-spacing:.1em}
select,button{width:100%;margin-top:6px;border:0;border-radius:6px;padding:9px;background:#29003e;color:#fff;font-weight:700}
button{cursor:pointer;background:linear-gradient(90deg,#7200a8,#bd007f)}
.panel{background:linear-gradient(145deg,#190028,#11001b);border:1px solid var(--border);border-radius:9px;padding:15px;box-shadow:0 12px 28px rgba(0,0,0,.24)}
.panel h2{margin:0 0 5px;font-size:12px;letter-spacing:.13em;color:var(--cyan)}
.panel p{margin:0;color:var(--muted);font-size:10px}
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:12px}
.kpi{text-align:center;min-height:180px}.kpi-wide{grid-column:span 1;min-height:180px}
.ring{width:94px;height:94px;border-radius:50%;margin:5px auto 10px;display:grid;place-items:center;position:relative}
.ring:before{content:"";position:absolute;inset:0;border-radius:50%;padding:8px;background:conic-gradient(var(--cyan) 0 70%,#30143e 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.ring-age:before{background:conic-gradient(var(--yellow),var(--orange),var(--pink) 58%,#30143e 58%)}
.ring-production:before{background:conic-gradient(var(--green),var(--cyan),var(--blue) 81%,#30143e 81%)}
.ring strong{font-size:20px}.kpi h2{font-size:10px}.kpi p{line-height:1.45}
.kpi-wide>strong{display:block;font-size:42px;color:var(--cyan);margin:17px 0 8px}
.metric-line{display:flex;justify-content:space-between;margin-top:20px;font-size:10px;color:#c6b3d1}.progress{height:7px;background:#300647;border-radius:99px;overflow:hidden;margin-top:7px}.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--pink),var(--cyan))}
.charts-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px;margin-bottom:12px}.chart-wide{grid-column:span 6;min-height:300px}.chart-third{grid-column:span 4;min-height:280px}
.chart-area{height:225px;margin-top:14px}.bar-chart{display:grid;gap:14px;padding-top:8px}.bar-row{display:grid;grid-template-columns:110px 1fr 50px;gap:10px;align-items:center}.bar-row span{font-size:10px;color:#bda8c8}.bar-track{height:16px;background:#2c1039;overflow:hidden}.bar-fill{height:100%;background:linear-gradient(90deg,var(--pink),var(--cyan));box-shadow:0 0 12px rgba(31,244,228,.3)}.bar-row b{font-size:10px}
.flow-svg{width:100%;height:100%;display:block}.legend{display:flex;gap:15px;justify-content:center;font-size:9px;color:var(--muted)}.legend i{display:inline-block;width:9px;height:9px;margin-right:5px}
.queue-list{display:grid;gap:8px;margin-top:14px}.queue-item{display:grid;grid-template-columns:1fr auto;gap:12px;background:#230036;padding:10px;border-radius:7px}.queue-item strong{font-size:11px}.queue-item small{display:block;color:var(--muted);margin-top:4px}.queue-age{color:var(--yellow);font-size:11px;font-weight:900}
.table-panel{margin-bottom:15px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:900px;margin-top:10px}th,td{padding:10px 8px;border-bottom:1px solid #341047;text-align:left;font-size:10px}th{color:#bea8c9;letter-spacing:.08em}.badge{display:inline-block;padding:5px 7px;border-radius:12px;font-size:9px;font-weight:800}.badge.wait{background:#49330d;color:#ffe36f}.badge.progress{background:#102f52;color:#65bdff}.badge.client{background:#41205d;color:#c99aff}.badge.done{background:#103d30;color:#69ffc0}
.notice{position:fixed;right:18px;bottom:18px;max-width:420px;padding:12px 15px;border-radius:8px;background:#2d0b3d;border:1px solid #6b1986;color:#fff;font-size:11px;display:none}
code{color:#ff8fc0}
@media(max-width:1250px){.kpis{grid-template-columns:repeat(3,1fr)}.chart-wide{grid-column:span 12}.chart-third{grid-column:span 6}.filters{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.dashboard{padding:11px}.heading{align-items:flex-start;flex-direction:column;gap:10px}.filters{grid-template-columns:1fr 1fr}.kpis{grid-template-columns:1fr 1fr}.chart-third{grid-column:span 12}}


/* Ajustes V2 */
.efficiency-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}
.efficiency-metric{text-align:center}
.efficiency-metric>span{display:block;margin-top:8px;color:#c6b3d1;font-size:10px}
.mini-ring{width:74px;height:74px;margin:auto;border-radius:50%;display:grid;place-items:center;position:relative}
.mini-ring:before{content:"";position:absolute;inset:0;border-radius:50%;padding:7px;
  background:conic-gradient(var(--green),var(--cyan) 86%,#30143e 86%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude}
.mini-ring-reviews:before{background:conic-gradient(var(--pink),var(--violet) 42%,#30143e 42%)}
.mini-ring strong{font-size:17px}
.hidden-progress{display:none}
.designer-photo-chart{margin-top:15px;display:grid;gap:10px}
.designer-load-card{display:grid;grid-template-columns:52px 135px 1fr 54px;align-items:center;gap:12px;background:#220034;border:1px solid #3b0c51;border-radius:9px;padding:9px 11px}
.designer-photo{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--cyan);background:#310744}
.designer-photo-fallback{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--cyan);background:linear-gradient(135deg,var(--violet),var(--pink));font-weight:900;font-size:14px}
.designer-name strong{display:block;font-size:11px}.designer-name small{color:var(--muted);font-size:9px}
.designer-load-track{height:17px;background:#30113d;overflow:hidden;border-radius:2px}
.designer-load-fill{height:100%;background:linear-gradient(90deg,var(--pink),var(--cyan));box-shadow:0 0 12px rgba(31,244,228,.25)}
.designer-count{text-align:right;font-size:12px;color:#fff;font-weight:900}
@media(max-width:720px){
  .designer-load-card{grid-template-columns:48px 1fr 48px}
  .designer-load-track{grid-column:2 / 4}
}


/* Distribución actual del trabajo estilo demo */
.status-block-chart{margin-top:24px;display:grid;gap:18px}
.status-row{display:grid;grid-template-columns:135px 1fr 34px;gap:12px;align-items:center}
.status-row>span{color:#cbb3d9;font-size:11px}
.status-row>b{font-size:15px;color:white;text-align:right}
.blocks{display:flex;gap:4px;flex-wrap:wrap;align-content:center}
.blocks i{display:block;width:12px;height:23px;border-radius:2px;box-shadow:0 0 8px currentColor}
.blocks.pink i{background:#ff3f97;color:#ff3f97}
.blocks.blue i{background:#2fa7ff;color:#2fa7ff}
.blocks.cyan i{background:#1ff4e4;color:#1ff4e4}
.blocks.violet i{background:#8f4bff;color:#8f4bff}


.filters-six{grid-template-columns:repeat(6,1fr)}
.empty-chart{height:100%;min-height:170px;display:grid;place-items:center;text-align:center;color:#b9a6c9;font-size:11px;border:1px dashed #46205a;border-radius:8px;padding:20px}
.empty-table{text-align:center!important;color:#b9a6c9;padding:30px!important}
.table-panel{display:block!important;visibility:visible!important}
.table-wrap{min-height:120px}
@media(max-width:1250px){.filters-six{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.filters-six{grid-template-columns:1fr 1fr}}


/* V5: filtros por rangos de fecha */
.filters-date-ranges{grid-template-columns:repeat(4,minmax(150px,1fr))}
.filters input[type="date"]{
  width:100%;
  margin-top:6px;
  border:0;
  border-radius:6px;
  padding:9px;
  background:#29003e;
  color:#fff;
  font-weight:700;
  color-scheme:dark;
}

/* Evitar que los estados se recorten */
.table-wrap{overflow:auto}
table{table-layout:auto}
td,th{white-space:nowrap}
td:nth-child(1),th:nth-child(1),
td:nth-child(2),th:nth-child(2),
td:nth-child(3),th:nth-child(3),
td:nth-child(4),th:nth-child(4){
  white-space:normal;
}
.badge{
  max-width:none!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  line-height:1.2;
}
td:nth-child(5){min-width:170px}
@media(max-width:1250px){.filters-date-ranges{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.filters-date-ranges{grid-template-columns:1fr}}


/* V6: doble barra por diseñador */
.designer-load-card-double{
  grid-template-columns:52px 155px 1fr;
  align-items:center;
}
.designer-bars{display:grid;gap:8px}
.designer-bar-line{
  display:grid;
  grid-template-columns:70px 1fr 34px;
  gap:9px;
  align-items:center;
}
.designer-bar-line>span{
  color:#c7b2d2;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.designer-bar-line>b{
  text-align:right;
  font-size:11px;
  color:#fff;
}
.active-fill{
  background:linear-gradient(90deg,var(--pink),var(--cyan));
}
.completed-fill{
  background:linear-gradient(90deg,var(--violet),var(--green));
}
@media(max-width:720px){
  .designer-load-card-double{
    grid-template-columns:48px 1fr;
  }
  .designer-bars{
    grid-column:1 / 3;
  }
}
