/* O shell usa a navegação do Gerenciar e preserva o índigo da marca Pool. */
body.poolsoft-app-shell {
	--poolsoft-workspace-bg: #f5f7fb;
	--poolsoft-menu-bg: #fff;
	--poolsoft-menu-border: #e2e8f0;
	--poolsoft-menu-text: #334155;
	--poolsoft-menu-active-bg: #eef2ff;
	--poolsoft-menu-active-text: #4338ca;
}

/* O cabeçalho é global; o fundo da área de trabalho pertence às telas do app. */
body.poolsoft-workspace {
	background: var(--poolsoft-workspace-bg);
}

body.poolsoft-workspace .site-content {
	background: var(--poolsoft-workspace-bg);
	min-height: calc(100vh - 68px);
}

body.poolsoft-app-shell #masthead.site-header.navbar {
	background: #18233b !important;
	border-bottom: 1px solid rgba(165, 180, 252, 0.16);
	box-shadow: 0 4px 18px rgba(15, 23, 42, 0.12) !important;
}

body.poolsoft-app-shell #masthead .navbar-brand {
	color: #fff;
	font-weight: 800;
	letter-spacing: -0.025em;
}

/* Usa a versão já cadastrada para fundos escuros, sem recolorir a imagem. */
body.poolsoft-app-shell #masthead .site-light-logo {
	display: none;
}

body.poolsoft-app-shell #masthead .site-dark-logo {
	display: inline-block;
}

body.poolsoft-app-shell #masthead .g-header-nav > .nav-item > .nav-link {
	border-radius: 0.625rem;
	color: #cbd5e1;
	font-size: 0.875rem;
	font-weight: 600;
	padding: 0.625rem 0.75rem;
	transition: color 0.15s ease, background-color 0.15s ease;
}

body.poolsoft-app-shell #masthead .g-header-nav > .nav-item > .nav-link:hover,
body.poolsoft-app-shell #masthead .g-header-nav > .nav-item > .nav-link:focus-visible {
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
}

body.poolsoft-app-shell #masthead .g-header-nav > .nav-item > .nav-link.active,
body.poolsoft-app-shell #masthead .g-header-nav > .nav-item > .nav-link[aria-expanded="true"] {
	background: rgba(165, 180, 252, 0.17);
	box-shadow: inset 0 0 0 1px rgba(165, 180, 252, 0.2);
	color: #e0e7ff;
}

body.poolsoft-app-shell #masthead .dropdown-menu {
	background: var(--poolsoft-menu-bg);
	border: 1px solid var(--poolsoft-menu-border);
	border-radius: 0.75rem;
	box-shadow: 0 16px 40px rgba(15, 23, 42, 0.16);
	color: var(--poolsoft-menu-text);
	padding: 0.5rem;
}

body.poolsoft-app-shell #masthead .dropdown-item {
	border-radius: 0.5rem;
	color: var(--poolsoft-menu-text);
	font-size: 0.875rem;
	font-weight: 600;
	padding: 0.625rem 0.75rem;
}

body.poolsoft-app-shell #masthead .dropdown-item:hover,
body.poolsoft-app-shell #masthead .dropdown-item:focus,
body.poolsoft-app-shell #masthead .dropdown-item.active {
	background: var(--poolsoft-menu-active-bg);
	color: var(--poolsoft-menu-active-text);
}

body.poolsoft-app-shell #masthead .navbar-toggler,
body.poolsoft-app-shell #masthead .g-header-search-toggle,
body.poolsoft-app-shell #masthead .btn.btn-secondary {
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(203, 213, 225, 0.18);
	border-radius: 0.625rem;
	box-shadow: none;
	color: #e2e8f0;
}

body.poolsoft-app-shell #masthead .g-header-search-toggle {
	height: 2.5rem;
	width: 2.5rem;
}

body.poolsoft-app-shell #masthead .navbar-toggler:hover,
body.poolsoft-app-shell #masthead .g-header-search-toggle:hover,
body.poolsoft-app-shell #masthead .g-header-search-toggle[aria-expanded="true"],
body.poolsoft-app-shell #masthead .btn.btn-secondary:hover {
	background: rgba(255, 255, 255, 0.13);
	border-color: rgba(203, 213, 225, 0.32);
	color: #fff;
}

