@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined');

/* =====================================================================
   Acesso TS — tela de LOGIN (design Stitch "premium": dark + azul
   COMPEL + glass + Inter). Injetado via Nginx. Escopo só no login.
   ===================================================================== */

/* Fundo mesh escuro */
.login-ui, .login-dialog-middle, body.login {
  background-color: #0b1326 !important;
  background-image:
    radial-gradient(at 0% 0%, rgba(63,111,176,.14) 0, transparent 50%),
    radial-gradient(at 100% 100%, rgba(31,78,140,.09) 0, transparent 50%) !important;
}
.login-ui * { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* Cartão glass */
.login-ui .login-dialog {
  background: rgba(23,31,51,.6) !important;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(139,148,125,.2) !important;
  border-radius: .75rem !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.37), inset 0 1px 0 rgba(255,255,255,.05) !important;
  width: 400px; max-width: 92vw;
  padding: 34px 32px !important;
  position: relative; overflow: hidden;
  color: #dae2fd !important;
}
.login-ui .login-dialog::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(91,155,224,.55), transparent);
}

/* Logo branco da COMPEL (no lugar do logo abacate) */
.login-ui .login-form .logo {
  width: 100% !important; height: 52px !important;
  margin: 0 auto 22px !important;
  background: url('/brand/logo-dark.png') center / contain no-repeat !important;
  border: none !important; border-radius: 0 !important;
}
.login-ui .login-form .logo::after { content: none !important; }

/* Título + subtítulo */
.login-ui .login-form .version { text-align: center; margin-bottom: 26px; }
/* esconde o texto original ("Apache Guacamole") e injeta a marca ARC */
.login-ui .login-form .app-name {
  font-size: 0 !important; line-height: 0; letter-spacing: 0;
}
.login-ui .login-form .app-name::before {
  content: 'A.R.C. - ACESSO REMOTO COMPEL';
  display: block; font-size: 16px; font-weight: 700; letter-spacing: .01em;
  color: #dae2fd; line-height: 1.2; white-space: nowrap;
}
.login-ui .login-form .app-name::after {
  content: 'GATEWAY CORPORATIVO DE ACESSO REMOTO';
  display: block; margin-top: 8px;
  font-size: 11px; font-weight: 600; letter-spacing: .09em;
  color: rgba(193,202,176,.8); text-transform: uppercase;
}
/* "1.6.0" é fixado no rodapé pelo Guacamole — ocultar */
.login-ui .login-form .version-number { display: none !important; }

/* Assinatura no rodapé da página (injetada via JS) */
#acessots-footer {
  position: fixed; left: 0; right: 0; bottom: 20px;
  text-align: center; z-index: 9999; pointer-events: none;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 12px; font-weight: 500; letter-spacing: .04em;
  color: rgba(193,202,176,.6);
}

