/*Color Scheme*/ :root{ /*Blue*/--primary: #6AAFDC; /*Red*/--secondary: #E36671; /*Orange*/--tertiary: #F2A95B; /*Green*/--quaternary: #87C7BC; } /*Background Scheme*/ :root{ /*Blue*/--primary-bg: #C7E3F2; /*Red*/--secondary-bg: #F2C1C6; /*Orange*/--tertiary-bg: #FFDCC2; /*Green*/--quaternary-bg: #CFF5F1; } svg:not(:root) {background-image: none !important;} /*Mobile Tipography*/ @media(max-width: 640px){ .uk-h3, h3{font-size: 24px} .uk-h5, h5{font-size: 12px} .uk-accordion-title, .uk-text-large{font-size: 12px} .uk-text-lead{font-size: 16px} } /*Toolbar*/ .tm-toolbar{z-index: 999} /*Menu*/ /*Hidden large*/ @media(min-width: 1199px){ .item-1710, .item-2243, .item-1739, .item-262, .item-269, .item-277, .item-282, .item-771, .item-778, .item-783, .item-1689, .item-1695, .item-1702, .item-1417, .item-1140, .item-1321, .item-3082, .item-3083, .item-3084{display: none} } /*Navbar*/ .tm-header-mobile{background: var(--primary);} .tm-header-mobile .uk-navbar-container{background: transparent;} /*.uk-navbar-left, .uk-navbar-nav {width: 100%; justify-content: space-between;flex-wrap: nowrap;}*/ .uk-navbar-container{border-top: 1px solid #EFEFEF;} /*Dropdown*/ .uk-navbar-dropdown{max-width: 1396px} .uk-navbar-dropdown-grid div {min-width: 225px; max-width: max-content;} .uk-navbar-dropdown-nav>li>a{border-bottom: 0.5px solid #CBCBCB; margin-bottom: 10px; display: block; text-align: left;} .uk-navbar-dropdown .uk-nav-sub{padding-bottom: 30px;} .uk-navbar-dropdown-nav .uk-nav-divider {border-top: 0px} .uk-navbar-dropdown-nav .uk-nav-sub a:nth-child(1){font-size: 15px; line-height: 20px; font-weight: 400} .uk-navbar-dropdown-nav .uk-nav-sub a:focus, .uk-navbar-dropdown-nav .uk-nav-sub a:hover, .uk-navbar-dropdown-nav .uk-nav-sub li.uk-active>a{font-weight: 600} a.check_all img{border-bottom: 1px solid #CBCBCB; padding-bottom: 15px; max-width: 375px; display: block; margin-right: 0 !important;} @media(min-width: 1200px){ a.check_all{border-bottom: none !important; text-align: right;} } .uk-navbar-dropdown-nav picture{max-width: 375px;} /*Icons*/ @media(min-width: 1199px){ .icon picture {position: absolute; margin-left: 186px;} } .uk-navbar-dropdown .sticker{max-width: 55px} /* Sticker do artigo no título dos nav items (Menu Item → Article → Sticker): o badge nunca parte por dentro; sem espaço, passa inteiro para a linha seguinte */ .uk-navbar-dropdown .uk-badge{white-space: nowrap; margin-left: 4px} .uk-navbar-dropdown .drop-nav .el-link{flex-wrap: wrap} /* o link do nav é display:flex no UIkit; sem wrap o badge transborda */ .uk-navbar-dropdown svg {position: absolute; width: 10px; left: 215px;} .uk-badge{text-transform: uppercase;} /*Mobile*/ /* (removido 2026-09-17: `.uk-navbar-toggle{display:none}` — existia só porque o hambúrguer era do MobileMenuCK) */ /* Menu mobile NATIVO (PT): destapa o toggle nativo do dialog (o hambúrguer antigo era do MobileMenuCK), largura do offcanvas como no mockup, fundo do grupo aberto. Escopo aos 3 mercados (PT/ES/BR). */ /* Toggle nativo no MESMO sítio do botão antigo do MobileMenuCK (absoluto: left 15px, caixa 30px, branco) — o logo mantém o margin-left:35px e os widgets ficam exatamente onde estão em prod. Fica visível com o painel aberto (o painel começa aos 80px). */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-container{position: relative;} :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-toggle{display: flex; position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: auto; min-height: 0; width: 30px; padding: 0; justify-content: center; color: #fff; z-index: 2;} /* centrado na mesma linha do logo */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-toggle-icon > svg{width: 28px; height: 28px;} :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-toggle-icon svg rect{height: 1.5px;} /* linhas um pouco mais grossas que o UIkit (1px) */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile #module-403 .partner_container{margin-left: 48px !important;} /* espaço entre o hambúrguer (termina aos 45px) e o logo */ /* Fora de prod (local + staging, onde existe o #env-bar): mostrar os elementos .only (o child index.php esconde-os fora de www.dreambooks.pt) para o cabeçalho ficar igual a prod. */ body:has(#env-bar) .only{display: inline-flex !important;} /* ancorado ao nav.uk-navbar (já position:relative), que começa no padding de 15px do container = mesmo x do botão antigo */ /* Widgets (etiqueta/carrinho/conta, módulo 393) encostados à DIREITA como em prod: lá era a barra do MobileMenuCK (flex:1) entre o logo e os widgets que os empurrava; aqui é o margin-left:auto. */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-left{flex: 1 1 auto; column-gap: 0;} /* o bloco esquerdo tem de ocupar a barra toda para o auto ter espaço; sem o gap de 40px do UIkit: a 390px, logo (190px) + gap + widgets (3×40px) passava os 345px e os widgets caíam para uma 2.ª linha (medido 2026-09-17 com UA móvel) — o margin-left:auto do #module-393 já dá o espaçamento */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-left > #module-393{margin-left: auto;} :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-toggle:hover, :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) .tm-header-mobile .uk-navbar-toggle[aria-expanded="true"]{color: #fff;} /* O painel abre ABAIXO da barra de topo (80px, ver .uk-navbar em mobile): a barra fica visível e o hambúrguer abre/fecha. */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile{top: 80px; z-index: 2147483000 !important;} /* por cima de widgets de 3.os (chat, etc.) que usam z-index muito alto */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) body:has(#env-bar) #tm-dialog-mobile{top: 110px;} /* local/staging: barra de ambiente de 30px acima do cabeçalho */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-offcanvas-bar{width: 100%; max-width: none; padding: 20px 20px calc(20px + env(safe-area-inset-bottom, 0px)); -webkit-overflow-scrolling: touch;} /* iOS: folga para o indicador inicial (safe area) e scroll com inércia */ /* cobre o ecrã todo abaixo da barra de topo */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-grid > div:first-child{order: 1;} /* pesquisa acima do menu: o menu atribuído por posição no config entra SEMPRE em 1.º na posição, por isso empurra-se o 1.º div (menu) para depois dos outros (pesquisa). Sem :has() de propósito: iOS < 15.4 não o suporta. */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-nav-accordion > li.uk-parent{margin: 0 -20px; padding: 0 20px; border-bottom: 1px solid #ECECEC;} :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-nav-accordion > li.uk-parent.uk-open{background: #F2F7F8;} /* Linha do pai em destaque (fundo azul claro + texto primário) quando o grupo está aberto, quando é a categoria da página atual, e em hover (só em dispositivos com rato). A linha ocupa a largura toda (margens negativas) e o realce nativo de toque fica desligado para não somar dois azuis. */ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-nav-accordion > li.uk-parent > a:first-child{margin: 0 -20px; padding-left: 20px; padding-right: 68px; -webkit-tap-highlight-color: transparent;} :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-nav-accordion > li.uk-parent.uk-open > a:first-child, :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-nav-accordion > li.uk-parent.uk-active > a:first-child{background: rgba(106,175,220,.18); color: var(--primary);} @media (hover: hover){ :is(html[lang="pt-pt"], html[lang="es-es"], html[lang="pt-br"]) #tm-dialog-mobile .uk-nav-accordion > li.uk-parent > a:first-child:hover{background: rgba(106,175,220,.18); color: var(--primary);} } /* A seta é posicionada em absoluto (não flex): o