/* ═══ RESET & BASE ═══ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* Tell browsers this is a dark UI — prevents white autofill backgrounds */
:root { color-scheme: dark; }

body {
  background: var(--bg);
  background-image:
    radial-gradient(ellipse at 20% 0%, rgba(45,123,181,.06) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 100%, rgba(45,232,200,.04) 0%, transparent 50%);
  background-attachment: fixed;
  color: var(--text);
  font-family: var(--sans);
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Autofill override (belt + suspenders alongside color-scheme:dark) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 60px #0d1117 inset !important;
  -webkit-text-fill-color: #e2e8f0 !important;
  caret-color: #e2e8f0;
  transition: background-color 9999s ease-in-out 0s;
}

/* Custom scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(45,123,181,.18); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(45,123,181,.3); }
::selection { background: rgba(45,232,200,.2); color: #fff; }

/* Focus ring */
:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: 2px;
}

/* ── Icon system (Lucide-style SVGs via icon() helper) ── */
.icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
  /* Inherits stroke color from parent color */
}
/* Icons inside buttons sit neatly alongside text */
.btn .icon,
.tb-btn .icon,
.tb-icon-btn .icon,
.tb-menu-item .icon,
.nav-link .icon {
  vertical-align: -0.125em;
}
/* Icon-only buttons: ensure SVG doesn't create extra space */
.tb-icon-btn .icon,
.gf-toggle .icon,
.layout-btn .icon {
  pointer-events: none;
}
/* Quick-create + button in nav: icon-only, circular */
.nav-quick-create .icon {
  display: block;
}