/* Campos */
.login-ui .login-form .login-fields { display: flex; flex-direction: column; gap: 16px; }
.login-ui .login-form label,
.login-ui .login-form .field-header {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.login-ui .login-form input[type=text],
.login-ui .login-form input[type=password] {
  width: 100%; box-sizing: border-box;
  background-color: rgba(45,52,73,.5) !important;
  background-repeat: no-repeat !important;
  background-position: 14px center !important;
  background-size: 20px 20px !important;
  border: 1px solid rgba(66,73,54,.5) !important;
  border-radius: .5rem !important;
  color: #dae2fd !important;
  padding: 14px 16px 14px 44px !important;
  font-size: 16px !important;
  transition: all .2s ease;
}
.login-ui .login-form input[type=text] {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23c1cab0'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='8'%20r='4'/%3E%3Cpath%20d='M4%2021c0-4%204-6%208-6s8%202%208%206'/%3E%3C/svg%3E") !important;
}
.login-ui .login-form input[type=password] {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23c1cab0'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4'%20y='11'%20width='16'%20height='9'%20rx='2'/%3E%3Cpath%20d='M8%2011V8a4%204%200%200%201%208%200v3'/%3E%3C/svg%3E") !important;
}
.login-ui .login-form input[type=text]::placeholder,
.login-ui .login-form input[type=password]::placeholder { color: rgba(193,202,176,.4); }
.login-ui .login-form input[type=text]:hover,
.login-ui .login-form input[type=password]:hover { background-color: rgba(45,52,73,.6) !important; }
.login-ui .login-form input[type=text]:focus,
.login-ui .login-form input[type=password]:focus {
  outline: none !important;
  border-color: #5B9BE0 !important;
  background-color: rgba(45,52,73,.8) !important;
  box-shadow: 0 0 0 2px rgba(91,155,224,.5), inset 0 1px 2px rgba(0,0,0,.2) !important;
}

/* Botão de espiar senha (toggle nativo do Guacamole) */
.login-ui .login-form .password-field { position: relative; }
.login-ui .login-form .password-field input { padding-right: 46px !important; }
.login-ui .login-form .password-field .toggle-password {
  display: flex !important; align-items: center; justify-content: center;
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border-radius: 6px; cursor: pointer; z-index: 3;
  background: none !important; text-indent: 0 !important;
  color: rgba(193,202,176,.7); transition: all .15s;
}
.login-ui .login-form .password-field .toggle-password:hover {
  color: #5B9BE0; background: rgba(91,155,224,.12) !important;
}
.login-ui .login-form .password-field .toggle-password::before {
  content: 'visibility'; font-family: 'Material Symbols Outlined'; font-size: 20px;
}
/* senha revelada (input vira type=text) → ícone de olho fechado */
.login-ui .login-form .password-field input[type=text] ~ .toggle-password::before { content: 'visibility_off'; }

/* Botão Entrar */
.login-ui .login-form .buttons { margin-top: 28px; display: flex; flex-direction: column; }
.login-ui .login-form input.login,
.login-ui .login-form .buttons input[type=submit] {
  width: 100%; box-sizing: border-box;
  background: #5B9BE0 !important; color: #0E2747 !important;
  border: none !important; border-radius: .5rem !important;
  padding: 14px !important; font-size: 16px !important; font-weight: 600 !important;
  cursor: pointer; text-shadow: none !important;
  box-shadow: 0 0 15px rgba(91,155,224,.3) !important;
  transition: all .25s ease;
}
.login-ui .login-form input.login:hover,
.login-ui .login-form .buttons input[type=submit]:hover {
  background: #7DB0E8 !important;
  box-shadow: 0 0 25px rgba(91,155,224,.5) !important;
  transform: translateY(-1px);
}

/* Selo "Conexão Segura" */
.login-ui .login-form .buttons::after {
  content: 'CONEXÃO SEGURA';
  display: block; text-align: center;
  margin-top: 22px; padding-top: 16px;
  border-top: 1px solid rgba(66,73,54,.25);
  font-size: 11px; font-weight: 600; letter-spacing: .12em;
  color: rgba(193,202,176,.6);
}

/* Notificação de erro (Autenticação Inválida) */
.login-ui .login-dialog.error,
.login-ui .notification.error,
.login-ui .status-bar .error { color: #ffb4ab !important; }

/* Sinc: o teto de 1720x1361 agora é nativo (width/height + resize Nenhum na
   conexão), não depende mais de CSS. */

/* Dica de arquivos: fixa no topo, transparente (legível) e sem bloquear a sessão.
   Aparece por completo ao aproximar o mouse do topo (classe .show via JS). */
.arc-filehint {
  position: fixed; top: 8px; left: 50%;
  transform: translateX(-50%) translateY(-4px);
  z-index: 6000; pointer-events: none; max-width: 92vw; white-space: nowrap;
  background: rgba(23,31,51,.85); color: #dae2fd;
  border: 1px solid rgba(91,155,224,.30); border-radius: 10px;
  padding: 8px 16px; font-family: 'Inter', system-ui, sans-serif; font-size: 13px;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  opacity: .03; transition: opacity .35s ease, transform .35s ease;
}
.arc-filehint.show { opacity: 1; transform: translateX(-50%) translateY(0); }
/* botão de tela cheia dentro da dica — clicável só quando a dica está revelada */
.arc-filehint .arc-fs-btn {
  margin-left: 14px; padding: 4px 11px; border-radius: 6px;
  border: 1px solid rgba(91,155,224,.55); background: rgba(91,155,224,.18);
  color: #dae2fd; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
  pointer-events: none; vertical-align: middle;
}
.arc-filehint.show .arc-fs-btn { pointer-events: auto; }
.arc-filehint .arc-fs-btn:hover { background: rgba(91,155,224,.38); }

/* Botão "Abrir no Windows" (mstsc nativo) nos cards do dashboard */
.ad-card .ad-meta { display: flex; align-items: center; gap: 8px; }
.ad-card .ad-native {
  margin-left: auto; padding: 3px 9px; border-radius: 6px;
  border: 1px solid rgba(91,155,224,.45); background: rgba(91,155,224,.14);
  color: #dae2fd; font: inherit; font-size: 11px; font-weight: 600; cursor: pointer;
  white-space: nowrap;
}
.ad-card .ad-native:hover { background: rgba(91,155,224,.35); }
.arc-filehint b { color: #5B9BE0; font-weight: 600; }
.arc-filehint kbd {
  background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.22);
  border-radius: 4px; padding: 1px 6px; margin: 0 1px;
  font-family: 'JetBrains Mono', monospace; font-size: 12px;
}

/* Badge de validade de certificado no cabeçalho de Configurações */
.arc-cert-badge {
  align-self: center; margin-left: auto; margin-right: 16px;
  font-family: 'Inter', system-ui, sans-serif; font-size: 12px; font-weight: 600;
  padding: 5px 12px; border-radius: 999px; border: 1px solid; white-space: nowrap;
}
.arc-cert-badge::before {
  font-family: 'Material Symbols Outlined'; content: 'verified_user';
  font-size: 15px; vertical-align: -3px; margin-right: 6px;
}
.arc-cert-badge.ok   { color: #5B9BE0; background: rgba(91,155,224,.12); border-color: rgba(91,155,224,.30); }
.arc-cert-badge.warn { color: #D9A94C; background: rgba(217,169,76,.12); border-color: rgba(217,169,76,.35); }
.arc-cert-badge.crit { color: #ffb4ab; background: rgba(169,59,42,.15);  border-color: rgba(169,59,42,.40); }

/* =====================================================================
   Editores (.manage-connection/.manage-user/.manage-user-group) e árvore
   de conexões — texto claro sobre fundo escuro (mesmo tema COMPEL).
   ===================================================================== */
.manage-connection, .manage-user, .manage-user-group {
  background-color: #0b1326 !important; color: #dae2fd !important; min-height: 100vh;
}
.manage-connection, .manage-connection *,
.manage-user, .manage-user *,
.manage-user-group, .manage-user-group * { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* Cabeçalho do editor */
.manage-connection > .header, .manage-user > .header, .manage-user-group > .header {
  background: rgba(23,31,51,.6) !important; border: none !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  padding: 0 24px !important; min-height: 64px;
  display: flex; align-items: center; justify-content: space-between;
}
.manage-connection h1, .manage-connection h2, .manage-connection h3, .manage-connection h4,
.manage-user h1, .manage-user h2, .manage-user h3, .manage-user h4,
.manage-user-group h1, .manage-user-group h2, .manage-user-group h3, .manage-user-group h4 {
  color: #dae2fd !important;
}
.manage-connection .header h2, .manage-user .header h2, .manage-user-group .header h2 {
  font-size: 18px !important; font-weight: 600 !important; letter-spacing: .04em;
}

/* Menu do usuário no topo do editor */
.manage-connection .user-menu, .manage-connection .menu-title,
.manage-user .user-menu, .manage-user .menu-title,
.manage-user-group .user-menu, .manage-user-group .menu-title { color: #dae2fd !important; }

/* Seções e rótulos */
.manage-connection .section, .manage-user .section, .manage-user-group .section { color: #dae2fd; }
.manage-connection label, .manage-user label, .manage-user-group label,
.manage-connection .field-header, .manage-user .field-header, .manage-user-group .field-header,
.manage-connection legend, .manage-user legend { color: #dae2fd !important; }

/* Tabela de propriedades: th = rótulo, td = valor */
.manage-connection table.properties th, .manage-user table.properties th, .manage-user-group table.properties th {
  color: #c1cab0 !important; background: transparent !important;
  text-align: left; font-weight: 600; padding: 9px 12px; vertical-align: top;
}
.manage-connection table.properties td, .manage-user table.properties td, .manage-user-group table.properties td {
  color: #dae2fd !important; padding: 7px 12px;
}
.manage-connection table.properties, .manage-user table.properties { border-collapse: collapse; }

/* Campos */
.manage-connection input[type=text], .manage-connection input[type=password],
.manage-connection input[type=number], .manage-connection input[type=email],
.manage-connection select, .manage-connection textarea,
.manage-user input[type=text], .manage-user input[type=password], .manage-user select, .manage-user textarea,
.manage-user-group input[type=text], .manage-user-group select {
  background: rgba(0,0,0,.28) !important; border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 6px !important; color: #dae2fd !important; padding: 7px 10px !important;
}
.manage-connection input:focus, .manage-connection select:focus, .manage-connection textarea:focus,
.manage-user input:focus, .manage-user select:focus {
  outline: none !important; border-color: rgba(91,155,224,.5) !important;
  box-shadow: 0 0 0 2px rgba(91,155,224,.2) !important;
}
.manage-connection select option, .manage-user select option { background: #171f33; color: #dae2fd; }

/* Botões do editor */
.manage-connection button, .manage-user button, .manage-user-group button,
.manage-connection .button, .manage-user .button, .manage-user-group .button {
  background: #5B9BE0 !important; color: #0E2747 !important; border: none !important;
  border-radius: 8px !important; padding: 9px 18px !important; font-weight: 600 !important;
  text-shadow: none !important; cursor: pointer;
}
.manage-connection button:hover, .manage-user button:hover { background: #7DB0E8 !important; }
.manage-connection button.danger, .manage-user button.danger, .manage-user-group button.danger {
  background: rgba(169,59,42,.16) !important; color: #ffb4ab !important; border: 1px solid rgba(169,59,42,.4) !important;
}
.manage-connection a, .manage-user a, .manage-user-group a { color: #5B9BE0 !important; }

/* Árvore de conexões dentro de Configurações (aba Conexões) */
.settings-view .name, .settings-view .connection, .settings-view .connection-group,
.settings-view a.home-connection, .settings-view a.home-connection-group,
.settings-view .list-item { color: #dae2fd !important; }
.settings-view .connection-group .name { color: #5B9BE0 !important; font-weight: 600; }

/* Seleção/hover de itens da árvore — azul suave (o realce verde/claro padrão era agressivo) */
.settings-view .list-item.selected .caption,
.settings-view .list-item.selected > .connection > .caption,
.settings-view .list-item.selected > .connection-group > .caption {
  background: rgba(91,155,224,.16) !important;
}
.settings-view .list-item:not(.selected) .caption:hover {
  background: rgba(91,155,224,.08) !important;
}

/* Ícones da árvore (monitor/pasta/expandir) e do editor — clareados */
.settings-view .list-item .icon,
.manage-connection .icon, .manage-user .icon, .manage-user-group .icon {
  filter: brightness(0) invert(0.8) !important;
}

/* Abas de Configurações — seleção e hover suaves (tirar o realce claro agressivo) */
.settings-view .page-tabs a, .settings-view .page-tabs li,
.settings-view .page-list-level li, .settings-view .page-list-level li a {
  background: transparent !important;
}
.settings-view .page-tabs li:hover, .settings-view .page-tabs a:hover,
.settings-view .page-list-level li:hover, .settings-view .page-list-level li a:hover {
  background: rgba(91,155,224,.10) !important; color: #dae2fd !important;
}
.settings-view .page-tabs a:focus, .settings-view .page-list-level li a:focus,
.settings-view .page-list-level li:focus { outline: none !important; }
.settings-view .page-tabs li.current, .settings-view .page-tabs a.current,
.settings-view .page-list-level li.current, .settings-view .page-list-level li.current a,
.settings-view .page-list-level li a.current {
  background: rgba(91,155,224,.08) !important;
  color: #5B9BE0 !important;
  border-bottom: 2px solid #5B9BE0 !important;
  font-weight: 600 !important;
}


/* =====================================================================
   DASHBOARD — layout Stitch (topnav + sidebar + grade de cards) montado
   em overlay via dashboard.js sobre a home real. Azul COMPEL, dado real.
   ponytail: reconstrói a home; revisar num upgrade major do Guacamole.
   ===================================================================== */
/* esconde a home nativa DE IMEDIATO (fundo dark), evitando o flash do visual
   antigo antes do overlay montar. O overlay é desenhado por cima. */
.home-view { background-color: #0b1326 !important; min-height: 100vh; }
.home-view .connection-list-ui { visibility: hidden !important; }

#acessots-dash {
  position: fixed; inset: 0; z-index: 5000; overflow: hidden;
  display: flex; flex-direction: column;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color: #dae2fd;
  background-color: #0b1326;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(63,111,176,.10), transparent 30%),
    radial-gradient(circle at 85% 55%, rgba(31,78,140,.08), transparent 30%);
}
#acessots-dash * { box-sizing: border-box; }

/* Top nav */
#acessots-dash .ad-topnav {
  height: 64px; flex: none; display: flex; align-items: center;
  justify-content: space-between; padding: 0 24px;
  background: rgba(23,31,51,.6); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
#acessots-dash .ad-brand { display: flex; align-items: center; }
#acessots-dash .ad-brand img { height: 28px; display: block; }
#acessots-dash .ad-tabs { display: flex; gap: 8px; }
#acessots-dash .ad-tabs a {
  color: #c1cab0; font-size: 14px; font-weight: 500; text-decoration: none;
  padding: 6px 12px; border-radius: 8px; transition: all .2s;
}
#acessots-dash .ad-tabs a:hover { color: #dae2fd; background: rgba(255,255,255,.05); }
#acessots-dash .ad-tabs a.active { color: #5B9BE0; background: rgba(91,155,224,.08); border-bottom: 2px solid #5B9BE0; border-radius: 6px 6px 0 0; }
#acessots-dash .ad-actions { display: flex; align-items: center; gap: 14px; }
#acessots-dash .ad-actions .ad-icon { color: #c1cab0; cursor: pointer; font-size: 22px; }
#acessots-dash .ad-actions .ad-icon:hover { color: #dae2fd; }
#acessots-dash .ad-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: #1F4E8C; color: #fff; display: flex; align-items: center; justify-content: center;
  font-weight: 600; font-size: 14px; text-transform: uppercase; cursor: pointer;
  border: 2px solid rgba(91,155,224,.4);
}

/* Corpo */
#acessots-dash .ad-body { flex: 1; display: flex; min-height: 0; }

/* Sidebar */
#acessots-dash .ad-sidebar {
  width: 272px; flex: none; padding: 22px 14px; overflow-y: auto;
  background: rgba(23,31,51,.5); border-right: 1px solid rgba(255,255,255,.06);
  display: flex; flex-direction: column; gap: 6px;
}
#acessots-dash .ad-side-brand {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px 12px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.05);
  border-radius: 12px; margin-bottom: 8px;
}
#acessots-dash .ad-side-brand .ad-side-logo { height: 30px; max-width: 100%; display: block; }
#acessots-dash .ad-side-brand small { font-size: 11px; color: #c1cab0; letter-spacing: .1em; }
#acessots-dash .ad-newconn {
  width: 100%; margin-bottom: 12px; padding: 12px; border: none; cursor: pointer;
  background: #5B9BE0; color: #0E2747; font-weight: 700; font-size: 14px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center; gap: 8px; transition: all .2s;
}
#acessots-dash .ad-newconn:hover { background: #7DB0E8; transform: translateY(-1px); }
#acessots-dash .ad-newconn span { font-family: 'Material Symbols Outlined'; font-size: 20px; }
#acessots-dash .ad-nav { display: flex; flex-direction: column; gap: 4px; }
#acessots-dash .ad-nav a {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px;
  color: #c1cab0; font-size: 15px; font-weight: 500; text-decoration: none; cursor: pointer; transition: all .2s;
}
#acessots-dash .ad-nav a span { font-family: 'Material Symbols Outlined'; font-size: 20px; }
#acessots-dash .ad-nav a:hover { color: #dae2fd; background: rgba(255,255,255,.05); }
#acessots-dash .ad-nav a.active {
  color: #5B9BE0; background: rgba(91,155,224,.10);
  border: 1px solid rgba(91,155,224,.2); font-weight: 600;
}
#acessots-dash .ad-side-foot { margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.06); }
#acessots-dash .ad-side-foot div { display: flex; align-items: center; gap: 10px; padding: 8px 14px; color: rgba(193,202,176,.7); font-size: 13px; }
#acessots-dash .ad-side-foot span { font-family: 'Material Symbols Outlined'; font-size: 18px; }

/* Main */
#acessots-dash .ad-main { flex: 1; overflow-y: auto; padding: 28px 32px; }
#acessots-dash .ad-main-head {
  display: flex; justify-content: space-between; align-items: center; gap: 24px;
  flex-wrap: wrap; margin-bottom: 28px;
  background: rgba(23,31,51,.5); border: 1px solid rgba(255,255,255,.05);
  border-radius: 16px; padding: 22px 24px;
}
#acessots-dash .ad-main-head h1 { margin: 0 0 4px; font-size: 30px; font-weight: 700; color: #dae2fd; letter-spacing: -.02em; }
#acessots-dash .ad-main-head p { margin: 0; color: #c1cab0; font-size: 15px; }
#acessots-dash .ad-search { position: relative; min-width: 300px; flex: 1; max-width: 420px; }
#acessots-dash .ad-search span {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  font-family: 'Material Symbols Outlined'; color: rgba(193,202,176,.7); font-size: 20px;
}
#acessots-dash .ad-search input {
  width: 100%; background: rgba(0,0,0,.25); border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px; padding: 12px 14px 12px 44px; color: #dae2fd; font-size: 14px;
  font-family: 'Inter', sans-serif;
}
#acessots-dash .ad-search input:focus { outline: none; border-color: rgba(91,155,224,.5); box-shadow: 0 0 0 2px rgba(91,155,224,.2); }
#acessots-dash .ad-search input::placeholder { color: rgba(193,202,176,.4); }

/* Seções de grupo */
#acessots-dash .ad-group { margin-bottom: 40px; }
#acessots-dash .ad-group-head {
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.06); padding-bottom: 12px; margin-bottom: 20px;
}
#acessots-dash .ad-group-head h3 {
  margin: 0; display: flex; align-items: center; gap: 10px;
  font-size: 18px; font-weight: 600; color: #dae2fd;
}
#acessots-dash .ad-group-head h3 span { font-family: 'Material Symbols Outlined'; color: #5B9BE0; font-size: 22px; }
#acessots-dash .ad-group-count {
  font-size: 12px; font-weight: 500; color: #c1cab0;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.05);
  border-radius: 999px; padding: 4px 10px;
}
#acessots-dash .ad-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 22px; }

