/*
 * Menu lateral Way (temas claro e escuro).
 * Carregado em head.php nos dois temas, depois do darkmode.css. As cores vêm dos tokens --mw-*:
 * valores do tema claro aqui; valores do tema escuro em menu_way_escuro.css.
 * Mantém a estrutura do menu atual; o menu do Tasks (.left-panel-tasks) recebe o mesmo visual.
 * Paleta alinhada aos tokens --wy-* (docs/GUIA_LAYOUT_SISTEMA.md).
 */

#left-panel
{
    --mw-bg: #ffffff;
    --mw-line: #e2e8f0;
    --mw-line-soft: #eef1f5;
    --mw-text: #1e293b;
    --mw-text-hover: #0f172a;
    --mw-title: #64748b;
    --mw-label: #94a3b8;
    --mw-hover: #f1f5f9;
    --mw-active: #0369a1;
    --mw-active-bg: var(--mw-active-bg);
    --mw-pop-item: #475569;
    --mw-icon: #3f4d63;
    --mw-shadow: 0 12px 32px rgba(15, 23, 42, 0.14);
    --mw-b1: #1a75a8;
    --mw-b2: #2189c0;
    --mw-cap: #f1f5f9;
    --mw-hv-row: rgba(14, 165, 233, 0.08);
    --mw-hv-cap: rgba(14, 165, 233, 0.18);
    --mw-hv-label: #0369a1;
    --mw-act-cap: rgba(14, 165, 233, 0.16);
    --mw-act-ring: rgba(3, 105, 161, 0.32);
    --mw-act-label: #0369a1;
    --mw-img: brightness(0) opacity(0.78);
    --mw-img-active: brightness(0) invert(35%) sepia(90%) saturate(2200%) hue-rotate(178deg) brightness(95%);
}

body #left-panel
{
    background-color: var(--mw-bg) !important;
    border-right: 1px solid var(--mw-line) !important;
}

body #left-panel > nav
{
    background-color: var(--mw-bg) !important;
}

/* Logo: wordmark da marca (máscara do logo branco) no lugar da imagem branca */
#left-panel .navbar-brand .logo-way-mask
{
    display: block;
    width: 120px;
    height: 56px;
    margin: 0 auto;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background: linear-gradient(90deg, var(--mw-b1), var(--mw-b2));
}

/* Título do sistema e lista de sistemas */
body #left-panel .menu-title
{
    color: var(--mw-title) !important;
    font-size: 12px;
    letter-spacing: 0.06em;
    border-radius: 0;
    transition: background 0.2s, color 0.2s;
}

body #left-panel .menu-title span
{
    color: inherit !important;
}

body #left-panel #menu-change:hover
{
    color: var(--mw-text-hover) !important;
    background-color: var(--mw-hover);
}

body #left-panel .menu-title i.fa-chevron-circle-right
{
    display: inline-block;
    width: 16px;
    height: 16px;
    font-size: 0;
    color: transparent !important;
    background-color: var(--mw-title);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%271.8%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Ccircle cx=%2712%27 cy=%2712%27 r=%279%27/%3E%3Cpath d=%27M10 9l3 3-3 3%27/%3E%3C/svg%3E") center / 16px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%271.8%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Ccircle cx=%2712%27 cy=%2712%27 r=%279%27/%3E%3Cpath d=%27M10 9l3 3-3 3%27/%3E%3C/svg%3E") center / 16px no-repeat;
}

body #left-panel .menu-title i.fa-chevron-circle-right::before
{
    content: none;
}

body #left-panel .menu-options
{
    background-color: var(--mw-bg);
    border: 1px solid var(--mw-line);
    border-radius: 12px;
    box-shadow: var(--mw-shadow);
    padding: 6px;
}

body #left-panel .menu-option
{
    color: var(--mw-pop-item);
    border-radius: 8px;
    padding: 8px 10px;
}

body #left-panel .menu-option:hover
{
    background-color: var(--mw-hover);
    color: var(--mw-text-hover) !important;
}

body #left-panel .menu-option-selected
{
    background-color: var(--mw-active-bg);
    color: var(--mw-active) !important;
}

