/**
 * VIS-1 — personalização visual ReleasePOS (zero core).
 * Injetado em todas as páginas pelo listener de RenderHeaderEvent do
 * módulo (layout._header-injection, presente no layout.base e no
 * layout.dashboard).
 *
 * A sidebar do tema é pintada por tokens do Tailwind v4 (@theme →
 * variáveis em :root) — resources/css/light/_colors.css e dark/_colors.css.
 * Este arquivo carrega ANTES dos CSS do tema (@vite vem depois do
 * _header-injection no head), então empate de especificidade perderia:
 * :root[data-theme] (0,2,0) vence o :root do @theme (0,1,0) sem
 * !important, e vale para os dois temas — o html sempre carrega
 * data-theme (layout.dashboard e layout.base).
 */
:root[data-theme] {
    --color-aside-background: #490D4D;
    --color-aside-color: #ffffff;
    --color-aside-menu-background: #490D4D;
    --color-aside-menu-background-hover: #5e1663; /* mesma matiz, +8% de luz — branco 9,8:1 (AA) */
    --color-aside-submenu-background: #3a0a3e;    /* mesma matiz, mais escura que o fundo */
    --color-aside-submenu-background-hover: #5e1663;
}

/**
 * O item ATIVO (.toggled) e a borda dos submenus usam --color-secondary
 * (teal), que pinta botões no app inteiro — não dá para trocar a
 * variável. Override escopado ao aside: os dois ids no selector
 * (2,2,0)/(2,1,0) vencem os selectors aninhados do tema
 * (#dashboard-aside > div … = (1,2,0)) em qualquer ordem de carga.
 * Branco sobre #641969: 11,1:1 (AA).
 */
#dashboard-aside > div ul#aside-menu .ns-aside-menu.toggled {
    background-color: #641969;
    border-color: #d9a0de;
}

#dashboard-aside > div ul#aside-menu .ns-aside-submenu {
    border-color: #d9a0de;
}

/**
 * Logo quadrado no login: o blade do sign-in renderiza o logo custom SEM
 * classe de tamanho (<img src="{{ ns_store_square_logo }}">) — um PNG de
 * 1080×1080 sairia em tamanho natural. Teto do mesmo tamanho do SVG
 * padrão (w-32 = 8rem).
 */
#sign-in-box img {
    max-width: 8rem;
    height: auto;
}