/* Cards */
#acessots-dash .ad-card {
  display: block; text-decoration: none; border-radius: 16px; overflow: hidden;
  background: rgba(23,31,51,.45); border: 1px solid rgba(255,255,255,.05);
  transition: all .28s ease; cursor: pointer;
}
#acessots-dash .ad-card:hover { border-color: rgba(91,155,224,.5); box-shadow: 0 12px 34px rgba(0,0,0,.45); transform: translateY(-3px); }
#acessots-dash .ad-card.active { border-color: rgba(91,155,224,.6); box-shadow: 0 0 0 1px rgba(91,155,224,.4); }
#acessots-dash .ad-thumb {
  height: 140px; position: relative; overflow: hidden;
  background: linear-gradient(135deg, #131b2e, #1c2740);
  display: flex; align-items: center; justify-content: center;
}
#acessots-dash .ad-thumb img { width: 100%; height: 100%; object-fit: cover; }
#acessots-dash .ad-thumb .ad-thumb-ph { font-family: 'Material Symbols Outlined'; font-size: 46px; color: rgba(91,155,224,.35); }
#acessots-dash .ad-badge {
  position: absolute; top: 12px; right: 12px; z-index: 2;
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 6px;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
#acessots-dash .ad-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
#acessots-dash .ad-badge.idle { color: #9cb0c8; background: rgba(0,0,0,.45); border: 1px solid rgba(255,255,255,.08); }
#acessots-dash .ad-badge.busy { color: #5B9BE0; background: rgba(91,155,224,.16); border: 1px solid rgba(91,155,224,.35); }
#acessots-dash .ad-badge.busy::before { box-shadow: 0 0 6px rgba(91,155,224,.8); animation: adpulse 1.6s infinite; }
@keyframes adpulse { 0%,100%{opacity:1} 50%{opacity:.4} }
#acessots-dash .ad-thumb .ad-mon {
  position: absolute; bottom: 12px; left: 12px; z-index: 2;
  background: rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px; padding: 6px; display: flex;
}
#acessots-dash .ad-thumb .ad-mon span { font-family: 'Material Symbols Outlined'; color: #5B9BE0; font-size: 20px; }
#acessots-dash .ad-card-body { padding: 14px 16px; }
#acessots-dash .ad-card-body .ad-name { font-size: 16px; font-weight: 600; color: #dae2fd; margin-bottom: 6px; }
#acessots-dash .ad-card-body .ad-meta { display: flex; align-items: center; gap: 8px; font-family: 'JetBrains Mono', monospace; font-size: 12px; color: rgba(193,202,176,.8); }
#acessots-dash .ad-card-body .ad-proto { background: rgba(91,155,224,.12); color: #5B9BE0; border: 1px solid rgba(91,155,224,.2); border-radius: 4px; padding: 1px 7px; }
#acessots-dash .ad-empty { color: #c1cab0; font-size: 14px; padding: 20px 0; }