/* Lista de sistemas: título, ícone antes do nome e marca no sistema atual */
body #left-panel .menu-options::before
{
    content: "Sistemas";
    display: block;
    padding: 6px 10px 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mw-label);
}

body #left-panel .menu-option
{
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13.5px;
    font-weight: 500;
    text-transform: none;
}

body #left-panel .menu-option::before
{
    content: "";
    flex: none;
    width: 18px;
    height: 18px;
    background-color: currentColor;
    -webkit-mask: var(--sistema-icone) center / contain no-repeat;
    mask: var(--sistema-icone) center / contain no-repeat;
}

body #left-panel .menu-option-selected::after
{
    content: "✓";
    margin-left: auto;
}

body #left-panel .menu-option[data-menuid="1"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M13%202L4%2014h7l-1%208%209-12h-7z%27%2F%3E%3C%2Fsvg%3E");
}

body #left-panel .menu-option[data-menuid="2"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2017l6-6%204%204%208-8%27%2F%3E%3Cpath%20d%3D%27M15%207h6v6%27%2F%3E%3C%2Fsvg%3E");
}

body #left-panel .menu-option[data-menuid="3"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%276%27%20width%3D%2718%27%20height%3D%2712%27%20rx%3D%272%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%272.5%27%2F%3E%3C%2Fsvg%3E");
}

body #left-panel .menu-option[data-menuid="4"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274%27%20y%3D%274%27%20width%3D%2716%27%20height%3D%2716%27%20rx%3D%273%27%2F%3E%3Cpath%20d%3D%27M8.5%2012.5l2.5%202.5%204.5-5%27%2F%3E%3C%2Fsvg%3E");
}

body #left-panel .menu-option[data-menuid="5"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%205h16v11H8l-4%204z%27%2F%3E%3C%2Fsvg%3E");
}

body #left-panel .menu-option[data-menuid="6"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%273%27%20width%3D%277%27%20height%3D%276%27%20rx%3D%271.5%27%2F%3E%3Crect%20x%3D%2714%27%20y%3D%2715%27%20width%3D%277%27%20height%3D%276%27%20rx%3D%271.5%27%2F%3E%3Cpath%20d%3D%27M6.5%209v3a3%203%200%20003%203H14%27%2F%3E%3C%2Fsvg%3E");
}

body #left-panel .menu-option[data-menuid="7"]
{
    --sistema-icone: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%279%27%20cy%3D%278%27%20r%3D%273.5%27%2F%3E%3Cpath%20d%3D%27M2.5%2020c0-3.5%203-6%206.5-6s6.5%202.5%206.5%206%27%2F%3E%3Cpath%20d%3D%27M16%204.5a3.5%203.5%200%20010%207M18%2014.5c2%20.7%203.5%202.6%203.5%205.5%27%2F%3E%3C%2Fsvg%3E");
}

/* Itens */
body #left-panel .menu-divisor
{
    border-top-color: var(--mw-line-soft);
}

body #left-panel .navbar .navbar-nav li > a
{
    color: var(--mw-text) !important;
}

body #left-panel .navbar .navbar-nav li:hover > a
{
    color: var(--mw-hv-label) !important;
}

body #left-panel .navbar .navbar-nav li.active > a,
body #left-panel .navbar .navbar-nav li.active:hover > a
{
    color: var(--mw-act-label) !important;
    font-weight: 600;
}

body #left-panel .navbar .navbar-nav li.menu-item-has-children a:before
{
    color: var(--mw-label);
}

/* Linha do item: o item ativo mantém sempre o fundo do hover */
body #left-panel :is(.menu-item, .menu-item-has-children)
{
    border-radius: 12px;
    margin: 2px 8px;
    width: calc(100% - 16px) !important;
    transition: background-color 0.15s;
}

body #left-panel :is(.menu-item, .menu-item-has-children):hover,
body #left-panel :is(.menu-item, .menu-item-has-children).active
{
    background-color: var(--mw-hv-row);
}

/*
 * Ícone em cápsula. A cápsula é um pseudo-elemento do link (e não o fundo do ícone), porque os PNG
 * recebem um filtro de cor que também pintaria o fundo do próprio elemento.
 */
