/* ============================================================
   WORKSTATION CRIATOR — dashboard.css
   Home (grid de módulos) e Visão Gerencial (KPIs, gráficos SVG,
   atividade recente), além da toolbar de busca e dos banners.
   ============================================================ */

/* ---------- Home / grade de módulos ---------- */
.hero-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap;}
.hero-row h1{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.02em;color:var(--gray-900);}
.hero-row p{margin-top:4px;font-size:var(--text-md);color:var(--gray-500);}

.module-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;}
.module-card{
  background:#fff;border:1px solid var(--gray-100);border-radius:var(--radius-lg);padding:20px;
  display:flex;flex-direction:column;gap:16px;transition:box-shadow var(--dur-card) var(--ease),transform var(--dur-card) var(--ease),border-color var(--dur-card) var(--ease);position:relative;
}
.module-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--gray-200);}
.module-card:focus-visible{outline:none;box-shadow:var(--shadow-md),var(--shadow-focus);border-color:var(--blue-500);}
.add-module-card:focus-visible{outline:none;border-color:var(--blue-500);box-shadow:var(--shadow-focus);}
.module-card .mc-top{display:flex;align-items:flex-start;justify-content:space-between;}
.module-card .mc-icon{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;}
.module-card .mc-icon svg{width:20px;height:20px;}
.module-card h3{font-size:var(--text-lg);font-weight:700;color:var(--gray-900);letter-spacing:-.01em;margin-bottom:4px;}
.module-card .mc-body p{
  font-size:var(--text-xs);color:var(--gray-500);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2lh;
}
.module-card .mc-meta{font-size:var(--text-xs);color:var(--gray-500);display:flex;align-items:center;gap:16px;font-variant-numeric:tabular-nums;}
.module-card .mc-meta span{display:flex;align-items:center;gap:5px;}
.module-card .mc-meta svg{width:13px;height:13px;}
.module-card .mc-arrow{position:absolute;top:20px;right:20px;width:26px;height:26px;border-radius:var(--radius-sm);background:var(--gray-50);display:flex;align-items:center;justify-content:center;color:var(--gray-400);opacity:0;transform:translateX(-4px);transition:opacity .15s var(--ease),transform .15s var(--ease);}
@media (hover:hover) and (pointer:fine){.module-card:hover .mc-arrow{opacity:1;transform:translateX(0);}}
@media (hover:none){.module-card .mc-arrow{display:none;}}
.module-card .mc-arrow svg{width:13px;height:13px;}

