/* Tema FuturaNet (guia referencia/estilo-login-acs-futuranet.md) sobre a UI do GenieACS */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");
:root{
  --color1:rgba(92,145,218,.28);   /* bordas */
  --color2:#315077;
  --color3:#102746;                /* campos / hover */
  --color4:#38bdf8;                /* links / destaque */
  --color5:#f4f7ff;                /* texto */
  --disabled:#5d7090;
  --status-red:0 70% 35%; --status-green:150 60% 28%; --status-gray:215 20% 30%; --status-yellow:45 70% 32%;
  --bg-base:#050b19; --card:#081b39;
}
html,body,input,button,select,option,textarea{font-family:Inter,system-ui,sans-serif}
body{color:var(--color5);background:linear-gradient(rgba(5,11,25,.55),rgba(5,11,25,.75)),url('/acs-login-background.png') center bottom/cover fixed no-repeat,var(--bg-base)}
a:hover{color:#fff;background-color:#166bff}
h1{color:var(--color4)} h2,h3{color:var(--color5)}
#header{background:rgba(8,27,57,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--color1)}
#header>nav>ul>li{background:transparent;border-color:transparent}
#header>nav>ul>li.active,#header>nav>ul>li:hover{background:rgba(22,107,255,.22);border-color:var(--color1)}
#header>.drawer-wrapper>.drawer,#header>.drawer-wrapper>.notifications-wrapper>.notification,.autocomplete{background:rgba(8,27,57,.96);box-shadow:0 12px 40px rgba(0,0,0,.45)}
#side-menu>ul>li>a{background:rgba(8,27,57,.7);border:1px solid var(--color1);border-left:0}
#side-menu>ul>li>a:hover{background:#166bff;color:#fff}
#content,#content-wrapper>*{color:var(--color5)}
table.table th{color:#a4b4d0;border-bottom:2px solid #166bff}
table.table.highlight>tbody>tr:hover,.all-parameters>.parameter-list>table>tbody>tr:hover{background:rgba(22,107,255,.14)}
.CodeMirror,textarea,select,input{background:rgba(25,52,84,.72);color:var(--color5);border:1px solid rgba(130,165,210,.25);border-radius:10px;padding:6px 8px}
:is(.CodeMirror,textarea,select,input):focus,:is(.CodeMirror,textarea,select,input):hover{border-color:#38bdf8;box-shadow:0 0 0 3px rgba(56,189,248,.25);outline:0}
input[type=button],button{color:var(--color4);padding:6px 12px}
:is(input[type=button],button).primary{background:linear-gradient(105deg,#009ef7,#166bff);color:#fff;border:0;font-weight:700}
:is(input[type=button],button).critical{background:rgba(248,113,113,.12);color:#fca5a5;border-color:rgba(248,113,113,.4)}
:is(input[type=button],button):hover:enabled{background:#166bff;color:#fff;filter:brightness(1.1)}
.overlay-wrapper{background:rgba(5,11,25,.7);backdrop-filter:blur(4px)}
.overlay-wrapper>.overlay,.wizard-dialog{background:linear-gradient(145deg,rgba(9,28,58,.97),rgba(6,19,43,.98));border:1px solid rgba(92,145,218,.32);border-radius:20px;box-shadow:0 24px 70px rgba(0,0,0,.5),0 0 40px rgba(0,145,255,.08);color:var(--color5)}
.progress{background:rgba(255,255,255,.08)} .progress>.progress-bar{background:#00bfff}
.CodeMirror{background:#0a1a33;color:#e8edf7}
.CodeMirror-gutters{background:#071533;border-right-color:var(--color1)}

/* ===== Sidebar (igual ao ACS FuturaNet: 6rem, só ícones, item ativo azul) ===== */
#header{backdrop-filter:none;-webkit-backdrop-filter:none}
body{padding-left:6rem;box-sizing:border-box}
#header{position:fixed;left:0;top:0;bottom:0;width:6rem;z-index:20;display:flex;flex-direction:column;align-items:center;
  background:rgba(12,18,32,.96);border-bottom:0;border-right:1px solid rgba(255,255,255,.12)}
#header>.logo{display:flex;justify-content:center;padding:24px 12px}
#header>.logo>img{content:url('/acs-logo.png');width:66px;height:36px;margin:0;object-fit:contain}
#header>.logo>.version{display:none}
#header>nav{position:static;display:block;width:100%;padding:0 16px;box-sizing:border-box}
#header>nav>ul{display:block;margin:0;padding:0;list-style:none}
#header>nav>ul>li{display:block;margin:0 0 4px;background:transparent;border:0;border-radius:8px}
#header>nav>ul>li.active{background:rgba(59,130,246,.2)}
#header>nav>ul>li:hover{background:rgba(255,255,255,.05)}
#header>nav>ul>li.active:hover{background:rgba(59,130,246,.26)}
#header>nav>ul>li>a,#header>nav>ul>li>a:visited,#header>nav>ul>li>a:hover{display:flex;align-items:center;justify-content:center;
  min-width:0;height:44px;padding:0;color:#94a3b8;background:none;overflow:hidden;font-size:0;position:relative}
#header>nav>ul>li.active>a{color:#e8edf7}
#header>nav>ul>li>a::before{content:"";width:20px;height:20px;background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
#header>.user-menu{float:none;margin:auto 0 16px;padding:0 8px;text-align:center;color:#94a3b8;font-size:11px;word-break:break-all;width:100%;box-sizing:border-box}
#header>.user-menu button{display:block;margin:8px auto 0;border:1px solid rgba(255,255,255,.12);padding:6px 10px;font-size:12px}
#header>.drawer-wrapper{left:calc(50% + 3rem)}
@media (max-width:1023px){
  body{padding-left:0}
  #header{position:static;width:auto;flex-direction:row;flex-wrap:wrap;justify-content:space-between;border-right:0;border-bottom:1px solid rgba(255,255,255,.12)}
  #header>.logo{padding:8px 16px}
  #header>nav{width:auto;flex:1;padding:0 8px}
  #header>nav>ul{display:flex;gap:4px}
  #header>nav>ul>li{margin:0}
  #header>nav>ul>li>a,#header>nav>ul>li>a:visited,#header>nav>ul>li>a:hover{width:48px}
  #header>.user-menu{margin:0;width:auto;padding:8px 16px}
}
#header>nav>ul>li>a[href^="#!/overview"]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M15%2021v-8a1%201%200%200%200-1-1h-4a1%201%200%200%200-1%201v8%22%2F%3E%3Cpath%20d%3D%22M3%2010a2%202%200%200%201%20.709-1.528l7-5.999a2%202%200%200%201%202.582%200l7%205.999A2%202%200%200%201%2021%2010v9a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22%2F%3E%3C%2Fsvg%3E")}
#header>nav>ul>li>a[href^="#!/devices"]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20width%3D%2220%22%20height%3D%228%22%20x%3D%222%22%20y%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M6.01%2018H6%22%2F%3E%3Cpath%20d%3D%22M10.01%2018H10%22%2F%3E%3Cpath%20d%3D%22M15%2010v4%22%2F%3E%3Cpath%20d%3D%22M17.84%207.17a4%204%200%200%200-5.66%200%22%2F%3E%3Cpath%20d%3D%22M20.66%204a8%208%200%200%200-11.31%200%22%2F%3E%3C%2Fsvg%3E")}
#header>nav>ul>li>a[href^="#!/faults"]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m21.73%2018-8-14a2%202%200%200%200-3.48%200l-8%2014A2%202%200%200%200%204%2021h16a2%202%200%200%200%201.73-3%22%2F%3E%3Cpath%20d%3D%22M12%209v4%22%2F%3E%3Cpath%20d%3D%22M12%2017h.01%22%2F%3E%3C%2Fsvg%3E")}
#header>nav>ul>li>a[href^="#!/admin"]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9.671%204.136a2.34%202.34%200%200%201%204.659%200%202.34%202.34%200%200%200%203.319%201.915%202.34%202.34%200%200%201%202.33%204.033%202.34%202.34%200%200%200%200%203.831%202.34%202.34%200%200%201-2.33%204.033%202.34%202.34%200%200%200-3.319%201.915%202.34%202.34%200%200%201-4.659%200%202.34%202.34%200%200%200-3.32-1.915%202.34%202.34%200%200%201-2.33-4.033%202.34%202.34%200%200%200%200-3.831A2.34%202.34%200%200%201%206.35%206.051a2.34%202.34%200%200%200%203.319-1.915%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E")}
#header>.logo{order:1} #header>nav{order:2} #header>.user-menu{order:3;margin-top:auto}
@media (max-width:1023px){#header>.user-menu{margin-top:0}}

/* ===== Visão geral (acs-home.js) ===== */
#acs-home{display:none}
body.acs-home #acs-home{display:block;position:fixed;left:6rem;top:0;right:0;bottom:0;overflow:auto;padding:32px;box-sizing:border-box;z-index:5;background:rgba(5,11,25,.35)}
body.acs-home #content-wrapper{visibility:hidden}
@media (max-width:1023px){body.acs-home #acs-home{position:static;padding:16px}body.acs-home #content-wrapper{display:none}}
#acs-home .ah-title{font-size:30px;font-weight:600;color:#e8edf7;margin:0 0 24px;letter-spacing:-.01em}
#acs-home .ah-row2{display:grid;gap:24px;margin-bottom:24px}
@media (min-width:1024px){#acs-home .a{grid-template-columns:1.4fr 1fr}#acs-home .b{grid-template-columns:1fr 1.4fr}#acs-home .c{grid-template-columns:1fr 1fr}}
#acs-home .ah-panel{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:24px;background:rgba(8,27,57,.6);color:#e8edf7;min-width:0}
#acs-home .ah-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
#acs-home h2{font-size:20px;font-weight:600;margin:0;color:#e8edf7}
#acs-home h3{font-size:16px;font-weight:500;margin:24px 0 0;color:#e8edf7}
#acs-home .ah-chip{font-size:11px;color:#94a3b8;border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:2px 8px}
#acs-home .ah-muted{color:#94a3b8}
#acs-home .ah-danger{color:#f87171}#acs-home .ah-ok{color:#6ee7b7}
#acs-home .ah-strong{font-size:18px;font-weight:500;margin:20px 0 4px}
#acs-home .ah-text{max-width:70ch;line-height:1.6}
#acs-home .ah-grid2,#acs-home .ah-grid3{display:grid;gap:24px;margin-top:16px}
#acs-home .ah-grid2{grid-template-columns:1fr 1fr}#acs-home .ah-grid3{grid-template-columns:repeat(3,1fr)}
#acs-home .ah-big{font-size:48px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
#acs-home .ah-num{font-size:28px;font-weight:600;font-variant-numeric:tabular-nums}
#acs-home .ah-track{height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden;margin-top:6px}
#acs-home .ah-track.big{height:12px;margin:20px 0 12px}
#acs-home .ah-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#2563eb,#06b6d4)}
#acs-home .ah-bars{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:12px}
#acs-home .ah-row{display:flex;justify-content:space-between;gap:16px}
#acs-home .ah-tabs{display:inline-flex;margin:16px 0 8px;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:4px}
#acs-home .ah-tabs button{color:#94a3b8;padding:6px 16px;border-radius:6px;font-size:14px}
#acs-home .ah-tabs button.on{background:rgba(59,130,246,.2);color:#e8edf7}
#acs-home .ah-days{list-style:none;padding:0;margin:12px 0 0;display:grid;grid-template-columns:repeat(7,1fr);gap:8px;text-align:center;color:#94a3b8}
#acs-home .ah-days i{display:block;width:24px;height:4px;border-radius:99px;background:rgba(255,255,255,.2);margin:0 auto 8px}