body #left-panel :is(.menu-item, .menu-item-has-children) > a
{
    position: relative;
}

body #left-panel :is(.menu-item, .menu-item-has-children) > a::before
{
    content: "";
    position: absolute;
    display: block !important;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background-color: var(--mw-cap);
    transition: background-color 0.15s, transform 0.15s;
    pointer-events: none;
}

body #left-panel :is(.menu-item, .menu-item-has-children) > a > .img-menu
{
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    flex: none;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    padding: 7px;
    object-fit: contain;
    background: none;
    transition: transform 0.15s;
}

/* Menu expandido: ícone à esquerda, texto ao lado */
body:not(.open) #left-panel :is(.menu-item, .menu-item-has-children)
{
    padding-left: 0 !important;
}

body:not(.open) #left-panel :is(.menu-item, .menu-item-has-children) > a
{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 10px !important;
}

body:not(.open) #left-panel :is(.menu-item, .menu-item-has-children) > a > .img-menu
{
    margin: 0 !important;
}

body:not(.open) #left-panel :is(.menu-item, .menu-item-has-children) > a::before
{
    left: 10px;
    top: 50%;
    margin-top: -17px;
}

/* Menu recolhido: ícone em cima, rótulo embaixo */
body.open #left-panel :is(.menu-item, .menu-item-has-children) > a
{
    flex-direction: column;
    align-items: center;
    gap: 2px;
    height: auto;
    padding: 6px 0 !important;
    font-size: 12px;
}

body.open #left-panel :is(.menu-item, .menu-item-has-children) > a > .img-menu
{
    margin: 0 !important;
}

body.open #left-panel :is(.menu-item, .menu-item-has-children) > a::before
{
    left: 50%;
    top: 6px;
    margin-left: -17px;
}

/* Hover */
body #left-panel :is(.menu-item, .menu-item-has-children):hover > a::before
{
    background-color: var(--mw-hv-cap);
    transform: translateX(2px);
}

body #left-panel :is(.menu-item, .menu-item-has-children):hover > a > .img-menu
{
    transform: translateX(2px);
}

body.open #left-panel :is(.menu-item, .menu-item-has-children):hover > a::before
{
    transform: translateY(-2px);
}

body.open #left-panel :is(.menu-item, .menu-item-has-children):hover > a > .img-menu
{
    transform: translateY(-2px);
}

/* Ativo: tom azul suave com filete; passar o mouse sobre ele não muda nada */
body #left-panel :is(.menu-item, .menu-item-has-children).active > a::before,
body #left-panel :is(.menu-item, .menu-item-has-children).active:hover > a::before
{
    background-color: var(--mw-act-cap);
    box-shadow: inset 0 0 0 1px var(--mw-act-ring);
    transform: none;
}

body #left-panel :is(.menu-item, .menu-item-has-children).active:hover > a > .img-menu
{
    transform: none;
}

/* Cor do ícone: o SVG é pintado com #c8c9ce (e #007BAE no hover) em style_custom.css; imagens PNG brancas seguem o filtro do tema */
body #left-panel svg.img-menu path,
body #left-panel svg.img-menu rect,
body #left-panel svg.img-menu circle,
body #left-panel svg.img-menu ellipse
{
    fill: var(--mw-icon);
}

body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu path,
body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu rect,
body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu circle,
body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu ellipse,
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu path,
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu rect,
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu circle,
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu ellipse
{
    fill: var(--mw-active) !important;
}

body #left-panel img.img-menu
{
    filter: var(--mw-img);
}

body #left-panel :is(.menu-item, .menu-item-has-children):hover img.img-menu,
body #left-panel :is(.menu-item, .menu-item-has-children).active img.img-menu
{
    filter: var(--mw-img-active);
}

/* Submenu (painel ao lado do menu): título do item, sem ícones */
body #left-panel .sub-menu.children.dropdown-menu
{
    background-color: var(--mw-bg);
    border: 1px solid var(--mw-line) !important;
    border-radius: 12px;
    box-shadow: var(--mw-shadow);
    padding: 6px !important;
    min-width: 228px;
}

