:root {
  --pc-focus: #075dd8;
  --pc-text-muted: #53627a;
  --pc-danger: #b42318;
  --pc-success: #087a55;
  --pc-card-border: #d7e1ee;
}

:root[data-theme="dark"] {
  --pc-focus: #7dd3fc;
  --pc-text-muted: #c3d0e2;
  --pc-danger: #fda29b;
  --pc-success: #6ce9a6;
  --pc-card-border: #334967;
  color-scheme: dark;
}

/* Superfícies do painel no tema escuro. A prévia do portal é isolada em portal.css. */
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .table-wrap,
:root[data-theme="dark"] .notification-panel,
:root[data-theme="dark"] .modal-card {
  border-color: #2c405d;
  background-color: #111d31;
  box-shadow: 0 20px 54px rgba(0, 0, 0, .26);
}

:root[data-theme="dark"] button.ghost,
:root[data-theme="dark"] .button-link.ghost {
  border-color: #334967;
  color: #e8f2ff;
  background: #17263d;
}

:root[data-theme="dark"] button.ghost:hover,
:root[data-theme="dark"] .button-link.ghost:hover {
  border-color: #4c6689;
  color: #fff;
  background: #203451;
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
  caret-color: #7dd3fc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}

:root[data-theme="dark"] input:focus,
:root[data-theme="dark"] select:focus,
:root[data-theme="dark"] textarea:focus {
  border-color: #38bdf8;
  box-shadow: 0 0 0 3px rgba(56, 189, 248, .14);
}

/* Login coerente com o restante do painel quando o tema escuro está ativo. */
:root[data-theme="dark"] .login-shell {
  background:
    radial-gradient(circle at 18% 22%, rgba(56, 189, 248, .13), transparent 25vw),
    linear-gradient(115deg, #050b16 0 62%, #0d1a2d 62% 100%);
}

:root[data-theme="dark"] .login-panel {
  border-color: #304764;
  color: #edf5ff;
  background: rgba(13, 25, 43, .97);
  box-shadow: 0 30px 90px rgba(0, 0, 0, .48);
}

:root[data-theme="dark"] .login-panel .login-subtitle,
:root[data-theme="dark"] .login-panel label {
  color: #aebed3;
}

:root[data-theme="dark"] .login-panel .form-stack input {
  border-color: #38506f;
  color: #f2f7ff;
  background: #091526;
  -webkit-text-fill-color: #f2f7ff;
}

:root[data-theme="dark"] .login-panel .form-stack input::placeholder {
  color: #8192aa;
  -webkit-text-fill-color: #8192aa;
}

:root[data-theme="dark"] .login-panel .form-stack input:-webkit-autofill,
:root[data-theme="dark"] .login-panel .form-stack input:-webkit-autofill:hover,
:root[data-theme="dark"] .login-panel .form-stack input:-webkit-autofill:focus {
  border-color: #38506f;
  -webkit-text-fill-color: #f2f7ff !important;
  -webkit-box-shadow: 0 0 0 1000px #091526 inset !important;
  caret-color: #f2f7ff;
}

:root[data-theme="dark"] .login-panel .credit {
  border-color: #293d58;
  color: #aebed3;
  background: #0a1728;
}

:root[data-theme="dark"] .login-panel .credit a,
:root[data-theme="dark"] .login-panel .credit strong {
  color: #dce9f9;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--pc-focus) !important;
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  z-index: 10000;
  top: 12px;
  left: 12px;
  padding: 12px 16px;
  border-radius: 10px;
  color: #fff;
  background: #0b4db7;
  transform: translateY(-160%);
  transition: transform .15s ease;
}

.skip-link:focus { transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}