body.poolsoft-app-shell #masthead .navbar-toggler-icon,
body.poolsoft-app-shell #masthead .navbar-toggler-icon::before,
body.poolsoft-app-shell #masthead .navbar-toggler-icon::after {
	background-color: #e2e8f0;
}

body.poolsoft-app-shell #masthead :is(a, button, input):focus-visible {
	outline: 2px solid #a5b4fc;
	outline-offset: 3px;
}

/* Tokens do menu móvel também se aplicam à folha de atalhos. */
body.poolsoft-app-shell .g-nav,
body.poolsoft-app-shell .g-menu-sheet {
	--g-nav-mobile-active-color: #4338ca;
	--g-nav-mobile-active-bg: #eef2ff;
	--g-nav-pwa-install-bg: #4f46e5;
}

body.poolsoft-app-shell .g-nav--top {
	--g-nav-top-link-color: #475569;
	--g-nav-top-active-color: #4338ca;
	--g-nav-top-active-bg: #eef2ff;
	--g-nav-top-active-fg: #4338ca;
	--g-nav-top-hover-bg: #eef2ff;
}

body.poolsoft-app-shell .g-nav--bottom {
	--g-nav-mobile-active-color: #e0e7ff;
	--g-nav-mobile-active-bg: rgba(165, 180, 252, 0.17);
	background: #18233b;
	border-top-color: rgba(165, 180, 252, 0.16);
	box-shadow: 0 -4px 18px rgba(15, 23, 42, 0.12);
}

body.poolsoft-app-shell .g-nav--bottom a,
body.poolsoft-app-shell .g-nav--bottom .g-nav-menu-btn {
	color: #cbd5e1;
}

body.poolsoft-app-shell .g-nav--bottom a:is(:hover, :focus-visible, .active),
body.poolsoft-app-shell .g-nav--bottom .g-nav-menu-btn:is(:hover, :focus-visible, .active) {
	background: var(--g-nav-mobile-active-bg);
	color: var(--g-nav-mobile-active-color);
}

body.poolsoft-app-shell .poolsoft-app {
	--poolsoft-gray-900: #1e293b;
	--poolsoft-body-color: #475569;
	--poolsoft-border-color: #e2e8f0;
	--poolsoft-radius: 0.75rem;
	--poolsoft-shadow: 0 2px 6px rgba(15, 23, 42, 0.035);
}

:is(.dark-mode, [data-bs-theme="dark"]) body.poolsoft-app-shell,
body.poolsoft-app-shell:is(.dark-mode, [data-bs-theme="dark"]) {
	--poolsoft-workspace-bg: #131022;
	--poolsoft-menu-bg: #1d1934;
	--poolsoft-menu-border: #39354d;
	--poolsoft-menu-text: #e2e8f0;
	--poolsoft-menu-active-bg: #302c50;
	--poolsoft-menu-active-text: #c7d2fe;
}

:is(.dark-mode, [data-bs-theme="dark"]) body.poolsoft-app-shell .poolsoft-app,
body.poolsoft-app-shell:is(.dark-mode, [data-bs-theme="dark"]) .poolsoft-app {
	--poolsoft-gray-900: #fff;
	--poolsoft-body-color: rgba(255, 255, 255, 0.7);
	--poolsoft-border-color: rgba(255, 255, 255, 0.15);
	--poolsoft-shadow: none;
}

:is(.dark-mode, [data-bs-theme="dark"]) body.poolsoft-app-shell :is(.g-nav--top, .g-menu-sheet),
body.poolsoft-app-shell:is(.dark-mode, [data-bs-theme="dark"]) :is(.g-nav--top, .g-menu-sheet) {
	--g-nav-mobile-active-color: #c7d2fe;
	--g-nav-mobile-active-bg: #302c50;
	--g-nav-top-link-color: #cbd5e1;
	--g-nav-top-active-color: #c7d2fe;
	--g-nav-top-active-bg: #302c50;
	--g-nav-top-active-fg: #c7d2fe;
	--g-nav-top-hover-bg: #302c50;
}

@media (prefers-reduced-motion: reduce) {
	body.poolsoft-app-shell #masthead .g-header-nav > .nav-item > .nav-link {
		transition: none;
	}
}
