/* Diário News — customizações * Espaços publicitários e relógio do cabeçalho. * Especificidade mantida baixa de propósito: o tema Newspaper deve conseguir * sobrescrever cor e tipografia sem precisar de !important. */ /* ------------------------------------------------------------------ * Barra da marca + data/hora, no topo absoluto da página * * O vermelho é o #D11517 que o tema já usava na faixa do logo, para a marca * continuar na mesma cor de antes. * ------------------------------------------------------------------ */ .dn-topbar { background: #d11517; color: #fff; } .dn-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; box-sizing: border-box; max-width: 1168px; margin: 0 auto; padding: 7px 12px; } .dn-topbar__marca { font-family: "Open Sans", -apple-system, BlinkMacSystemFont, sans-serif; font-size: 14px; font-weight: 800; line-height: 1; letter-spacing: 0.02em; text-transform: uppercase; text-decoration: none; color: #fff; } .dn-topbar__marca:hover, .dn-topbar__marca:focus { color: #fff; opacity: 0.85; } .dn-topbar .dn-datahora { color: #fff; font-family: "Open Sans", -apple-system, BlinkMacSystemFont, sans-serif; } .dn-topo-bar__inner { max-width: 1168px; margin: 0 auto; } /* Dentro do cabeçalho a faixa herdaria o vermelho do tema e o criativo ficaria * sobre ele. O cinza claro também separa visualmente o espaço publicitário do * conteúdo editorial, que é boa prática de sinalização de anúncio. */ .dn-topo-bar { background: #f4f4f4; } /* ------------------------------------------------------------------ * Ordem das faixas do cabeçalho * * O cliente pediu a faixa da logo de volta no topo. O estilo 11 do Newspaper * renderiza o menu ANTES dessa faixa, e o layout aprovado é o inverso: * logo → marca/relógio → banner → menu. * * Em vez de reescrever a marcação do tagDiv, o cabeçalho vira uma coluna flex e * a ordem é declarada aqui. A classe `dn-header-inline` é posta no pelo * PHP só quando a injeção dentro do cabeçalho dá certo, então se algo mudar no * tema estas regras simplesmente não se aplicam. * ------------------------------------------------------------------ */ .dn-header-inline .td-header-wrap { /* O !important aqui não é preferência de estilo. Existe um