/*
 * Login themes (#5977). tailwind.css is a committed, purged build whose brand colors are
 * arbitrary values (bg-[#0c4481], focus:ring-[#00aec4]/30, ...). These rules point the same
 * selectors at CSS variables so a theme recolors every Auth page without rebuilding Tailwind.
 * The defaults are the Intigrate colors, so pages without a theme look exactly as before; the
 * account layout overrides the variables with the resolved LoginTheme. Loaded after tailwind.css.
 */
:root {
    --ig-primary: #0c4481;
    --ig-primary-hover: #00789f;
    --ig-accent: #00aec4;
    --ig-panel: #062847;
    --ig-tint: #f0fbfd;
    --ig-tint-strong: #e0f6fa;
}

.border-\[\#00aec4\] { border-color: var(--ig-accent); }
.bg-\[\#00aec4\] { background-color: var(--ig-accent); }
.bg-\[\#0c4481\] { background-color: var(--ig-primary); }
.bg-\[\#f0fbfd\] { background-color: var(--ig-tint); }
.text-\[\#00aec4\] { color: var(--ig-accent); }
.text-\[\#0c4481\] { color: var(--ig-primary); }
.hover\:border-\[\#00aec4\]:hover { border-color: var(--ig-accent); }
.hover\:border-\[\#0c4481\]:hover { border-color: var(--ig-primary); }
.hover\:bg-\[\#f0fbfd\]:hover { background-color: var(--ig-tint); }
.hover\:text-\[\#0c4481\]:hover { color: var(--ig-primary); }
.focus\:border-\[\#00aec4\]:focus { border-color: var(--ig-accent); }
.focus\:border-\[\#0c4481\]:focus { border-color: var(--ig-primary); }
.focus\:ring-\[\#00aec4\]:focus { --tw-ring-color: var(--ig-accent); }
.focus\:ring-\[\#00aec4\]\/30:focus { --tw-ring-color: color-mix(in srgb, var(--ig-accent) 30%, transparent); }
.group:hover .group-hover\:bg-\[\#e0f6fa\] { background-color: var(--ig-tint-strong); }
.group:hover .group-hover\:text-\[\#0c4481\] { color: var(--ig-primary); }
.group:hover .group-hover\:ring-\[\#00aec4\] { --tw-ring-color: var(--ig-accent); }

.loader-path { stroke: var(--ig-primary); }
.custom-spin { background-color: var(--ig-accent); }