.add-module-card{
  border:1.5px dashed var(--gray-300);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;padding:20px;color:var(--gray-400);min-height:184px;transition:border-color .15s var(--ease),color .15s var(--ease),background .15s var(--ease);
}
.add-module-card:hover{border-color:var(--blue-500);color:var(--blue-600);background:var(--blue-50);}
.add-module-card .ic{width:40px;height:40px;border-radius:50%;background:var(--gray-50);display:flex;align-items:center;justify-content:center;}
.add-module-card:hover .ic{background:#fff;}
.add-module-card .ic svg{width:20px;height:20px;}
.add-module-card b{font-size:var(--text-sm);font-weight:700;}

/* ---------- Visão Gerencial ---------- */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px;}
.kpi-card{background:#fff;border:1px solid var(--gray-100);border-radius:var(--radius-lg);padding:20px;position:relative;overflow:hidden;}
.kpi-card .kc-top{display:flex;align-items:center;justify-content:space-between;}
.kpi-card .kc-icon{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;}
.kpi-card .kc-icon svg{width:19px;height:19px;}
.kpi-card .kc-value{font-size:var(--text-2xl);font-weight:700;color:var(--gray-900);margin-top:16px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.kpi-card .kc-label{font-size:var(--text-xs);color:var(--gray-500);margin-top:4px;}

/* Tile compacto (linha "Resumo" da tela de módulo) */
.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.kpi-tile{display:flex;align-items:center;gap:12px;min-width:0;}
.kpi-tile .kt-icon{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.kpi-tile .kt-icon svg{width:19px;height:19px;}
.kpi-tile b{display:block;font-size:var(--text-xl);font-weight:700;color:var(--gray-900);line-height:1.1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;}
.kpi-tile span{display:block;font-size:var(--text-xs);color:var(--gray-500);margin-top:2px;}
@media (max-width:900px){.kpi-row{grid-template-columns:repeat(2,1fr);}}

.chart-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;margin-bottom:24px;align-items:start;}
.chart-card{background:#fff;border:1px solid var(--gray-100);border-radius:var(--radius-lg);padding:20px;}
.chart-card .cc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;}
.chart-card .cc-head h3{font-size:var(--text-md);font-weight:700;color:var(--gray-900);letter-spacing:-.01em;}
.chart-card .cc-head span{font-size:var(--text-xs);color:var(--gray-500);}

/* Gráfico de barras: colunas distribuídas na largura, baseline, rótulos numa faixa abaixo */
.bars{display:flex;align-items:flex-end;gap:16px;height:180px;margin-top:20px;max-width:460px;border-bottom:1px solid var(--gray-200);}
.bars .bar-col{flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;justify-content:flex-end;position:relative;}
.bars .bar-col .bar{width:56%;max-width:56px;border-radius:var(--radius-xs) var(--radius-xs) 0 0;background:var(--blue-600);transition:opacity var(--dur-fast);}
.bars .bar-col:hover .bar{opacity:.82;}
.bars .bar-col .bar-val{font-size:var(--text-xs);font-weight:700;color:var(--gray-700);font-variant-numeric:tabular-nums;}
.bars .bar-col:hover::after{
  content:attr(data-tip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:6px;
  background:var(--gray-900);color:#fff;font-size:var(--text-xs);padding:4px 8px;border-radius:var(--radius-xs);white-space:nowrap;pointer-events:none;z-index:2;
}
.bars-x{display:flex;gap:16px;max-width:460px;margin-top:8px;}
.bars-x span{flex:1 1 0;text-align:center;font-size:var(--text-xs);color:var(--gray-500);line-height:1.3;}

/* Distribuição: lista de barras horizontais (mais legível que donut p/ comparar) */
.dist-list{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
.dist-row{display:grid;grid-template-columns:1fr 90px auto;align-items:center;gap:10px;font-size:var(--text-sm);}
.dist-row .dl-label{color:var(--gray-700);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dist-row .dl-track{height:8px;border-radius:var(--radius-pill);background:var(--gray-100);overflow:hidden;}
.dist-row .dl-fill{height:100%;background:var(--blue-600);border-radius:var(--radius-pill);}
.dist-row b{color:var(--gray-900);font-weight:700;font-variant-numeric:tabular-nums;text-align:right;}

.recent-list{display:flex;flex-direction:column;}
.recent-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--gray-50);min-height:56px;}
.recent-row:last-child{border-bottom:none;}
.recent-row .rr-icon{width:32px;height:32px;border-radius:var(--radius-sm);background:var(--gray-50);display:flex;align-items:center;justify-content:center;color:var(--gray-500);flex-shrink:0;}
.recent-row .rr-icon svg{width:16px;height:16px;}
.recent-row .rr-text{flex:1;min-width:0;padding-right:8px;}
.recent-row .rr-text b{display:block;font-size:var(--text-sm);color:var(--gray-800);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.recent-row .rr-text span{display:block;font-size:var(--text-xs);color:var(--gray-500);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.recent-row time{font-size:var(--text-xs);color:var(--gray-500);flex-shrink:0;}

/* ---------- Toolbar / busca / banners ---------- */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
.toolbar-left{display:flex;align-items:center;gap:8px;flex:1;flex-wrap:wrap;}
.toolbar-right{display:flex;align-items:center;gap:8px;}
.search-box{position:relative;flex:1;min-width:220px;max-width:320px;}
.search-box svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--gray-400);pointer-events:none;}
.search-box input{width:100%;height:34px;padding:0 12px 0 36px;border-radius:var(--radius-sm);border:1px solid var(--gray-200);background:#fff;font-size:var(--text-sm);color:var(--gray-800);font-family:inherit;transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);}
.search-box input:hover{border-color:var(--gray-300);}
.search-box input:focus{outline:none;border-color:var(--blue-500);box-shadow:var(--shadow-focus);}
.search-box input::placeholder{color:var(--gray-400);}

.banner{display:flex;align-items:flex-start;gap:12px;background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-lg);padding:14px 16px;margin-bottom:20px;}
.banner:empty{display:none;}
.banner-left{display:flex;align-items:flex-start;gap:12px;}
.banner-left svg{width:20px;height:20px;color:var(--blue-600);flex-shrink:0;margin-top:1px;}
.banner-left b{display:block;font-size:var(--text-sm);color:var(--gray-900);}
.banner-left span{display:block;font-size:var(--text-xs);color:var(--gray-600);margin-top:2px;}
