/*
  Identidade visual ALJ.
  Reutilize este arquivo nos proximos sistemas para manter cabecalho,
  fundo e cores principais no mesmo padrao visual.
*/
:root {
  color-scheme: light;
  --alj-navy: #06365f;
  --alj-blue: #075889;
  --alj-cyan: #0786ad;
  --alj-mint: #34c7ba;
  --alj-soft-cyan: #45c7d8;
  --alj-page-bg:
    radial-gradient(circle at top left, rgba(69,199,216,.20), transparent 30%),
    linear-gradient(145deg, #f4fbff 0%, #f7fafc 45%, #eef7f5 100%);
  --alj-header-gradient: linear-gradient(118deg, #06365f 0%, #075889 48%, #0786ad 100%);
  --alj-header-shadow: 0 16px 32px rgba(6,54,95,.18);
  --alj-sidebar-bg: rgba(255,255,255,.88);
}

html {
  min-height: 100%;
  overflow-x: hidden;
  background: #eef7f5;
  color-scheme: light;
  scrollbar-color: #a9bdc9 #eef7f5;
  scrollbar-width: thin;
}

body {
  min-height: 100vh;
  overflow-x: hidden;
  background-color: #eef7f5;
  color-scheme: light;
  scrollbar-color: #a9bdc9 #eef7f5;
  scrollbar-width: thin;
}

* {
  scrollbar-color: #a9bdc9 #eef7f5;
  scrollbar-width: thin;
}

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

::-webkit-scrollbar-track {
  background: #eef7f5;
}

:root::-webkit-scrollbar-track,
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
  background: #eef7f5;
}

::-webkit-scrollbar-thumb {
  background: #a9bdc9;
  border: 3px solid #eef7f5;
  border-radius: 999px;
}

:root::-webkit-scrollbar-thumb,
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  background: #a9bdc9;
  border: 3px solid #eef7f5;
  border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
  background: #7898aa;
}

::-webkit-scrollbar-corner {
  background: #eef7f5;
}

.alj-page-background {
  background: var(--alj-page-bg);
  background-attachment: fixed;
}

.alj-gradient-header {
  position: relative;
  overflow: hidden;
  background: var(--alj-header-gradient);
  color: #fff;
  box-shadow: var(--alj-header-shadow);
}

.alj-gradient-header::after {
  content: "";
  position: absolute;
  inset: -42px -60px auto auto;
  width: 360px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.18), rgba(255,255,255,0));
  pointer-events: none;
}

.alj-gradient-header > * {
  position: relative;
  z-index: 1;
}
