/* Soroponto Web · Refinamento global de interface v0.17.8.8
   Camada ADITIVA: preserva HTML de formulários, name/id, rotas, dados, JS e regras de apuração.
   Sem bibliotecas/CDNs, fontes externas ou ícones remotos. */
:root {
  --ui-bg: #071517;
  --ui-sidebar: #0b1b1f;
  --ui-top: #102328;
  --ui-surface: #11282b;
  --ui-surface-2: #163033;
  --ui-surface-3: #203c3e;
  --ui-field: #0a2024;
  --ui-border: #315356;
  --ui-border-focus: #54e3a5;
  --ui-text: #ecf9f4;
  --ui-muted: #9bbcb5;
  --ui-soft: #c4e3d8;
  --ui-green: #43d994;
  --ui-green-deep: #17895b;
  --ui-green-wash: rgba(51,218,143,.12);
  --ui-shadow: 0 16px 38px rgba(0,7,10,.22);
  --ui-radius: 18px;
  --ui-radius-sm: 11px;
  --soro-ring: 0 0 0 3px rgba(68,219,146,.17);
  --soro-outline: rgba(104,236,172,.18);
  --soro-divider: rgba(143,208,184,.12);
}
html { scrollbar-color: #35585a #0c2225; }
body { background: radial-gradient(ellipse at 70% -15%, rgba(23,132,86,.13), transparent 42%), #071517; font-size: 13.5px; letter-spacing: -.004em; }
.app-shell { isolation: isolate; }
.main-shell { background: radial-gradient(ellipse at 85% -5%, rgba(41,156,103,.095), transparent 35%), radial-gradient(ellipse at 4% 80%, rgba(30,105,95,.035), transparent 40%), var(--ui-bg); }
/* Sidebar: navegação leve e hierarquia visível. */
.sidebar { width: 252px; min-width: 252px; background: linear-gradient(167deg, #102a2c 0%, #0b1e20 26%, #09191e 100%); border-right: 1px solid rgba(111,191,162,.19); box-shadow: 9px 0 33px rgba(0,0,0,.10); }
.brand { padding: 23px 18px 22px; gap: 12px; }
.brand img { width: 43px; height: 43px; border-radius: 13px; border: 1px solid rgba(83,226,153,.32); background: linear-gradient(146deg,#165b41,#0d322d); box-shadow: 0 8px 22px rgba(3,23,20,.28), inset 0 1px 0 rgba(159,255,194,.11); }
.brand strong { font-size: 14px; letter-spacing: .14em; color: #f2fff8; }
.brand span { font-size: 10.5px; color: #a4c9bd; }
.side-subtitle { padding: 22px 19px 14px; color: #8fafa8; font-size: 10px; }
.side-subtitle .view-tag { font-size: 10px; color: #70dbaa; line-height: 1.5; }
.sidebar nav { padding: 4px 11px 18px; }
.nav-section { padding: 1px 0 6px; }
.nav-section-label { padding: 11px 11px; font-size: 12px; font-weight: 680; color: #b6cfc9; border-radius: 11px; transition: background .18s,color .18s; }
.nav-section-label:hover { background: rgba(57,156,104,.11); }
.nav-section[open] > .nav-section-label { background: linear-gradient(100deg,rgba(49,183,118,.16),rgba(30,101,83,.08)); color:#a4f4c9; }
.nav-section-content { border-left: 1px solid rgba(104,179,153,.2); margin: 0 0 2px 16px; padding: 2px 0 5px 7px; }
.nav-link { min-height: 38px; border-radius: 10px; color: #adc7c1; padding: 8px 10px; font-size: 12px; margin: 3px 0; border: 1px solid transparent; }
.nav-link .nav-svg { width: 16px; height: 16px; color:#83b8a6; }
.nav-link:hover { background:rgba(57,162,111,.16); color:#ecfff5; border-color:rgba(116,224,166,.1); }
.nav-link.selected { background: linear-gradient(102deg,#1b704e 0%,#19543e 100%); color:#f7fff9; border: 1px solid rgba(109,235,163,.29); box-shadow: 0 5px 19px rgba(5,53,35,.17), inset 3px 0 0 #57f4a4; }
.nav-link.selected .nav-svg { color: #b3ffda; }
.side-bottom { margin-top:auto; border-top-color: var(--soro-divider); color: #a5bdb6; padding:17px 18px; }
.side-bottom span { color:#779d93; }
/* Barra fixa clara e busca em destaque. */
.topbar { height: 70px; gap: 16px; padding-inline: clamp(20px,2vw,37px); background:rgba(9,29,33,.94); border-bottom: 1px solid rgba(100,184,156,.18); box-shadow:0 6px 24px rgba(2,12,13,.10); }
.topbar-context { flex: 0 1 226px; }
.topbar-context small { color:#84c0a9; letter-spacing:.17em; }
.breadcrumb { color:#f2faf7; font-size:14px; }
.module-search-bar { max-width:420px; width: min(100%,420px); height:41px; border:1px solid rgba(120,188,163,.26); border-radius:12px; background:rgba(9,32,35,.86); box-shadow:inset 0 1px 1px rgba(0,0,0,.12); }
.module-search-bar:focus-within { box-shadow:var(--soro-ring); border-color:#61e1a0; }
.module-search-bar input { font-size:12px; padding:10px 14px; }
.module-search-bar button { color:#8ceec1; background:rgba(54,129,102,.09); }
.module-search-bar button:hover { color:#d3ffe9; }
.user-avatar { background:linear-gradient(135deg,#1e7651,#174f41); color:#e7fff1; border-color:#3c9972; border-radius:12px; box-shadow:inset 0 1px 0 rgba(172,255,206,.1); }
.logout { background:#173238; border:1px solid #365d5a; border-radius:10px; min-height:36px; padding:8px 13px; }
.logout:hover { background:#205442; border-color:#42876b; }
.mode-flag { background:rgba(34,102,71,.17); color:#9ad0b5; border-color:rgba(73,159,106,.2); }
.content { max-width: 1680px; padding: 27px clamp(20px, 2.9vw, 46px) 46px; min-height: calc(100vh - 70px); }
.page-title { margin-bottom: 27px; padding: 2px 0 8px; align-items: center; }
.page-eyebrow { color:#61e2a2; font-size:10px; font-weight:820; letter-spacing:.18em; }
.page-title h1 { font-size:clamp(25px,2.3vw,33px); color:#f6fff9; letter-spacing:-.045em; }
.page-version { border:1px solid rgba(75,168,124,.21); background:rgba(42,125,90,.08); border-radius:11px; padding:9px 11px; color:#9bc5b4; font-size:10px; }
.footnote { color:#84a69a; border-top:1px solid var(--soro-divider); margin-top:28px; padding-top:20px; }
/* Containers globais — dashboard, relatórios, operação e cadastro. */
.panel,.quick-actions,.report-overview,.report-week,.report-month,.team-compare-report,.team-compare-header,.team-trend-section,.team-compare-summary {
  border-radius:18px; border-color:rgba(108,173,158,.26); box-shadow:0 17px 38px rgba(0,7,10,.16),inset 0 1px 0 rgba(196,255,224,.028); }
.panel,.quick-actions { padding: 24px 26px; background:linear-gradient(155deg,#173035,#11262c 89%); }
.quick-actions { background:radial-gradient(circle at 94% 2%,rgba(39,189,111,.17),transparent 42%),linear-gradient(130deg,#1a3b35,#112b2e); border-color:rgba(80,198,135,.37); }
.panel-head { border-bottom:1px solid var(--soro-divider); padding-bottom:17px; }
.panel h2,.quick-actions h2 { color:#f3fff8; font-weight:740; letter-spacing:-.025em; }
.dashboard-intro h2 { font-size:clamp(22px,2vw,27px); }
.dashboard-kicker { color:#69e9ab; letter-spacing:.17em; }
.dashboard-decor { background:linear-gradient(145deg,rgba(54,217,138,.22),rgba(33,105,82,.14)); border-color:rgba(95,227,161,.3); border-radius:16px; }
.action-items a { min-height:40px; padding:10px 16px; border-radius:10px; background:rgba(25,106,74,.38); border-color:rgba(85,212,136,.31); color:#eafff2; font-weight:650; }
.action-items a:hover { background:rgba(25,137,82,.54); border-color:#59d894; }
.stats-grid { gap:14px; }
.stat { background:linear-gradient(145deg,#193337,#122c32); border:1px solid rgba(101,176,159,.29); border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.095),inset 0 1px 0 rgba(183,255,213,.03); transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease; }
.stat strong { color:#f8fffc; font-variant-numeric:tabular-nums; font-weight:790; letter-spacing:-.045em; }
.stat span { color:#cde5d9; }
.stat small { color:#93bdb0; }
.stat-icon { color:#71efad; background:linear-gradient(135deg,rgba(48,198,117,.23),rgba(30,125,96,.16)); border-color:rgba(100,223,155,.35); border-radius:12px; }
.stat-link:hover,.presence-card:hover { border-color:rgba(97,228,154,.65); box-shadow:0 14px 34px rgba(4,23,20,.18),0 0 0 1px rgba(53,210,137,.08); transform:translateY(-2px); }
/* Campos padronizados sem modificar elementos hidden, checkboxes ou radios. */
.app-shell input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=submit]),
.app-shell select,.app-shell textarea { background-color:#0c252a; color:#eaf8f0; border:1px solid #375d5e; border-radius:10px; min-height:40px; padding:9px 12px; box-shadow:inset 0 1px 1px rgba(0,0,0,.09); transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease; }
.app-shell textarea { min-height:95px; resize:vertical; }
.app-shell input::placeholder,.app-shell textarea::placeholder { color:#829f99; opacity:1; }
.app-shell input:not([type=checkbox]):not([type=radio]):not([type=hidden]):focus,
.app-shell select:focus,.app-shell textarea:focus { border-color:#60dba1; outline:0; box-shadow:var(--soro-ring); }
.app-shell input:disabled,.app-shell select:disabled,.app-shell textarea:disabled { background:#19282b; color:#829d99; cursor:not-allowed; }
.app-shell select { color-scheme:dark; }
.app-shell input[type=checkbox],.app-shell input[type=radio] { accent-color:#38d78b; }
.app-shell label { color:#b9d6c8; }
.app-shell label small { color:#86aba1; }
/* Exceções: pesquisa global não ganha borda própria dentro da barra. */
.app-shell .module-search-bar input[type=search] { border:0; background:transparent; border-radius:0; box-shadow:none; height:100%; min-height:0; }
.app-shell .module-search-bar input[type=search]:focus { border:0; box-shadow:none; outline:0; }
/* Botões, abas, navegação secundária e links de retorno. */
.app-shell .green-button,.app-shell .win-button,.app-shell .filterbar button[type=submit],.app-shell .cad-actions button[type=submit],
.app-shell .report-filters button[type=submit],.app-shell .team-compare-filter button[type=submit],
.app-shell .team-compare-export,.app-shell .presence-export-csv,.app-shell .presence-dialog-done {
  border:1px solid rgba(82,232,151,.36); border-radius:10px; background:linear-gradient(135deg,#178758,#126746); color:#f8fff9; font-weight:690; min-height:39px; padding:9px 15px; box-shadow:0 5px 16px rgba(3,27,19,.13); transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease; }
.app-shell .green-button:hover,.app-shell .win-button:hover,.app-shell .filterbar button[type=submit]:hover,
.app-shell .report-filters button[type=submit]:hover,.app-shell .team-compare-export:hover,.app-shell .presence-export-csv:hover {
  transform:translateY(-1px); background:linear-gradient(135deg,#209967,#158051); border-color:rgba(124,247,177,.58); box-shadow:0 9px 21px rgba(4,36,21,.2); }
.app-shell :is(.win-button,.green-button,button)[disabled] { opacity:.6; cursor:not-allowed; transform:none!important; }
.cad-tabs a,.win-tab,.report-tab { border-radius:11px; }
.cad-tabs a.active,.win-tab.active { background:linear-gradient(130deg,#177e53,#18593f); border-color:#50c68b; }
.employee-back-link,.employee-cancel-link,.presence-refresh { border-radius:9px; }
/* Tabelas organizadas para leitura, largura horizontal mantida. */
.scroll-x,.win-grid-scroll,.manage-scroll,.team-compare-scroll,.team-trend-scroll { border:1px solid rgba(95,173,151,.25); border-radius:13px; background:#11282c; scrollbar-width:thin; scrollbar-color:#456f67 #102428; }
.app-shell table { border-collapse:separate; border-spacing:0; font-variant-numeric:tabular-nums; }
.app-shell thead th { background:#1b3c3d; border-bottom:1px solid rgba(116,186,160,.3); color:#c8ebda; text-transform:uppercase; letter-spacing:.048em; font-size:10.5px; font-weight:780; padding:13px 13px; }
.app-shell tbody td,.app-shell tbody th[scope=row] { border-bottom:1px solid rgba(130,176,164,.12); padding:12px 13px; }
.app-shell tbody tr:nth-child(even) td { background:rgba(66,103,96,.085); }
.app-shell tbody tr:hover td,.app-shell tbody tr:hover th[scope=row] { background-color:rgba(42,114,91,.20); }
.app-shell tbody tr:last-child td { border-bottom-color:transparent; }
.app-shell tfoot th,.app-shell tfoot td { background:#153c33; color:#e7fff3; border-top:1px solid rgba(95,220,145,.3); }
/* Tabelas de lançamento: preservar largura e horários/editabilidade. */
.app-shell .win-day-table input.win-hour,.app-shell .win-day-table input.win-number { padding:7px 8px; min-height:35px; border-radius:7px; }
.app-shell .win-day-table td,.app-shell .manage-scroll td { padding:8px 7px; }
.app-shell .win-table input[type=time] { min-width:90px; }
/* Funcionários — listagem e cadastro separado. */
.employee-hero,.employee-form-intro { border-radius:16px; background:radial-gradient(circle at right top,rgba(33,179,103,.14),transparent 50%),linear-gradient(135deg,#193a36,#142f31); border-color:rgba(87,210,142,.33); }
.employee-form-toolbar { margin-bottom:18px; }
.win-person-header { border-radius:12px; padding-block:13px; }
.win-person-header > span { border-radius:10px; }
.employee-personal-details { background:rgba(16,45,43,.66); border:1px solid rgba(102,178,150,.25); border-radius:13px; overflow:hidden; }
.employee-personal-details summary { padding:16px; }
.employee-section-grid { gap:16px; }
.employee-section-grid label { font-size:12px; color:#cce7da; }
.employee-section-grid label small { line-height:1.55; }
/* Painel: três visões distintas, destaque no período ativo. */
.report-overview { background:radial-gradient(circle at 92% 4%,rgba(51,183,108,.15),transparent 43%),linear-gradient(150deg,#183831,#122c30); }
.report-tabs { border-radius:13px; gap:10px; }
.report-tab { border:1px solid rgba(95,171,148,.27); background:rgba(13,42,45,.72); transition:background .18s,border-color .18s,box-shadow .18s; }
.report-tab:hover { background:rgba(33,105,81,.45); border-color:rgba(118,232,168,.46); }
.report-tab.is-active { background:linear-gradient(135deg,#186c4e,#174f43); border-color:rgba(107,238,160,.66); box-shadow:inset 0 2px 0 rgba(167,255,201,.10),0 8px 20px rgba(3,37,23,.14); }
.report-filters { border-color:rgba(108,185,157,.2); border-radius:13px; }
.presence-card { border-radius:16px; }
.presence-card strong { font-size:clamp(26px,3vw,36px); }
.report-kpi,.report-month-hero-card,.report-calendar-panel,.report-week-chart,.report-month-week-chart { border-radius:15px; border-color:rgba(104,183,155,.25); }
/* Relatórios, comparação e evolução: priorizar números e gráficos. */
.team-compare-header,.team-trend-heading { gap:18px; }
.team-compare-summary > *, .team-compare-summary .team-compare-kpi { border-radius:14px; }
.team-compare-table tbody tr,.team-trend-table tbody tr { transition:background .15s; }
.team-compare-metric { border-radius:8px; }
.team-compare-rate strong { color:#ebfff0; }
.team-compare-toolbar { background:rgba(11,36,38,.42); border:1px solid rgba(98,172,153,.18); border-radius:13px; padding:13px; }
.team-compare-export { white-space:nowrap; }
.team-trend-delta { border-radius:8px; }
/* Avisos e estados. */
.panel-note { background:rgba(49,149,102,.085); border-left-color:#5dde9f; }
.alert-success { background:#173d30; border-color:#397956; }
.alert-warning { background:#493228; border-color:#8d6744; color:#ffebd8; }
.empty,.team-trend-empty,.team-compare-no-results { color:#a7c1b8; }
.win-dialog,.presence-dialog { background:#122b2f; color:var(--ui-text); border:1px solid rgba(120,194,160,.4); border-radius:20px; box-shadow:0 30px 100px rgba(0,0,0,.62); }
.win-dialog::backdrop,.presence-dialog::backdrop { background:rgba(1,12,15,.77); backdrop-filter:blur(6px); }
.win-dialog-head,.win-dialog-footer,.presence-dialog-header,.presence-dialog-footer { background:#1a3637; border-color:rgba(137,196,170,.18); }
.win-dialog-body,.presence-dialog-body { background:#11282e; }
/* Login coerente com o novo shell. */
body:has(.login-shell) { background:radial-gradient(circle at 90% 10%,rgba(30,169,105,.20),transparent 45%),radial-gradient(circle at 12% 88%,rgba(34,123,95,.16),transparent 46%),#071619; }
.login-shell { border:1px solid rgba(97,208,147,.38); border-radius:24px; background:#11292c; box-shadow:0 30px 100px rgba(0,0,0,.38); }
.login-left { background:linear-gradient(150deg,#173033,#102528); }
.login-left h1 { color:#f4fff9; }
.login-left input:not([type=checkbox]) { background:#0a2025; border:1px solid #3a6760; color:#eafbf2; border-radius:11px; }
.login-left input:focus { outline:0; border-color:#6aecae; box-shadow:var(--soro-ring); }
.login-right { background:radial-gradient(circle at 50% 35%,#246f4d,#153a34 48%,#0b262b); border-left-color:rgba(110,194,150,.26); }
.login-right img { filter:drop-shadow(0 20px 29px rgba(0,0,0,.26)); }
/* Notebooks e celulares: preservar filtros, tabelas e visibilidade do menu. */
@media(max-width:1350px){
  .sidebar { width:238px; min-width:238px; }
  .topbar { gap:13px; }
  .module-search-bar { max-width:320px; }
}
@media(max-width:1050px){
  .sidebar { width:222px; min-width:222px; }
  .mode-flag { display:none; }
  .content { padding-inline:21px; }
}
@media(max-width:800px){
  .sidebar { width:min(286px,88vw); min-width:0; }
  .topbar { height:66px; gap:10px; padding-inline:15px; }
  .content { padding:22px 16px 36px; }
  .page-version { max-width:100%; padding:6px 9px; }
  .panel,.quick-actions { padding:18px; }
  .app-shell .team-compare-toolbar { padding:11px; }
}
@media(max-width:560px){
  .page-title h1 { font-size:24px; }
  .topbar-context { min-width:0; }
  .module-search-bar { min-width:36px; }
  .brand strong { font-size:14px; }
  .panel,.quick-actions { padding:16px; }
  .stats-grid { gap:10px; }
  .stat { min-height:128px; padding:14px; }
  .app-shell thead th { padding:11px 9px; }
  .app-shell tbody td { padding:10px 9px; }
  .app-shell .green-button { white-space:normal; }
}
@media(prefers-reduced-motion:reduce){
  .app-shell *, .login-shell * { scroll-behavior:auto!important; animation-duration:.01ms!important; transition-duration:.01ms!important; }
}
@media print {
  :root { color-scheme:light; }
  body,.main-shell,.content { background:#fff!important; color:#111!important; }
  .panel,.stat,.team-trend-section,.team-compare-section,.team-compare-main { background:#fff!important; color:#111!important; box-shadow:none!important; }
  .app-shell :is(table, th, td) { color:#111!important; background:#fff!important; border-color:#ccc!important; }
  .app-shell thead th,.app-shell tfoot td,.app-shell tfoot th { background:#eee!important; color:#111!important; }
  .sidebar,.topbar,.footnote { display:none!important; }
}