body #left-panel .sub-menu.children.dropdown-menu .sub-menu-titulo
{
    list-style: none;
    padding: 6px 10px 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mw-label);
    background: transparent;
}

body #left-panel .sub-menu.children.dropdown-menu li
{
    border-radius: 8px;
}

body #left-panel .sub-menu.children.dropdown-menu li a
{
    padding: 8px 10px;
    font-size: 13.5px;
    line-height: 22px;
    height: auto;
    color: var(--mw-pop-item) !important;
    border-radius: 8px;
}

body #left-panel .sub-menu.children.dropdown-menu li a svg,
body #left-panel .sub-menu.children.dropdown-menu li a img
{
    display: none;
}

body #left-panel .sub-menu.children.dropdown-menu li:not(.sub-menu-titulo):hover
{
    background-color: var(--mw-hover);
}

body #left-panel .sub-menu.children.dropdown-menu li:not(.sub-menu-titulo):hover a
{
    color: var(--mw-text-hover) !important;
}

body #left-panel .sub-menu.children.dropdown-menu li.active
{
    background-color: var(--mw-active-bg);
}

body #left-panel .sub-menu.children.dropdown-menu li.active a
{
    color: var(--mw-active) !important;
    font-weight: 600;
}

body #left-panel .navbar-toggler
{
    color: var(--mw-pop-item);
}

/* Linha entre o logo e o título do sistema: sutil e recuada, como no protótipo */
body #left-panel .navbar-header
{
    position: relative;
}

body #left-panel .navbar-header .navbar-brand
{
    border-bottom: 0 !important;
}

body #left-panel .navbar-header::after
{
    content: "";
    position: absolute;
    left: 6px;
    right: 6px;
    bottom: 0;
    height: 1px;
    background: var(--mw-line);
}

/* Seta nos itens com submenu (menu expandido; recolhido já mostra a seta no rótulo) */
body:not(.open) #left-panel li.menu-item-has-children > a.open_menu_popup::after
{
    content: "";
    flex: none;
    width: 7px;
    height: 7px;
    margin: 0 18px 0 auto;
    border-top: 2px solid var(--mw-title);
    border-right: 2px solid var(--mw-title);
    transform: rotate(45deg);
}

body:not(.open) #left-panel li.menu-item-has-children > a.open_menu_popup i.ti-angle-right
{
    display: none;
}

/* Menu recolhido: seta nos itens com submenu (substitui o " >" que só alguns itens tinham no rótulo) */
body.open #left-panel li.menu-item-has-children > a.open_menu_popup i.ti-angle-right
{
    display: none;
}

body.open #left-panel li.menu-item-has-children > a.open_menu_popup::after
{
    content: "";
    display: block;
    position: absolute;
    right: 7px;
    top: 50%;
    width: 5px;
    height: 5px;
    margin-top: -3px;
    border-top: 1.6px solid var(--mw-title);
    border-right: 1.6px solid var(--mw-title);
    transform: rotate(45deg);
}

/* Usuários e Configs Gerais saem do menu: o acesso fica na engrenagem do topo */
body #left-panel li.fixed-menus[title="Usuarios"],
body #left-panel li.fixed-menus[title="Gerais"]
{
    display: none;
}

/* Tasks: painel fixo e favoritos (quadros) */
body #left-panel:has(.left-panel-tasks),
body #left-panel .left-panel-tasks
{
    background: var(--mw-bg) !important;
}

body #left-panel .menu-tasks-quadro:hover,
body #left-panel .menu-tasks-quadro.active
{
    background-color: var(--mw-hover);
}

body #left-panel .menu-tasks-quadro.active
{
    background-color: var(--mw-active-bg);
}

body #left-panel .menu-tasks-quadro > a
{
    color: var(--mw-text) !important;
}

body #left-panel .menu-tasks-quadro:hover > a
{
    color: var(--mw-text-hover) !important;
}

body #left-panel .menu-tasks-quadro.active > a
{
    color: var(--mw-active) !important;
    font-weight: 600;
}

body #left-panel .menu-tasks-quadro .display_options
{
    background-color: var(--mw-bg);
    border: 1px solid var(--mw-line);
    border-radius: 12px;
    box-shadow: var(--mw-shadow);
    padding: 6px;
}