/* Rodapé */
#acessots-dash .ad-foot {
  flex: none; height: 44px; display: flex; align-items: center; justify-content: center;
  background: rgba(23,31,51,.6); border-top: 1px solid rgba(255,255,255,.06);
  font-size: 12px; color: rgba(193,202,176,.6); letter-spacing: .04em;
}

@media (max-width: 820px) {
  #acessots-dash .ad-sidebar { display: none; }
  #acessots-dash .ad-tabs { display: none; }
}

/* Dropdown do avatar (topnav) */
#acessots-dash .ad-avatar { position: relative; }
#acessots-dash .ad-usermenu {
  position: absolute; top: 46px; right: 0; min-width: 170px; display: none;
  flex-direction: column; padding: 6px; z-index: 20;
  background: rgba(23,31,51,.98); border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px; box-shadow: 0 12px 34px rgba(0,0,0,.5);
}
#acessots-dash .ad-usermenu.open { display: flex; }
#acessots-dash .ad-usermenu a {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px;
  color: #dae2fd; font-size: 14px; font-weight: 500; text-decoration: none; text-transform: none; letter-spacing: 0;
}
#acessots-dash .ad-usermenu a:hover { background: rgba(91,155,224,.14); }
#acessots-dash .ad-usermenu a span { font-family: 'Material Symbols Outlined'; font-size: 18px; color: #5B9BE0; }


