/* ═══════════════════════════════════════════════════════════════════
   cp-header.css — header proprio (modo cp). So carrega quando o
   cp_header_mode ativa o swap; no modo bb este arquivo nem e enfileirado.
   O container externo continua sendo o #masthead.site-header do tema
   (fixed, altura, fundo, sombra vem dele) — este CSS cuida do MIOLO.
   ═══════════════════════════════════════════════════════════════════ */

/* Blindagem contra o tema: .site-header i { font-size:24px; color:var(...) }
   atinge todo <i> dentro do masthead (mesma lição do mega-menu). */
#cp-header i, .cp-hd-mpanel i { font-size: inherit !important; color: inherit !important; }

#cp-header, #cp-header * , .cp-hd-mpanel, .cp-hd-mpanel * { box-sizing: border-box; }

#cp-header { height: 100%; }
.cp-hd-inner { display: flex; align-items: center; height: 100%; padding: 0 26px; gap: 22px; }

/* logo: reusa o site-logo do tema; so contem o tamanho */
.cp-hd-logo { flex-shrink: 0; display: flex; align-items: center; }
.cp-hd-logo .site-title { margin: 0 !important; padding: 0 !important; }
.cp-hd-logo img.bb-logo { max-height: 40px; width: auto; display: block; }

/* portas */
.cp-hd-nav { height: 100%; }
.cp-hd-portas { display: flex; align-items: center; gap: 2px; height: 100%; list-style: none !important; margin: 0 !important; padding: 0 !important; }
.cp-hd-portas > li { list-style: none !important; height: 100%; display: flex; margin: 0 !important; }
.cp-hd-portas > li > a { display: flex; align-items: center; height: 100%; padding: 0 15px; font-size: 13.5px; font-weight: 500 !important; color: #4a4a4a !important; text-decoration: none !important; cursor: pointer; white-space: nowrap; }
.cp-hd-portas > li > a:hover { color: #1A1A1A !important; }
/* .cp-menu-selected (fio amarelo) vem do cp-menu-css e aplica no <span> */

/* aside */
.cp-hd-aside { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.cp-hd-btn { display: inline-flex; align-items: center; border-radius: 8px; padding: 9px 18px; font-size: 13px; font-weight: 700 !important; text-decoration: none !important; white-space: nowrap; transition: background .2s, color .2s; }
.cp-hd-btn-cta { background: #1A1A1A !important; color: #fff !important; }
.cp-hd-btn-cta:hover { background: #F7D44A !important; color: #1A1A1A !important; }
.cp-hd-btn-ghost { border: 1px solid #dfe1e5; color: #1A1A1A !important; background: #fff; }
.cp-hd-btn-ghost:hover { border-color: #1A1A1A; }

.cp-hd-bell { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; color: #4a4a4a !important; text-decoration: none !important; }
.cp-hd-bell i { font-size: 17px !important; }
.cp-hd-bell:hover { background: #f4f5f7; color: #1A1A1A !important; }

/* avatar + dropdown */
.cp-hd-user { position: relative; }
.cp-hd-avatar-btn { border: 2px solid transparent; background: transparent; padding: 0; border-radius: 50%; cursor: pointer; display: flex; }
.cp-hd-avatar-btn img { width: 36px; height: 36px; border-radius: 50%; display: block; }
.cp-hd-user.open .cp-hd-avatar-btn { border-color: #F7D44A; }

.cp-hd-drop { position: absolute; top: calc(100% + 10px); right: 0; width: 272px; background: #fff; border: 1px solid #e3e5e9; border-radius: 12px; box-shadow: 0 14px 34px rgba(20,24,31,.14); padding: 7px; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .18s, transform .18s, visibility .18s; z-index: 120; }
.cp-hd-user.open .cp-hd-drop { opacity: 1; visibility: visible; transform: translateY(0); }
.cp-hd-drop-head { padding: 9px 10px 11px; border-bottom: 1px solid #ededf0; margin-bottom: 6px; }
.cp-hd-drop-nm { font-size: 13.5px; font-weight: 700; color: #1A1A1A; }
.cp-hd-drop-pl { font-size: 11.5px; color: #5b6470; margin-top: 1px; }
.cp-hd-grp { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #9aa0aa; padding: 8px 10px 4px; margin: 0; }
/* Blindagem completa nos itens (regra do projeto pra tudo sob o BuddyBoss):
   o tema estiliza a.user-link (o "Meu Perfil" carregava fonte e espaçamento
   diferentes — 1º achado do dogfood) e vaza padding/line-height em <a> do
   header. font-size/weight/line-height/padding/margin com !important. */
.cp-hd-drop a.cp-hd-it { display: flex; align-items: center; gap: 10px; padding: 7px 10px !important; margin: 0 !important; border-radius: 6px; font-size: 13px !important; font-weight: 400 !important; line-height: 1.45 !important; color: #1A1A1A !important; text-decoration: none !important; transition: background .13s; }
.cp-hd-drop a.cp-hd-it:hover { background: #f4f5f7; }
.cp-hd-drop a.cp-hd-it i { width: 17px; text-align: center; color: #8b929c !important; font-size: 13px !important; }
.cp-hd-sep { height: 1px; background: #ededf0; margin: 6px 4px; }
.cp-hd-drop a.cp-hd-it.cp-hd-it-out, .cp-hd-drop a.cp-hd-it.cp-hd-it-out i { color: #bd4f30 !important; }

/* mobile */
.cp-hd-burger { display: none; border: 0; background: transparent; padding: 8px; cursor: pointer; color: #1A1A1A; }
.cp-hd-burger i { font-size: 19px !important; }

.cp-hd-mpanel { position: fixed; top: 0; left: 0; bottom: 0; width: 320px; max-width: 86vw; background: #fff; z-index: 1001; transform: translateX(-102%); transition: transform .22s ease; overflow-y: auto; box-shadow: 12px 0 28px rgba(20,24,31,.12); }
.cp-hd-mpanel.open { transform: translateX(0); }
.cp-hd-mpanel-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #ededf0; position: sticky; top: 0; background: #fff; }
.cp-hd-mpanel-title { font-size: 14px; font-weight: 700; color: #1A1A1A; }
.cp-hd-mpanel-close { border: 0; background: transparent; padding: 6px; cursor: pointer; color: #4a4a4a; }
.cp-hd-mpanel-close i { font-size: 16px !important; }
.cp-hd-mnav { padding: 8px 0 24px; }
.cp-hd-mlist { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.cp-hd-mlist li { list-style: none !important; margin: 0 !important; }
.cp-hd-mlist li a { display: block; padding: 10px 16px; font-size: 13.5px; color: #1A1A1A !important; text-decoration: none !important; border-bottom: 1px solid #f4f5f7; }
.cp-hd-mlist li a:hover { background: #f4f5f7; }
/* 2º achado do dogfood: 23 dos 45 itens do menu WP são filhos aninhados e o
   CSS global do tema esconde .sub-menu — o painel mostrava só o nível 1.
   Aqui o sub-menu é estático e visível, indentado (paridade V1; accordion
   fica pra fase de conteúdo, se fizer sentido). */
.cp-hd-mnav .sub-menu { display: block !important; position: static !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important; list-style: none !important; background: transparent !important; box-shadow: none !important; border: 0 !important; transform: none !important; }
.cp-hd-mlist .sub-menu li a { padding-left: 30px !important; color: #5b6470 !important; font-size: 13px !important; }

.cp-hd-moverlay { position: fixed; inset: 0; background: rgba(20,24,31,.28); z-index: 1000; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
.cp-hd-moverlay.open { opacity: 1; visibility: visible; }

@media only screen and (max-width: 1080px) {
  .cp-hd-nav, .cp-hd-btn-cta { display: none; }
  .cp-hd-burger { display: inline-flex; }
  .cp-hd-inner { padding: 0 14px; gap: 12px; }
}

/* ── N2: headers de seção do painel mobile (fonte: cadastro, modo db) ── */
.cp-hd-mgrp { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #9aa0aa; padding: 16px 16px 6px; }
.cp-hd-mnav ul.cp-hd-mlist + .cp-hd-mgrp, .cp-hd-mnav .cp-hd-mlist ~ .cp-hd-mgrp { border-top: 1px solid #ededf0; margin-top: 6px; }
