/* ============================================================================
   ALLREGTECH — DESIGN SYSTEM GLOBAL  (padrao Painel Master + Regulacao)
   Fonte: "Prompt Layout Painel Master". Use estas classes .ds-* em telas novas
   para que tudo nasca no mesmo padrao visual (menu, cards, graficos, fonte,
   cores, espacamento, icones). Aditivo — nao altera telas existentes.
   ============================================================================ */

:root{
  /* Roxo / marca */
  --ds-primary:#394820; --ds-primary-hover:#2f3c19; --ds-primary-ico:#405023;
  --ds-primary-deep:#323e1d; --ds-accent:#586d34;
  /* Gradientes */
  --ds-grad-sidebar:linear-gradient(180deg,#2c361a 0%,#1c2310 100%);
  --ds-grad-active:linear-gradient(135deg,#405023,#323e1d);
  --ds-grad-module:linear-gradient(110deg,#293417,#415026 60%,#526533);
  --ds-grad-logo:linear-gradient(140deg,#586d34,#758d4c);
  --ds-grad-avatar:linear-gradient(135deg,#536435,#778b53);
  --ds-grad-kpi:linear-gradient(140deg,#415026,#526533);
  /* Texto */
  --ds-t-strong:#212717; --ds-t-strong2:#24281d; --ds-t-mid:#4d5243;
  --ds-t-soft:#5b6250; --ds-t-faint:#8d9977; --ds-t-place:#a6ad99;
  /* Superficies / bordas */
  --ds-white:#fff; --ds-glass:rgba(255,255,255,.9);
  --ds-chip:#ecf0e5; --ds-chip2:#f0f4e9; --ds-lilac:#e7efd9; --ds-input:#f7f9f4;
  --ds-bd-card:#eaefe2; --ds-bd-input:#e0e7d4; --ds-bd-head:#e6ebdd;
  --ds-bd-row:#e8ede1; --ds-bd-div:#e2e8d7;
  /* Status (trio bg/fg/border) */
  --ds-ok-bg:#eafaf0;  --ds-ok-fg:#1f8a5b;  --ds-ok-bd:#bfe6cd;
  --ds-info-bg:#eef4fd; --ds-info-fg:#3a6fd0; --ds-info-bd:#d7e4f7;
  --ds-warn-bg:#fdf6ec; --ds-warn-fg:#c4881a; --ds-warn-bd:#f5e2c8; --ds-warn:var(--ds-warn-fg);
  --ds-err-bg:#fdeef0;  --ds-err-fg:#d6334a;  --ds-err-bd:#f7d3d8;
  --ds-neu-bg:#ecf0e5;  --ds-neu-fg:#405023;  --ds-neu-bd:#d3dcc2;
  /* Sombras */
  --ds-sh-card:0 8px 22px rgba(57,70,36,.06);
  --ds-sh-card2:0 10px 26px rgba(57,70,36,.07);
  --ds-sh-head:0 12px 32px rgba(57,70,36,.08);
  --ds-sh-main:0 20px 50px rgba(57,70,36,.12);
  --ds-sh-rail:0 22px 50px rgba(28,35,16,.40);
  --ds-sh-btn:0 8px 18px rgba(57,72,32,.28);
  --ds-sh-modal:0 30px 70px rgba(0,0,0,.4);
  /* Raios / fonte */
  --ds-r-shell:28px; --ds-r-header:24px; --ds-r-card:22px; --ds-r-modal:26px;
  --ds-r-pill:14px; --ds-r-ctrl:13px; --ds-r-ico:16px;
  --ds-font:'Poppins',system-ui,sans-serif;
}

/* ---- fundacao ---- */
.ds-root, .ds-root *{ box-sizing:border-box; }
.ds-root{ font-family:var(--ds-font); color:var(--ds-t-strong); font-variant-numeric:tabular-nums; }
.ds-bg{
  background:
    radial-gradient(820px 480px at 8% -8%, rgba(109,128,76,.20), transparent 60%),
    radial-gradient(760px 560px at 108% 4%, rgba(80,95,55,.16), transparent 55%),
    radial-gradient(700px 600px at 50% 120%, rgba(104,123,70,.12), transparent 60%),
    linear-gradient(160deg,#e9eedf 0%,#dfe5d4 50%,#e8eddf 100%);
  background-attachment:fixed;
}
@keyframes ds-viewIn{ from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
@keyframes ds-livepulse{ 0%,100%{opacity:1} 50%{opacity:.35} }
@keyframes ds-livering{ 0%{transform:scale(1);opacity:.6} 100%{transform:scale(2.6);opacity:0} }
.ds-animate-in{ animation:ds-viewIn .36s cubic-bezier(.22,.7,.3,1) both; }

/* ---- casca (shell) — rail EXPANSIVEL (padrao Master/Regulacao, "mais completo") ---- */
.ds-page{ min-height:100vh; padding:18px 22px 40px; display:flex; gap:18px; align-items:flex-start; }
.ds-rail{ width:78px; flex-shrink:0; align-self:flex-start; position:sticky; top:18px; height:calc(100vh - 36px);
  background:var(--ds-grad-sidebar); border-radius:var(--ds-r-shell); padding:16px 0 18px;
  display:flex; flex-direction:column; align-items:center; gap:8px; box-shadow:var(--ds-sh-rail);
  overflow:hidden; transition:width .24s cubic-bezier(.22,.7,.3,1); }
.ds-rail:hover, .ds-rail:focus-within{ width:238px; }
.ds-rail:hover .ds-rail-item, .ds-rail:focus-within .ds-rail-item{ width:calc(100% - 24px); justify-content:flex-start; padding:0 15px; }
.ds-rail-logo{ width:50px; height:50px; flex-shrink:0; border-radius:17px; background:#fff;
  display:flex; align-items:center; justify-content:center; box-shadow:0 10px 22px rgba(88,109,52,.35);
  margin-bottom:6px; padding:7px; overflow:hidden; transition:width .24s cubic-bezier(.22,.7,.3,1); }
.ds-rail:hover .ds-rail-logo, .ds-rail:focus-within .ds-rail-logo{ width:calc(100% - 24px); }
.ds-rail-logo img{ width:100%; height:100%; object-fit:contain; display:block; }
.ds-rail-scroll{ flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; width:100%; display:flex; flex-direction:column;
  align-items:center; gap:9px; scrollbar-width:none; -ms-overflow-style:none; }
.ds-rail-scroll::-webkit-scrollbar{ width:0; height:0; display:none; }
.ds-rail-item{ width:48px; height:48px; min-height:48px; flex-shrink:0; border-radius:16px; border:none; background:transparent;
  color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:12px; padding:0; white-space:nowrap;
  overflow:hidden; transition:background .18s, color .18s, width .24s; }
.ds-rail-item svg{ flex-shrink:0; width:21px; height:21px; stroke-width:1.9; fill:none; }
.ds-rail-item:hover{ background:rgba(255,255,255,.15); }
.ds-rail-item.active{ background:#fff; color:var(--ds-primary-deep); box-shadow:0 8px 18px rgba(8,10,4,.45); }
.ds-rail-label{ max-width:0; opacity:0; overflow:hidden; font-size:13.5px; font-weight:600; letter-spacing:.2px;
  transition:max-width .24s cubic-bezier(.22,.7,.3,1), opacity .18s; }
.ds-rail:hover .ds-rail-label, .ds-rail:focus-within .ds-rail-label{ max-width:170px; opacity:1; }
.ds-rail-avatar{ flex-shrink:0; margin-top:6px; width:44px; height:44px; display:flex; align-items:center;
  justify-content:center; transition:width .24s cubic-bezier(.22,.7,.3,1); }
.ds-rail:hover .ds-rail-avatar, .ds-rail:focus-within .ds-rail-avatar{ width:calc(100% - 20px); justify-content:flex-start; gap:8px; }
.ds-rail-avatar-ini{ width:44px; height:44px; flex-shrink:0; border-radius:14px; background:var(--ds-grad-avatar);
  color:#fff; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; box-shadow:0 6px 16px rgba(0,0,0,.3); }
.ds-rail-exit{ color:#d1ddbd; }
.ds-rail-exit:hover{ background:rgba(226,86,106,.25); color:#fff; }
.ds-col{ flex:1; min-width:0; display:flex; flex-direction:column; gap:16px; }

/* ---- home da unidade: secoes + cards de modulo ---- */
.ds-section-title{ display:flex; align-items:center; gap:9px; font-size:12px; font-weight:700; letter-spacing:1.5px;
  color:var(--ds-t-faint); text-transform:uppercase; margin:6px 0 4px; }
.ds-section-title::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--ds-primary-ico); }
.ds-mod-card{ background:#fff; border:1px solid var(--ds-bd-card); border-radius:20px; padding:22px; cursor:pointer;
  transition:transform .16s, box-shadow .16s; box-shadow:var(--ds-sh-card); }
.ds-mod-card:hover{ transform:translateY(-2px); box-shadow:var(--ds-sh-card2); }
.ds-mod-ic{ width:48px; height:48px; border-radius:14px; background:#e7eddc; color:var(--ds-primary-ico);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:15px; }
.ds-mod-title{ font-size:16px; font-weight:700; color:var(--ds-t-strong); margin-top:12px; }
.ds-mod-desc{ font-size:12.5px; color:var(--ds-t-soft); margin-top:4px; }
.ds-header{ background:#fff; border:1px solid var(--ds-bd-head); border-radius:var(--ds-r-header);
  padding:16px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; box-shadow:var(--ds-sh-head); }
.ds-header-title{ font-size:21px; font-weight:800; color:var(--ds-t-strong); }
.ds-header-chip{ font-size:9px; letter-spacing:1.5px; font-weight:700; color:var(--ds-accent);
  background:var(--ds-lilac); padding:4px 9px; border-radius:8px; text-transform:uppercase; }
.ds-main{ flex:1; min-width:0; background:var(--ds-glass); border:1px solid rgba(255,255,255,.9);
  border-radius:var(--ds-r-shell); padding:26px 28px; box-shadow:var(--ds-sh-main); min-height:660px; }
.ds-main>div{ animation:ds-viewIn .36s cubic-bezier(.22,.7,.3,1) both; }

/* ---- faixa de titulo de modulo (header roxo) ---- */
.ds-module-header{ border-radius:var(--ds-r-card); padding:18px 22px; color:#fff;
  background:var(--ds-grad-module); box-shadow:0 14px 30px rgba(60,74,37,.30);
  display:flex; align-items:center; gap:14px; }
.ds-module-header .ds-mh-ic{ width:48px; height:48px; border-radius:15px; background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.22); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ds-mh-kicker{ font-size:9.5px; font-weight:700; letter-spacing:1.6px; color:#cbd5ba; text-transform:uppercase; }
.ds-mh-title{ font-size:22px; font-weight:800; line-height:1.1; }

/* ---- widget AO VIVO ---- */
.ds-live{ display:flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--ds-bd-card);
  border-radius:16px; padding:10px 16px; }
.ds-live-dot{ position:relative; display:inline-flex; width:9px; height:9px; }
.ds-live-dot::before{ content:''; position:absolute; inset:0; border-radius:50%; background:var(--ds-err-fg);
  animation:ds-livepulse 1.4s infinite; }
.ds-live-dot.is-ok::before{ background:#22c071; }
.ds-live-clock{ font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; }

/* ---- cards / KPIs ---- */
.ds-grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.ds-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.ds-grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.ds-card{ background:#fff; border:1px solid var(--ds-bd-card); border-radius:var(--ds-r-card);
  padding:18px; box-shadow:var(--ds-sh-card2); }
.ds-kpi{ background:#fff; border:1px solid var(--ds-bd-card); border-radius:var(--ds-r-card);
  padding:18px; box-shadow:var(--ds-sh-card2); }
.ds-kpi-ic{ width:36px; height:36px; border-radius:12px; background:#e7eddc; color:var(--ds-primary-ico);
  display:flex; align-items:center; justify-content:center; }
.ds-kpi-num{ font-size:32px; font-weight:800; line-height:1; margin-top:10px; }
.ds-kpi-label{ font-size:11.5px; font-weight:600; color:var(--ds-t-faint); text-transform:uppercase;
  letter-spacing:.5px; margin-top:6px; }
.ds-kpi.is-accent{ background:var(--ds-grad-kpi); color:#fff; border:none; position:relative; overflow:hidden; }
.ds-kpi.is-accent .ds-kpi-label{ color:rgba(255,255,255,.85); }
.ds-kpi.is-accent::after{ content:''; position:absolute; right:-18px; top:-18px; width:90px; height:90px;
  border-radius:50%; background:rgba(255,255,255,.09); }

/* ---- barra de progresso ---- */
.ds-progress{ height:9px; border-radius:6px; background:var(--ds-chip); overflow:hidden; }
.ds-progress>i{ display:block; height:100%; border-radius:6px; background:var(--ds-grad-active); }

/* ---- tabela ---- */
.ds-table{ background:#fff; border:1px solid var(--ds-bd-card); border-radius:20px; overflow:hidden; box-shadow:var(--ds-sh-card); }
.ds-thead{ background:var(--ds-chip); padding:12px 16px; display:grid; gap:10px;
  font-size:10.5px; font-weight:600; letter-spacing:.8px; color:#737b64; text-transform:uppercase; }
.ds-trow{ padding:13px 16px; display:grid; gap:10px; border-top:1px solid var(--ds-bd-row);
  align-items:center; font-size:12px; color:var(--ds-t-mid); }
.ds-cell-name{ font-size:12px; font-weight:600; color:var(--ds-primary); }
.ds-cell-sub{ font-size:10.5px; color:var(--ds-t-faint); font-variant-numeric:tabular-nums; }

/* ---- badges / pills ---- */
.ds-badge{ display:inline-block; font-size:11px; font-weight:600; padding:3px 10px; border-radius:16px; white-space:nowrap; }
.ds-badge.is-ok{ background:var(--ds-ok-bg); color:var(--ds-ok-fg); border:1px solid var(--ds-ok-bd); }
.ds-badge.is-info{ background:var(--ds-info-bg); color:var(--ds-info-fg); border:1px solid var(--ds-info-bd); }
.ds-badge.is-warn{ background:var(--ds-warn-bg); color:var(--ds-warn-fg); border:1px solid var(--ds-warn-bd); }
.ds-badge.is-err{ background:var(--ds-err-bg); color:var(--ds-err-fg); border:1px solid var(--ds-err-bd); }
.ds-badge.is-neutral{ background:var(--ds-neu-bg); color:var(--ds-neu-fg); border:1px solid var(--ds-neu-bd); }
.ds-chip-mod{ background:var(--ds-chip); color:var(--ds-primary); font-size:11px; font-weight:600;
  padding:3px 10px; border-radius:16px; }

/* ---- toggle / switch ---- */
.ds-switch{ width:38px; height:20px; border-radius:11px; background:#cdd2c2; position:relative;
  cursor:pointer; transition:background .16s; }
.ds-switch.on{ background:var(--ds-primary); }
.ds-switch::after{ content:''; position:absolute; top:3px; left:3px; width:14px; height:14px; border-radius:50%;
  background:#fff; transition:left .16s; }
.ds-switch.on::after{ left:21px; }

/* ---- abas (segmented) ---- */
.ds-tabs{ display:flex; gap:7px; background:var(--ds-chip2); border:1px solid var(--ds-bd-card);
  border-radius:var(--ds-r-ctrl); padding:5px; }
.ds-tab{ flex:1; text-align:center; padding:9px; border-radius:10px; font-size:12.5px; font-weight:600;
  color:var(--ds-t-soft); cursor:pointer; transition:all .15s; }
.ds-tab.active{ background:var(--ds-grad-active); color:#fff; }

/* ---- botoes ---- */
.ds-btn{ font-family:inherit; font-size:12.5px; font-weight:600; padding:9px 15px; border-radius:var(--ds-r-ctrl);
  cursor:pointer; border:1px solid transparent; white-space:nowrap; transition:all .15s; }
.ds-btn-primary{ background:var(--ds-primary); color:#fff; box-shadow:var(--ds-sh-btn); font-weight:700; }
.ds-btn-primary:hover{ background:var(--ds-primary-hover); }
.ds-btn-secondary{ background:var(--ds-chip); border-color:var(--ds-bd-input); color:var(--ds-primary); }
.ds-btn-tertiary{ background:#fff; border-color:var(--ds-bd-input); color:var(--ds-t-mid); }

/* ---- campos de formulario ---- */
.ds-field-label{ display:block; font-size:10.5px; font-weight:700; letter-spacing:.6px; color:var(--ds-t-faint);
  text-transform:uppercase; margin:0 0 6px; }
.ds-input{ width:100%; box-sizing:border-box; background:var(--ds-input); border:1px solid var(--ds-bd-input);
  border-radius:var(--ds-r-ctrl); padding:11px 13px; font-size:12.5px; color:var(--ds-t-strong2); font-family:inherit; }
.ds-input:focus{ outline:0; border-color:#85ab42; box-shadow:0 0 0 3px rgba(88,109,52,.14); background:#fff; }
.ds-input::placeholder{ color:var(--ds-t-place); }

/* ---- modal ---- */
.ds-modal-overlay{ position:fixed; inset:0; background:rgba(26,31,17,.55); backdrop-filter:blur(3px);
  display:flex; align-items:center; justify-content:center; padding:26px; z-index:80; }
.ds-modal{ background:#fff; border-radius:var(--ds-r-modal); width:100%; max-width:1000px; max-height:88vh;
  display:flex; flex-direction:column; box-shadow:var(--ds-sh-modal); overflow:hidden; }
.ds-modal-body{ padding:20px 26px; overflow-y:auto; }
.ds-modal-footer{ padding:16px 26px; border-top:1px solid var(--ds-bd-row); display:flex;
  justify-content:space-between; align-items:center; gap:12px; }

/* ---- sino flutuante ---- */
.ds-bell{ position:fixed; right:26px; bottom:26px; width:52px; height:52px; border-radius:50%;
  background:var(--ds-primary); color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(57,72,32,.4); cursor:pointer; z-index:70; }

/* ---- GRAFICOS (padrao Master — REGRA GLOBAL) ---- */
:root{
  --ds-chart-1:#586d34;        /* linha / area / barra primaria */
  --ds-chart-1-light:#9cbb66;  /* barra clara (alternancia) */
  --ds-chart-1-dark:#405023;   /* barra escura (destaque) */
  --ds-chart-green:#1f8a5b; --ds-chart-amber:#e8a017; --ds-chart-red:#e0445a; --ds-chart-red-light:#f0a9b3;
  --ds-chart-track:#e8ede1;    /* trilho de donut / barra vazia */
}
.ds-chart-title{ font-size:14px; font-weight:700; color:var(--ds-t-strong2); margin-bottom:14px; }
/* barras verticais (histograma) */
.ds-vbars{ display:flex; align-items:flex-end; gap:6px; height:120px; }
.ds-vbar{ flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; justify-content:flex-end; height:100%; }
.ds-vbar>i{ width:100%; background:var(--ds-chart-1); border-radius:5px 5px 0 0; min-height:3px; display:block; }
.ds-vbar-lbl{ font-size:9px; color:var(--ds-t-place); }
/* barra horizontal empilhada */
.ds-hbar{ display:flex; height:11px; border-radius:6px; overflow:hidden; background:var(--ds-chart-track); }
.ds-hbar>span{ display:block; height:100%; }
/* legenda */
.ds-chart-legend{ display:flex; gap:16px; margin-top:8px; font-size:11px; color:var(--ds-t-soft); }
.ds-chart-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:middle; }
/* PADROES SVG CANONICOS (copie em telas novas):
   AREA/LINHA:
     <defs><linearGradient id="g" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#586d34" stop-opacity=".30"/><stop offset="1" stop-color="#586d34" stop-opacity="0"/></linearGradient></defs>
     <path d="..Z" fill="url(#g)"/>
     <path d=".." fill="none" stroke="#586d34" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
     <circle r="3.5" fill="#586d34"/>
   DONUT:
     <svg viewBox="0 0 36 36"><circle cx="18" cy="18" r="15" fill="none" stroke="#e8ede1" stroke-width="4"/>
     <circle cx="18" cy="18" r="15" fill="none" stroke="{cor}" stroke-width="4" stroke-linecap="round" stroke-dasharray="{pct} 100" transform="rotate(-90 18 18)"/></svg>
   SPARKLINE:
     <polyline fill="none" stroke="#586d34" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" points=".."/> + <circle r="2.6" fill="#586d34"/> */

/* ---- graficos customizados: barras empilhadas + lista ranking (padrao almox) ---- */
.ds-chart-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.ds-stackbars{ display:flex; align-items:flex-end; gap:6px; height:210px; }
.ds-stackbar{ flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; height:100%; justify-content:flex-end; min-width:0; }
.ds-stackbar-col{ width:100%; max-width:32px; display:flex; flex-direction:column; justify-content:flex-end; height:100%; border-radius:6px 6px 0 0; overflow:hidden; background:var(--ds-chart-track); }
.ds-stackbar-col>span{ display:block; }  /* cada segmento: height:pct% + background:cor da serie */
.ds-stackbar-lbl{ font-size:9.5px; color:var(--ds-t-place); }
.ds-ranklist{ display:flex; flex-direction:column; gap:13px; }
.ds-rankrow-head{ display:flex; justify-content:space-between; gap:8px; font-size:12px; margin-bottom:5px; }
.ds-rankrow-name{ color:var(--ds-t-strong2); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ds-rankrow-val{ color:var(--ds-t-strong); font-weight:800; font-variant-numeric:tabular-nums; }
.ds-rankbar{ height:8px; border-radius:5px; background:var(--ds-chart-track); overflow:hidden; }
.ds-rankbar>i{ display:block; height:100%; border-radius:5px; background:linear-gradient(90deg,#405023,#85ab42); }

/* ---- scrollbar ---- */
.ds-scroll::-webkit-scrollbar{ width:9px; height:9px; }
.ds-scroll::-webkit-scrollbar-thumb{ background:#ccd4bd; border-radius:8px; }
.ds-scroll::-webkit-scrollbar-track{ background:transparent; }

/* Legibilidade tema escuro: --ds-t-soft claro sobre fundo escuro (23/07) */
body.theme-dark{ --ds-t-soft:#adba96; }