/* =========================================================
   SOFT ACS - DARK THEME
   GenieACS 1.2.16
   ========================================================= */

/* ---------- Base ---------- */

html,
body {
    background: #0d1117 !important;
    color: #e6edf3 !important;
}

body {
    min-height: 100vh;
}

/* ---------- Textos ---------- */

h1,
h2,
h3,
h4,
h5,
h6,
p,
label,
span,
strong,
small,
legend {
    color: #e6edf3;
}

a {
    color: #58a6ff !important;
}

a:hover {
    color: #79c0ff !important;
}

/* ---------- Área principal ---------- */

main,
.content,
.container,
.page,
section,
article {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
}

/* ---------- Cabeçalho GenieACS ---------- */

header {
    background: #161b22 !important;
    border-bottom: 1px solid #30363d !important;
    color: #e6edf3 !important;
}

/* Evita clarear o conteúdo principal */
body > div {
    border-color: #30363d;
}

/* ---------- Menu superior / abas ---------- */

nav {
    background: #161b22 !important;
    border-color: #30363d !important;
}

nav a,
.tabs a,
.tab {
    background: #161b22 !important;
    color: #c9d1d9 !important;
    border-color: #30363d !important;
}

nav a:hover,
.tabs a:hover,
.tab:hover {
    background: #21262d !important;
    color: #ffffff !important;
}

nav a.active,
.tabs .active,
.tab.active {
    background: #0d1117 !important;
    color: #58a6ff !important;
    border-bottom-color: #58a6ff !important;
}

/* ---------- Tabelas ---------- */

table {
    background: #161b22 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
}

thead,
thead tr,
th {
    background: #21262d !important;
    color: #f0f6fc !important;
    border-color: #30363d !important;
}

tbody,
tbody tr {
    background: #161b22 !important;
    color: #e6edf3 !important;
}

tbody tr:nth-child(even) {
    background: #181d23 !important;
}

tbody tr:hover {
    background: #262c36 !important;
}

td {
    color: #d0d7de !important;
    border-color: #30363d !important;
}

/* ---------- Inputs ---------- */

input,
textarea,
select {
    background: #0d1117 !important;
    color: #f0f6fc !important;
    border: 1px solid #30363d !important;
    border-radius: 4px;
}

input:focus,
textarea:focus,
select:focus {
    border-color: #58a6ff !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(88,166,255,.18) !important;
}

input::placeholder,
textarea::placeholder {
    color: #8b949e !important;
}

/* ---------- Botões ---------- */

button,
input[type="button"],
input[type="submit"] {
    background: #21262d !important;
    color: #f0f6fc !important;
    border: 1px solid #30363d !important;
    border-radius: 4px !important;
}

button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background: #30363d !important;
    border-color: #484f58 !important;
}

/* ---------- Blocos / painéis ---------- */

fieldset,
.panel,
.card,
.box,
.modal,
.dialog {
    background: #161b22 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
}

/* ---------- Dropdowns ---------- */

option {
    background: #161b22 !important;
    color: #f0f6fc !important;
}

/* ---------- Código / parâmetros ---------- */

pre,
code {
    background: #161b22 !important;
    color: #c9d1d9 !important;
    border-color: #30363d !important;
}

/* ---------- Separadores ---------- */

hr {
    border-color: #30363d !important;
}

/* ---------- Online / sucesso ---------- */

.success,
.online,
.status-online {
    color: #3fb950 !important;
}

/* ---------- Avisos ---------- */

.warning {
    color: #d29922 !important;
}

/* ---------- Erros ---------- */

.error,
.fault,
.status-offline {
    color: #f85149 !important;
}

/* ---------- Scrollbar ---------- */

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #0d1117;
}

::-webkit-scrollbar-thumb {
    background: #30363d;
    border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
    background: #484f58;
}

/* ---------- Seleção de texto ---------- */

::selection {
    background: #264f78;
    color: #ffffff;
}
/* =========================================================
   AJUSTES FINAIS - TOPO GENIEACS
   ========================================================= */

/* Barra superior inteira */
body > header,
header,
header > div {
    background: #161b22 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
}

/* Área do logo */
header img {
    background: transparent !important;
}

/* Links admin / logout */
header a,
header span {
    color: #e6edf3 !important;
}

header a:hover {
    color: #58a6ff !important;
}

/* Barra onde ficam Overview / Devices / Faults / Admin */
nav,
nav ul,
nav li {
    background: #161b22 !important;
}

/* Abas */
nav a {
    background: #161b22 !important;
    color: #c9d1d9 !important;
    border: 1px solid #30363d !important;
}