body #left-panel .quadro_options_menu
{
    color: var(--mw-pop-item);
    border-radius: 8px;
}

body #left-panel .quadro_options_menu:hover
{
    background-color: var(--mw-hover);
    color: var(--mw-text-hover);
}

/* Lista de sistemas: abre alinhada ao topo do título do sistema */
body #left-panel div:has(> #menu-change)
{
    position: relative;
}

body #left-panel .menu-options
{
    top: 0;
    margin-top: 0;
}

/* Separador entre blocos do menu: linha discreta e recuada */
body #left-panel .menu-divisor
{
    display: block !important;
    margin: 6px 6px;
    border-top: 1px solid var(--mw-line);
}

/* Título "Favoritos" (Tasks): separador discreto acima, sem a linha abaixo */
body #left-panel .quadros_menu_container .menu-title
{
    margin: 6px 6px 0;
    padding: 0 4px !important;
    border-top: 1px solid var(--mw-line);
}

body #left-panel .quadros_menu_container .menu-title + hr.menu-divisor
{
    display: none !important;
}

/* Separador logo abaixo do título do sistema: já existe a linha sob o logo */
body #left-panel .col-lg-12 + hr.menu-divisor,
body #left-panel .col-lg-12 + div > hr.menu-divisor:first-child
{
    display: none !important;
}

/* Menu recolhido: margem lateral menor, para a linha caber nos 75px */
body.open #left-panel :is(.menu-item, .menu-item-has-children)
{
    margin: 2px 6px;
    width: calc(100% - 12px) !important;
}

/* Empresas e Contatos: os SVG têm muita folga na caixa de 125x105; padding menor para o ícone ficar do tamanho dos demais */
body #left-panel li.fixed-menus > a > svg.img-menu
{
    padding: 4px;
}

/* Ícones desenhados só com traço branco (ex.: Relatórios do Tasks) */
body #left-panel svg.img-menu [stroke="#fff"],
body #left-panel svg.img-menu [stroke="#FFF"],
body #left-panel svg.img-menu [stroke="#ffffff"],
body #left-panel svg.img-menu [stroke="white"]
{
    stroke: var(--mw-icon);
}

body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu [stroke="#fff"],
body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu [stroke="#FFF"],
body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu [stroke="#ffffff"],
body #left-panel :is(.menu-item, .menu-item-has-children):hover svg.img-menu [stroke="white"],
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu [stroke="#fff"],
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu [stroke="#FFF"],
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu [stroke="#ffffff"],
body #left-panel :is(.menu-item, .menu-item-has-children).active svg.img-menu [stroke="white"]
{
    stroke: var(--mw-active);
}

/* Menu recolhido mais largo (96px) para caber rótulos de 12px */
body.open #left-panel
{
    width: 96px;
    max-width: 96px;
}

body.open #left-panel .left-panel-tasks
{
    width: 96px;
}

.right-panel-tasks-open
{
    padding-left: 96px !important;
}

/* Texto dos itens do menu expandido: 14px, semibold */
body:not(.open) #left-panel :is(.menu-item, .menu-item-has-children) > a
{
    font-size: 14px;
    font-weight: 600;
}

/* Telas estreitas (< 576px): o Bootstrap recolhia os itens (collapse) e deixava só uma coluna vazia de 96px.
   O menu recolhido de 96px deve manter os ícones sempre visíveis. */
@media screen and (max-width: 575.98px)
{
    body #left-panel .navbar-expand-sm .navbar-collapse.collapse:not(.show)
    {
        display: flex !important;
        flex-basis: auto;
    }

    body #left-panel .navbar-expand-sm .navbar-toggler
    {
        display: none;
    }
}

@media screen and (max-width: 575.98px)
{
    /* O .navbar do Bootstrap volta a quebrar linha aqui e empurrava os itens para uma 2ª coluna fora do menu. */
    body #left-panel .left-panel-tasks
    {
        flex-wrap: nowrap;
    }

    body #left-panel .left-panel-tasks .navbar-collapse
    {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
    }
}