:root{
  --ink:#0B2A52;
  --steel:#4C6E8C;
  --steel-pale:#E3ECF3;
  --bg:#F1F5F9;
  --panel:#FFFFFF;
  --line:#D6E2EA;
  --gold:#4FB3F0;
  --gold-deep:#1070B0;
  --blue:#2090D0;
  --blue-deep:#0D5A8C;
  --red:#F70E24;
  --red-deep:#C90A1C;
  --ok:#4C7A4C;
  --warn:#E10D22;
  --radius:2px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Space Grotesk', sans-serif;
  -webkit-font-smoothing:antialiased;
}
.mono{font-family:'JetBrains Mono', monospace;}
a{color:inherit;}

h1{ margin:0; font-size:24px; font-weight:700; letter-spacing:-0.01em; }
.sub{ margin:8px 0 0; font-size:13px; color:#B9C2C4; max-width:560px; line-height:1.5; position:relative; z-index:1; }

.wrap{ max-width:1180px; margin:0 auto; padding:22px 20px 60px; }
.wrap.grid2{ display:grid; grid-template-columns:340px 1fr; gap:20px; align-items:start; }
@media (max-width:860px){ .wrap.grid2{ grid-template-columns:1fr; } }

.panel{ background:var(--panel); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.panel-head{ padding:14px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.panel-head h2{ margin:0; font-size:14px; font-weight:600; }
.panel-body{ padding:16px; }

.field{margin-bottom:12px;}
.field label{
  display:block; font-size:11px; font-family:'JetBrains Mono', monospace;
  text-transform:uppercase; letter-spacing:0.06em; color:var(--steel); margin-bottom:5px;
}
.field input, .field textarea, .field select{
  width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:var(--radius);
  font-family:'Space Grotesk', sans-serif; font-size:14px; background:#FBFCFC; color:var(--ink);
}
.field input:focus, .field textarea:focus, .field select:focus{ outline:2px solid var(--gold); border-color:var(--gold); }
.row2{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.row4{display:grid; grid-template-columns:repeat(4,1fr); gap:10px;}
@media (max-width:420px){.row4{grid-template-columns:1fr 1fr;}}

button{ font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:13px; border:none; border-radius:var(--radius); padding:10px 16px; cursor:pointer; }
button:active{ transform:translateY(1px); }
.btn-primary{ background:var(--gold); color:#231A08; width:100%; }
.btn-primary:hover{ background:var(--gold-deep); color:#fff; }
.btn-ghost{ background:transparent; color:var(--blue-deep); border:1px solid var(--blue); font-size:12px; padding:7px 12px; }
.btn-ghost:hover{ background:rgba(0,146,206,0.08); border-color:var(--blue-deep); }
.btn-danger{ background:transparent; color:var(--warn); border:none; font-size:12px; padding:4px 6px; text-decoration:underline; }
.toolbar{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.period-label{ font-family:'JetBrains Mono', monospace; font-size:11px; text-transform:uppercase; color:var(--steel); }
.period-input{ padding:6px 8px; border:1px solid var(--line); border-radius:var(--radius); font-family:'Space Grotesk', sans-serif; font-size:13px; background:#FBFCFC; color:var(--ink); }

.form-error{ background:#FBEAE7; border:1px solid var(--warn); color:var(--warn); font-size:12px; padding:8px 10px; border-radius:var(--radius); margin-bottom:12px; line-height:1.5; }
.calc-preview{ padding:8px 10px; font-size:13px; color:var(--steel); background:#F4F6F5; border:1px dashed var(--line); border-radius:var(--radius); }

table{ width:100%; border-collapse:collapse; font-size:13px; }
thead th{ text-align:left; font-family:'JetBrains Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em; color:var(--steel); padding:8px 10px; border-bottom:1px solid var(--line); white-space:nowrap; }
tbody td{ padding:9px 10px; border-bottom:1px solid var(--steel-pale); font-family:'JetBrains Mono', monospace; font-size:12.5px; white-space:nowrap; }
tbody tr:hover{ background:#FAFAF7; }
.dot{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; background:#C7CDC9; }
.dot.ok{ background:var(--ok); }
.dot.warn{ background:var(--warn); }
.grade-a{ color:var(--ok); font-weight:700; }
.grade-b{ color:var(--gold-deep); font-weight:700; }
.grade-c{ color:var(--warn); font-weight:700; }
.grade-na{ color:var(--steel); font-weight:700; }
.expand-btn{ background:transparent; border:1px solid var(--line); border-radius:3px; width:20px; height:20px; line-height:1; padding:0; margin-right:6px; font-size:11px; color:var(--steel); cursor:pointer; }
.expand-btn:hover{ border-color:var(--steel); color:var(--ink); }
tr.detail-row td{ padding:0; background:#F7F8F7; }
table.detail-table{ width:100%; border-collapse:collapse; font-size:12px; margin:2px 0 8px; }
table.detail-table thead th{ text-align:left; font-family:'JetBrains Mono', monospace; font-size:10px; text-transform:uppercase; color:var(--steel); padding:6px 10px 4px 30px; border-bottom:1px solid var(--line); }
table.detail-table tbody td{ padding:6px 10px; font-family:'JetBrains Mono', monospace; font-size:12px; border-bottom:1px solid #E9ECEA; white-space:nowrap; }
table.detail-table tbody td:first-child{ padding-left:30px; }

.perm-list{ display:flex; flex-wrap:wrap; gap:6px 14px; }
.perm-item{ display:flex; align-items:center; gap:5px; font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--steel); cursor:pointer; }
.perm-item input{ margin:0; cursor:pointer; }

.table-wrap{ overflow-x:auto; }
.chart-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:16px; }
@media (max-width:640px){ .chart-grid{ grid-template-columns:1fr; } }
.chart-card{ border:1px solid var(--line); border-radius:var(--radius); padding:12px 12px 6px; background:#FCFDFC; }
.chart-card h3{ margin:0 0 8px; font-size:12px; font-family:'JetBrains Mono', monospace; text-transform:uppercase; color:var(--steel); }
canvas{ max-width:100%; }

.status-msg{ font-size:12px; color:var(--steel); padding:0 16px 14px; }
.status-msg.saving{ color:var(--gold-deep); }
.hint{ font-size:11px; color:var(--steel); margin-top:8px; line-height:1.5; }

#emptyState{ padding:40px 20px; text-align:center; color:var(--steel); }
#emptyState .big{ font-size:32px; margin-bottom:6px; }
#emptyState p{ font-size:13px; max-width:280px; margin:6px auto 0; line-height:1.5; }

/* Menu inicial (home) */
.module-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; max-width:1180px; margin:0 auto; }
@media (max-width:900px){ .module-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .module-grid{ grid-template-columns:1fr; } }
.module-card{
  display:block; text-align:left; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px 22px; text-decoration:none; color:inherit; transition:border-color .15s, box-shadow .15s;
}
.module-card:hover{ border-color:var(--blue); box-shadow:0 2px 10px rgba(0,0,0,0.06); }
.module-card .module-icon{ font-size:28px; line-height:1; margin-bottom:14px; display:block; }
.module-card h2{ margin:0 0 6px; font-size:17px; font-weight:700; }
.module-card p{ margin:0; font-size:13px; color:var(--steel); line-height:1.5; }
.module-card.disabled{ cursor:not-allowed; opacity:0.55; }
.module-card.disabled:hover{ border-color:var(--line); box-shadow:none; }
.module-badge{
  display:inline-block; margin-top:12px; font-family:'JetBrains Mono', monospace; font-size:10px;
  text-transform:uppercase; letter-spacing:0.06em; color:var(--steel); background:var(--steel-pale);
  border-radius:var(--radius); padding:3px 8px;
}
/* Tela de login */
.login-page{ min-height:100vh; display:grid; grid-template-columns:minmax(0,560px) minmax(0,1fr); background:var(--bg); }
@media (max-width:900px){ .login-page{ grid-template-columns:1fr; } }

.login-side{
  background:var(--ink); color:#EDEFEE; position:relative; overflow:hidden;
  display:flex; align-items:stretch; padding:48px 44px;
}
.login-side::after{
  content:""; position:absolute; right:-80px; top:-100px; width:320px; height:320px; border-radius:50%;
  background:radial-gradient(circle, rgba(79,179,240,0.28) 0%, rgba(79,179,240,0) 70%);
}
.login-side::before{
  content:""; position:absolute; left:-90px; bottom:-110px; width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(32,144,208,0.30) 0%, rgba(32,144,208,0) 70%);
}
@media (max-width:900px){ .login-side{ padding:36px 28px; } }

.login-side-inner{ position:relative; z-index:1; display:flex; flex-direction:column; width:100%; }

.login-brand{ display:flex; align-items:center; gap:10px; }
.login-brand-mark{ height:38px; width:auto; display:block; background:#fff; border-radius:8px; padding:3px; }
.login-brand-text{ display:flex; flex-direction:column; line-height:1.25; }
.login-brand-text strong{ font-size:16px; font-weight:700; }
.login-brand-text span{ font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:0.06em; text-transform:uppercase; color:var(--gold); }

.login-hero{ margin-top:auto; padding-top:80px; max-width:420px; }
.login-hero h1{ font-size:34px; line-height:1.2; margin:0 0 14px; font-weight:700; letter-spacing:-0.01em; }
.login-hero p{ font-size:14px; line-height:1.6; color:#C4CCD6; margin:0; }

.login-features{ list-style:none; margin:56px 0 0; padding:0; display:flex; flex-direction:column; gap:18px; max-width:420px; }
.login-features li{ display:flex; align-items:flex-start; gap:12px; }
.login-feature-icon{
  flex-shrink:0; width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14); border-radius:6px; font-size:15px;
}
.login-features h3{ margin:0 0 2px; font-size:13px; font-weight:600; color:#fff; }
.login-features p{ margin:0; font-size:12px; color:#A9B4C0; line-height:1.5; }

.login-main{ display:flex; flex-direction:column; align-items:center; justify-content:center; padding:32px 24px; }
.login-card{ width:100%; max-width:380px; background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:32px; box-shadow:0 8px 30px rgba(11,42,82,0.06); }

.login-chip{
  display:inline-flex; align-items:center; gap:8px; background:var(--steel-pale); border-radius:20px;
  padding:5px 12px 5px 6px; margin-bottom:18px;
}
.login-chip img{ height:20px; width:20px; border-radius:5px; display:block; object-fit:cover; }
.login-chip span{ font-family:'JetBrains Mono', monospace; font-size:9.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--steel); }

.login-card h1{ font-size:20px; margin:0 0 6px; font-weight:700; }
.login-card .sub{ color:var(--steel); font-size:13px; margin:0 0 22px; max-width:none; }

.field-icon .input-wrap{ position:relative; display:flex; align-items:center; }
.field-icon input{ padding-left:34px; }
.field-icon .input-icon{
  position:absolute; left:10px; font-size:13px; opacity:0.55; pointer-events:none; line-height:1;
}
.input-toggle{
  position:absolute; right:6px; background:transparent; border:none; padding:6px; font-size:14px;
  color:var(--steel); cursor:pointer; opacity:0.7; line-height:1;
}
.input-toggle:hover{ opacity:1; }

.login-row{ display:flex; align-items:center; justify-content:space-between; margin:2px 0 18px; flex-wrap:wrap; gap:8px; }
.login-remember{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--steel); cursor:pointer; }
.login-remember input{ margin:0; cursor:pointer; }
.login-forgot{ font-size:12px; color:var(--red); text-decoration:none; font-weight:600; }
.login-forgot:hover{ text-decoration:underline; }

.btn-login{ background:var(--red); color:#fff; display:flex; align-items:center; justify-content:center; gap:8px; }
.btn-login:hover{ background:var(--red-deep); color:#fff; }

.login-inline-link{ color:var(--red); font-weight:600; text-decoration:none; }
.login-inline-link:hover{ text-decoration:underline; }

.login-footer{ margin-top:18px; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.04em; color:var(--steel); text-align:center; }

/* Dashboard / menu principal (home.html) — o app inteiro (painel lateral +
   conteúdo) é UM quadro só, com cantos arredondados nos 4 lados, "flutuando"
   com uma margem sobre o fundo da página. Para os cantos ficarem visíveis
   mesmo em páginas com formulário comprido, o quadro tem altura travada em
   100vh (não cresce com o conteúdo) e só o miolo (.dash-main) rola por
   dentro — por isso o painel lateral não precisa mais de position:sticky,
   ele simplesmente não faz parte da área que rola. */
.dash{
  display:grid; grid-template-columns:260px 1fr; height:100vh; background:var(--bg);
  margin:14px; border-radius:20px; overflow:hidden;
  box-shadow:0 24px 60px rgba(11,42,82,0.16);
}
@media (max-width:900px){ .dash{ height:auto; grid-template-columns:1fr; margin:10px; border-radius:16px; } }

/* Submenu de módulo — barra horizontal no topo do conteúdo (dentro de
   .dash-main, acima das views). Usada por páginas como producao-uht.html
   que têm navegação própria (Dashboard / Apontamento / Relatórios). Só a
   barra fica no topo — o painel lateral principal continua do lado
   esquerdo, sem mudança. */
.module-subnav{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px;
  background:var(--panel); border:1px solid var(--line); border-radius:14px;
  padding:12px 16px; margin-bottom:20px;
}
.module-subnav-head{ display:flex; align-items:center; gap:10px; }
.module-subnav-icon{
  width:34px; height:34px; border-radius:9px; background:var(--steel-pale); color:var(--ink);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.module-subnav-icon svg{ display:block; width:17px; height:17px; }
.module-subnav-head-text{ display:flex; flex-direction:column; line-height:1.25; }
.module-subnav-head-text strong{ font-size:13px; color:var(--ink); }
.module-subnav-head-text span{ font-family:'JetBrains Mono', monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.06em; color:var(--steel); }

.module-subnav-nav{ display:flex; flex-direction:row; flex-wrap:wrap; gap:6px; }
.module-subnav-link{
  display:flex; align-items:center; white-space:nowrap; text-align:left; background:transparent; border:none;
  font-family:'Space Grotesk', sans-serif; font-size:13px; font-weight:600; color:var(--steel);
  padding:9px 14px; border-radius:8px; cursor:pointer;
}
.module-subnav-link:hover{ background:var(--steel-pale); color:var(--ink); }
.module-subnav-link.active{ background:var(--red); color:#fff; }

.dash-sidebar{
  background:var(--ink); color:#EDEFEE; display:flex; flex-direction:column;
  padding:20px 16px; height:100%; overflow-y:auto;
}
@media (max-width:900px){ .dash-sidebar{ height:auto; } }

.dash-brand{ display:flex; align-items:center; gap:10px; padding:6px 6px 20px; border-bottom:1px solid rgba(255,255,255,0.08); margin-bottom:16px; }
.dash-brand-icon{ width:36px; height:36px; border-radius:8px; background:#fff; object-fit:cover; padding:3px; display:block; }
.dash-brand-text{ display:flex; flex-direction:column; line-height:1.25; }
.dash-brand-text strong{ font-size:14px; }
.dash-brand-text span{ font-family:'JetBrains Mono', monospace; font-size:9px; letter-spacing:0.06em; text-transform:uppercase; color:var(--gold); }

.dash-nav{ display:flex; flex-direction:column; gap:4px; flex:1; }
.dash-nav-item{ display:flex; flex-direction:column; }
.dash-nav-link{
  display:flex; align-items:center; gap:10px; width:100%; text-align:left;
  background:transparent; border:none; color:#C7D0DA; font-family:'Space Grotesk', sans-serif;
  font-size:13px; font-weight:600; padding:10px 12px; border-radius:6px; cursor:pointer; text-decoration:none;
}
.dash-nav-link:hover{ background:rgba(255,255,255,0.06); color:#fff; }
.dash-nav-link.active{ background:var(--red); color:#fff; }
.dash-nav-icon{ display:inline-flex; align-items:center; justify-content:center; width:18px; flex-shrink:0; }
.dash-nav-icon svg{ display:block; width:17px; height:17px; flex-shrink:0; }
.dash-nav-label{ flex:1; }
.dash-nav-chevron{ display:inline-flex; opacity:0.55; }
.dash-nav-chevron svg{ display:block; width:11px; height:11px; flex-shrink:0; }
.dash-nav-item.open .dash-nav-toggle{ background:rgba(255,255,255,0.1); color:#fff; }
.dash-nav-link.disabled{ opacity:0.4; cursor:not-allowed; }
.dash-nav-soon{ font-family:'JetBrains Mono', monospace; font-size:8.5px; text-transform:uppercase; background:rgba(255,255,255,0.08); padding:2px 6px; border-radius:10px; }

/* Submenu em cascata — flyout à direita do item pai (posição calculada via
   JS em sidebar.js), como um menu clássico de ERP desktop. */
.dash-nav-sub{
  display:none; position:fixed; min-width:210px; max-width:260px;
  background:#fff; border:1px solid var(--line); border-radius:8px;
  box-shadow:0 12px 32px rgba(11,42,82,0.22); padding:6px; z-index:200;
}
.dash-nav-sub.dash-nav-sub-show{ display:block; }
.dash-nav-sublink{
  display:block; padding:8px 12px; font-size:13px; color:var(--ink); text-decoration:none;
  border-radius:5px; font-family:'Space Grotesk', sans-serif; white-space:nowrap;
}
.dash-nav-sublink:hover{ background:var(--steel-pale); }
.dash-nav-sublink.active{ background:var(--red); color:#fff; font-weight:600; }

.dash-sidebar-footer{ margin-top:auto; padding-top:14px; border-top:1px solid rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:space-between; gap:8px; }
.dash-user{ display:flex; align-items:center; gap:10px; min-width:0; }
.dash-user-avatar{ width:34px; height:34px; border-radius:50%; background:var(--red); color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex-shrink:0; }
.dash-user-info{ display:flex; flex-direction:column; line-height:1.25; min-width:0; }
.dash-user-info strong{ font-size:12.5px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:120px; }
.dash-user-info span{ font-size:10.5px; color:#8D97A3; }
.dash-logout{ background:transparent; border:1px solid rgba(255,255,255,0.15); color:#C7D0DA; width:32px; height:32px; border-radius:6px; cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.dash-logout svg{ display:block; width:15px; height:15px; flex-shrink:0; }
.dash-logout:hover{ border-color:#fff; color:#fff; }

/* Papel de parede — mesma composição de formas geométricas (na paleta do
   app) atrás do conteúdo de TODO módulo, não só da Visão geral. É uma única
   imagem SVG embutida (data URI) para não precisar mexer em cada página:
   basta ser o background do .dash-main. background-attachment:fixed mantém
   o desenho estável (relativo à janela) mesmo em páginas com formulários
   longos que rolam bastante.
   Atenção: refs internas a defs (fill='url(#g1)') vêm como %23g1 — um "#"
   literal cortaria o resto da data URI ali (vira um fragmento de URL). */
.dash-main{
  padding:26px 30px 50px; min-width:0; position:relative;
  height:100%; overflow-y:auto;
  background-color:var(--bg);
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  background-attachment:fixed;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cdefs%3E%3CradialGradient id='g1' cx='0.12' cy='0.18' r='0.45'%3E%3Cstop offset='0' stop-color='rgb(32,144,208)' stop-opacity='0.16'/%3E%3Cstop offset='1' stop-color='rgb(32,144,208)' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='g2' cx='0.88' cy='0.12' r='0.4'%3E%3Cstop offset='0' stop-color='rgb(79,179,240)' stop-opacity='0.18'/%3E%3Cstop offset='1' stop-color='rgb(79,179,240)' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='g3' cx='0.8' cy='0.85' r='0.45'%3E%3Cstop offset='0' stop-color='rgb(76,122,76)' stop-opacity='0.16'/%3E%3Cstop offset='1' stop-color='rgb(76,122,76)' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='g4' cx='0.15' cy='0.88' r='0.42'%3E%3Cstop offset='0' stop-color='rgb(247,14,36)' stop-opacity='0.1'/%3E%3Cstop offset='1' stop-color='rgb(247,14,36)' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='1600' height='900' fill='rgb(241,245,249)'/%3E%3Crect width='1600' height='900' fill='url(%23g1)'/%3E%3Crect width='1600' height='900' fill='url(%23g2)'/%3E%3Crect width='1600' height='900' fill='url(%23g3)'/%3E%3Crect width='1600' height='900' fill='url(%23g4)'/%3E%3Cpolygon points='160,120 360,120 460,220 360,320 160,320 60,220' fill='none' stroke='rgb(32,144,208)' stroke-opacity='0.28' stroke-width='3' transform='rotate(12 260 220)'/%3E%3Ccircle cx='1360' cy='140' r='70' fill='rgb(79,179,240)' fill-opacity='0.18'/%3E%3Cpolygon points='420,595 475,705 365,705' fill='none' stroke='rgb(247,14,36)' stroke-opacity='0.25' stroke-width='3' transform='rotate(-10 420 650)'/%3E%3Ccircle cx='1550' cy='780' r='170' fill='rgb(76,122,76)' fill-opacity='0.14'/%3E%3Ccircle cx='720' cy='380' r='34' fill='rgb(11,42,82)' fill-opacity='0.08'/%3E%3Cpolygon points='1242.5,485 1317.5,485 1355,560 1317.5,635 1242.5,635 1205,560' fill='none' stroke='rgb(76,122,76)' stroke-opacity='0.24' stroke-width='3' transform='rotate(25 1280 560)'/%3E%3Ccircle cx='540' cy='260' r='26' fill='rgb(247,14,36)' fill-opacity='0.2'/%3E%3Cpolygon points='1077.5,17.5 1162.5,17.5 1205,60 1162.5,102.5 1077.5,102.5 1035,60' fill='none' stroke='rgb(11,42,82)' stroke-opacity='0.12' stroke-width='3' transform='rotate(45 1120 60)'/%3E%3Cpolygon points='980,785 1025,875 935,875' fill='none' stroke='rgb(32,144,208)' stroke-opacity='0.24' stroke-width='3' transform='rotate(-18 980 830)'/%3E%3C/svg%3E");
}

@media (max-width:900px){ .dash-main{ height:auto; overflow-y:visible; } }

/* Tela inicial (Visão geral) — só o papel de parede, sem informação */
.dash-main.dash-welcome{ padding:0; }
@media (max-width:900px){ .dash-main.dash-welcome{ min-height:60vh; } }

/* Cabeçalho de página (breadcrumb + título + subtítulo) — cartão separado
   no topo do conteúdo, acima dos painéis da página. */
.page-head{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:18px 22px; margin-bottom:20px; }
.page-breadcrumb{
  margin:0 0 8px; font-family:'JetBrains Mono', monospace; font-size:10.5px; text-transform:uppercase;
  letter-spacing:0.08em; color:var(--steel);
}
.page-head h1{ margin:0 0 6px; font-size:22px; }
.page-subtitle{ margin:0; font-size:13px; color:var(--steel); }

/* Cadastro de Usuários — quadro único com abas (Usuários / Cadastro) */
.users-card{ overflow:hidden; }
.users-tabs{ display:flex; gap:4px; padding:10px 12px 0; border-bottom:1px solid var(--line); }
.users-tab{
  background:transparent; border:none; border-bottom:2px solid transparent; cursor:pointer;
  font-family:'Space Grotesk', sans-serif; font-size:13px; font-weight:600; color:var(--steel);
  padding:10px 14px; margin-bottom:-1px;
}
.users-tab:hover{ color:var(--ink); }
.users-tab.active{ color:var(--red); border-bottom-color:var(--red); }

/* Tabela de usuários — table-layout:fixed trava a tabela em 100% do
   container (nunca estoura a largura da tela) — ver colgroup em
   administrativo-usuarios.html. Fonte um pouco menor que o padrão do site
   para as colunas curtas caberem numa linha só sem quebrar; só "Módulos"
   (largura variável, pode ter vários chips) tem permissão pra quebrar. */
.users-table{ table-layout:fixed; font-size:12px; }
.users-table th{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:10px; }
.users-table td{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
.users-table td.modules-cell{ white-space:normal; overflow-wrap:break-word; overflow:visible; text-overflow:clip; }
.users-table td.actions-cell{ overflow:visible; }

.role-badge{
  display:inline-block; font-family:'JetBrains Mono', monospace; font-size:10.5px; text-transform:uppercase;
  padding:3px 8px; border-radius:10px; background:var(--steel-pale); color:var(--steel); white-space:nowrap;
}
.role-badge.role-master{ background:#FDE6E8; color:var(--red-deep); }

.status-badge{
  display:inline-block; font-family:'JetBrains Mono', monospace; font-size:10.5px; text-transform:uppercase;
  padding:3px 8px; border-radius:10px; white-space:nowrap;
}
.status-badge.status-on{ background:#E1F0E1; color:var(--ok); }
.status-badge.status-off{ background:var(--steel-pale); color:var(--steel); }

.mod-chip-list{ display:flex; flex-wrap:wrap; gap:6px; }
.mod-chip{
  display:inline-flex; align-items:center; gap:5px; font-size:11px; color:var(--ink); line-height:1.3;
  background:var(--steel-pale); border-radius:10px; padding:3px 8px; white-space:nowrap;
}
.mod-chip-sub{ font-family:'JetBrains Mono', monospace; font-size:9.5px; color:var(--steel); }

.row-actions{ display:flex; gap:6px; flex-wrap:wrap; }
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; flex-shrink:0;
  background:transparent; border:1px solid var(--line); border-radius:6px; color:var(--steel); cursor:pointer;
}
.icon-btn svg{ display:block; width:15px; height:15px; flex-shrink:0; }
.icon-btn:hover{ border-color:var(--blue); color:var(--blue-deep); }
.icon-btn.icon-btn-danger:hover{ border-color:var(--warn); color:var(--warn); }

.perm-grid{ display:flex; flex-direction:column; gap:4px; }
.perm-row{ border:1px solid var(--line); border-radius:6px; padding:10px 12px; }
.perm-module{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; cursor:pointer; }
.perm-module input{ margin:0; cursor:pointer; }
.perm-sub-list{
  display:flex; flex-wrap:wrap; gap:6px 16px; margin:10px 0 2px 26px; padding-top:10px; border-top:1px dashed var(--line);
}
.perm-sub-list-disabled{ opacity:0.45; }
.perm-sub-item{ display:flex; align-items:center; gap:5px; font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--steel); cursor:pointer; }
.perm-sub-item input{ margin:0; cursor:pointer; }
.perm-sub-item input:disabled{ cursor:not-allowed; }

/* Cadência da UHT (Produção → UHT → Apontamento de produção) — um quadro
   por envasadora, empilhados (um embaixo do outro). Cada quadro mostra o
   resumo das horas já agrupadas, as horas abertas (confirmadas, no máximo
   6) e a próxima hora pendente de confirmação. */
.cadencia-grid{ display:flex; flex-direction:column; gap:16px; padding:16px; }

.cadencia-card{ border:1px solid var(--line); border-radius:10px; background:#FCFDFC; overflow:hidden; }
.cadencia-card-head{
  padding:10px 14px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap;
}
.cadencia-card-head strong{ font-size:13px; }
.cadencia-card .table-wrap{ max-height:360px; overflow-y:auto; }
.cadencia-table{ width:100%; border-collapse:collapse; font-size:12px; }
.cadencia-table th{
  position:sticky; top:0; background:#FCFDFC;
  text-align:left; font-family:'JetBrains Mono', monospace; font-size:9.5px; text-transform:uppercase;
  color:var(--steel); padding:6px 8px; border-bottom:1px solid var(--line); white-space:nowrap;
}
.cadencia-table td{ padding:6px; border-bottom:1px solid var(--steel-pale); }
.cadencia-table input{
  width:100%; padding:5px 6px; border:1px solid var(--line); border-radius:3px;
  font-family:'JetBrains Mono', monospace; font-size:12px; background:#fff; color:var(--ink);
}
.cadencia-table input:focus{ outline:2px solid var(--gold); border-color:var(--gold); }
.cadencia-table tr.cadencia-row-resumo td{ background:var(--steel-pale); color:var(--steel); font-style:italic; }
.cadencia-table tr.cadencia-row-pendente td{ background:#FBEAE7; }
.cadencia-table tr.cadencia-row-pendente .mono{ font-weight:600; }
.cadencia-table tr.cadencia-row-edicao td{ background:#FFF8E6; }

.cadencia-card-toolbar{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 14px; border-top:1px solid var(--line); flex-wrap:wrap; }
.cadencia-card-toolbar .hint{ margin:0; }

.cadencia-finalizado-banner{
  display:flex; flex-direction:column; gap:2px; padding:10px 14px;
  background:#EAF6EC; border-bottom:1px solid var(--line); font-size:12px;
}
.cadencia-finalizado-banner strong{ font-size:12.5px; }
.cadencia-finalizado-banner span{ color:var(--steel); }

.cadencia-finalizar-form{ padding:14px; border-top:1px solid var(--line); background:#FBFBF9; }
.cadencia-finalizar-form .field{ margin-bottom:10px; }
.cadencia-finalizar-form .row2{ margin-bottom:0; }