/* =====================================================================
   CONFIGURAÇÕES — mesma linguagem (dark + azul COMPEL + Inter).
   Escopo em .settings-view.
   ===================================================================== */
.settings-view {
  background-color: #0b1326 !important;
  background-image: radial-gradient(circle at 12% 12%, rgba(63,111,176,.08), transparent 30%) !important;
  color: #dae2fd !important; min-height: 100vh;
}
.settings-view, .settings-view * { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* Cabeçalho */
.settings-view .header.tabbed {
  background: rgba(23,31,51,.6) !important; border: none !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  padding: 0 24px !important; min-height: 64px;
  display: flex; align-items: center; justify-content: space-between;
}
.settings-view .header.tabbed h2 {
  color: #dae2fd !important; font-size: 18px !important; font-weight: 600 !important; letter-spacing: .04em;
}
.settings-view .user-menu, .settings-view .user-menu .menu-title { color: #dae2fd !important; }
.settings-view .user-menu .menu-contents {
  background: rgba(23,31,51,.98) !important; border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 10px !important; box-shadow: 0 12px 34px rgba(0,0,0,.5) !important;
}
.settings-view .user-menu .menu-contents a,
.settings-view .user-menu .menu-contents li,
.settings-view .user-menu .page-list * { color: #dae2fd !important; }
.settings-view .user-menu .menu-contents a:hover,
.settings-view .user-menu .menu-contents li:hover { background: rgba(91,155,224,.12) !important; }

/* Abas */
.settings-view .page-tabs {
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important; padding: 0 20px !important;
}
.settings-view .page-list-level { display: flex; flex-wrap: wrap; gap: 2px; list-style: none; margin: 0; padding: 0; }
.settings-view .page-list-level li { list-style: none; }
.settings-view .page-list-level li a,
.settings-view .page-list-level li > * {
  color: #c1cab0 !important; font-size: 14px !important; font-weight: 500 !important;
  padding: 13px 16px !important; display: inline-block; text-decoration: none;
  border-bottom: 2px solid transparent !important; transition: color .2s;
}
.settings-view .page-list-level li a:hover { color: #dae2fd !important; }
.settings-view .page-list-level li.current,
.settings-view .page-list-level li.current a,
.settings-view .page-list-level li a.current {
  color: #5B9BE0 !important; border-bottom-color: #5B9BE0 !important; font-weight: 600 !important;
}

/* Conteúdo da seção */
.settings-view .settings.section { padding: 26px 28px !important; }
.settings-view .settings.section > p, .settings-view p { color: #c1cab0 !important; line-height: 1.55; }
.settings-view .placeholder { color: rgba(193,202,176,.5) !important; }

/* Botões */
.settings-view button, .settings-view input[type=submit], .settings-view .button {
  background: #5B9BE0 !important; color: #0E2747 !important; border: none !important;
  border-radius: 8px !important; padding: 9px 18px !important; font-weight: 600 !important;
  font-size: 14px !important; cursor: pointer; box-shadow: none !important; text-shadow: none !important;
}
.settings-view button:hover, .settings-view input[type=submit]:hover { background: #7DB0E8 !important; }
.settings-view button.danger, .settings-view button.delete-sessions {
  background: rgba(169,59,42,.16) !important; color: #ffb4ab !important;
  border: 1px solid rgba(169,59,42,.4) !important;
}
.settings-view button.danger:hover { background: rgba(169,59,42,.30) !important; }
.settings-view button[disabled] { opacity: .4 !important; cursor: default; }

/* Campos / filtro */
.settings-view input[type=text], .settings-view input[type=password], .settings-view input[type=email],
.settings-view input[type=number], .settings-view input.search-string,
.settings-view select, .settings-view textarea {
  background: rgba(0,0,0,.25) !important; border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 8px !important; color: #dae2fd !important; padding: 9px 12px !important; font-size: 14px !important;
}
.settings-view input:focus, .settings-view select:focus, .settings-view textarea:focus {
  outline: none !important; border-color: rgba(91,155,224,.5) !important;
  box-shadow: 0 0 0 2px rgba(91,155,224,.2) !important;
}
.settings-view .filter input.search-string {
  padding-left: 38px !important; background-repeat: no-repeat !important;
  background-position: 13px center !important; background-size: 18px !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23c1cab0'%20stroke-width='2'%20stroke-linecap='round'%3E%3Ccircle%20cx='11'%20cy='11'%20r='7'/%3E%3Cpath%20d='M21%2021l-4.3-4.3'/%3E%3C/svg%3E") !important;
}

/* Tabelas */
.settings-view table.sorted, .settings-view .settings.section table {
  width: 100%; border-collapse: collapse; margin-top: 8px;
  background: rgba(23,31,51,.4) !important;
  border: 1px solid rgba(255,255,255,.06) !important; border-radius: 12px; overflow: hidden;
}
.settings-view table thead th, .settings-view table th {
  background: rgba(23,31,51,.75) !important; color: #c1cab0 !important;
  font-size: 12px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .05em;
  padding: 12px 14px !important; text-align: left; border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
.settings-view table th a { color: #c1cab0 !important; }
.settings-view table td {
  padding: 11px 14px !important; color: #dae2fd !important; font-size: 14px !important;
  border-bottom: 1px solid rgba(255,255,255,.05) !important;
}
.settings-view table tbody tr:hover { background: rgba(91,155,224,.06) !important; }
.settings-view table a { color: #5B9BE0 !important; }
.settings-view .action-buttons { display: flex; gap: 10px; margin: 14px 0; }