/* Hover das abas */
nav a:hover {
    background: #21262d !important;
    color: #ffffff !important;
}

/* Aba selecionada */
nav a.active,
nav .active a,
nav li.active a {
    background: #21262d !important;
    color: #58a6ff !important;
    border-bottom: 2px solid #58a6ff !important;
}

/* Fundo geral atrás do cabeçalho */
body > div:first-child {
    border-color: #30363d !important;
}

/* Títulos */
h1,
h2,
h3 {
    color: #f0f6fc !important;
}
/* =========================================================
   TOPO / HEADER FINAL
   ========================================================= */

/* força qualquer faixa superior clara para dark */
body > div:first-child,
body > div:first-child > div,
body > div:first-child > header,
body > div:first-child > nav {
    background: #161b22 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
}

/* área superior onde ficam logo e usuário */
header,
header *,
nav,
nav * {
    border-color: #30363d !important;
}

/* usuário admin e logout */
a[href*="logout"],
a[href*="login"],
header a {
    color: #e6edf3 !important;
}

/* melhora contraste do usuário */
header span,
header div {
    color: #e6edf3 !important;
}

/* =========================================================
   SOFT ACS - MODAIS / FORMULÁRIOS / POP-UPS
   ========================================================= */

/* Fundo dos modais e caixas flutuantes */
.modal,
.dialog,
.popup,
.overlay > div,
[role="dialog"],
body > div > div[style*="position"] {
    background: #161b22 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
}

/* Títulos dentro dos modais */
.modal h1,
.modal h2,
.modal h3,
.dialog h1,
.dialog h2,
.dialog h3,
[role="dialog"] h1,
[role="dialog"] h2,
[role="dialog"] h3 {
    color: #f0f6fc !important;
}

/* Labels */
.modal label,
.dialog label,
[role="dialog"] label {
    color: #c9d1d9 !important;
}

/* Inputs e textarea dentro dos pop-ups */
.modal input,
.modal textarea,
.modal select,
.dialog input,
.dialog textarea,
.dialog select,
[role="dialog"] input,
[role="dialog"] textarea,
[role="dialog"] select {
    background: #0d1117 !important;
    color: #f0f6fc !important;
    border: 1px solid #30363d !important;
}

/* Foco */
.modal input:focus,
.modal textarea:focus,
.dialog input:focus,
.dialog textarea:focus,
[role="dialog"] input:focus,
[role="dialog"] textarea:focus {
    border-color: #58a6ff !important;
    box-shadow: 0 0 0 2px rgba(88,166,255,.20) !important;
}

/* Botões principais dentro dos modais */
.modal button,
.dialog button,
[role="dialog"] button,
.modal input[type="submit"],
.dialog input[type="submit"],
[role="dialog"] input[type="submit"] {
    background: #238636 !important;
    color: #ffffff !important;
    border: 1px solid #2ea043 !important;
    border-radius: 4px !important;
    padding: 5px 10px !important;
}

/* Hover botão */
.modal button:hover,
.dialog button:hover,
[role="dialog"] button:hover,
.modal input[type="submit"]:hover,
.dialog input[type="submit"]:hover {
    background: #2ea043 !important;
}

/* Corrige especificamente caixas brancas genéricas do GenieACS */
body div[style*="background"],
body div[class*="modal"],
body div[class*="dialog"] {
    border-color: #30363d !important;
}

/* Sombras dos modais */
.modal,
.dialog,
[role="dialog"] {
    box-shadow: 0 12px 40px rgba(0,0,0,.65) !important;
}

/* Texto dos campos */
.modal *,
.dialog *,
[role="dialog"] * {
    border-color: #30363d;
}

/* Campos grandes de configuração */
textarea {
    background: #0d1117 !important;
    color: #e6edf3 !important;
    border: 1px solid #30363d !important;
}

/* Botões Salvar */
button[type="submit"],
input[type="submit"] {
    background: #238636 !important;
    color: #fff !important;
    border-color: #2ea043 !important;
}

/* Botões de fechar / cancelar */
button.close,
button.cancel,
.modal .close,
.dialog .close {
    background: #21262d !important;
    color: #c9d1d9 !important;
    border-color: #30363d !important;
}

/* Placeholder */
.modal ::placeholder,
.dialog ::placeholder,
[role="dialog"] ::placeholder {
    color: #8b949e !important;
}

/* Scroll dentro de modal */
.modal ::-webkit-scrollbar-track,
.dialog ::-webkit-scrollbar-track {
    background: #161b22;
}

.modal ::-webkit-scrollbar-thumb,
.dialog ::-webkit-scrollbar-thumb {
    background: #484f58;
}