/* Identidade do portal (Configurações → Identidade do portal).
   .ph-escuro: cabeçalho na cor escura da paleta, com o logo branco.
   .ph-aba:    o logo fica numa "aba" que desce abaixo do cabeçalho e volta numa
               curva suave, como no topo do painel. */

/* ---------- cabeçalho escuro */
.main-header.ph-escuro, .main-header.ph-escuro.fixed-header, .main-header.ph-escuro .mobile-header { background-color:var(--c-topo, #0F2747); }
.main-header.ph-escuro .main-menu .navigation > li > a { color:rgba(255,255,255,.92); }
.main-header.ph-escuro .main-menu .navigation > li.current > a,
.main-header.ph-escuro .main-menu .navigation > li:hover > a { color:#fff; text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:2px; }
.main-header.ph-escuro .upload-cv { color:#fff; }
.main-header.ph-escuro .btn-style-three { background-color:rgba(255,255,255,.14) !important; color:#fff !important; }
.main-header.ph-escuro .btn-style-three:hover { background-color:rgba(255,255,255,.24) !important; color:#fff !important; }
.main-header.ph-escuro .user-name { color:#fff; }
.main-header.ph-escuro .sino__botao { background:transparent; border-color:rgba(255,255,255,.3); color:#fff; }
.main-header.ph-escuro .mobile-nav-toggler, .main-header.ph-escuro .mobile-nav-toggler span,
.main-header.ph-escuro .mobile-header a, .main-header.ph-escuro .mobile-header .icon, .main-header.ph-escuro .mobile-header [class*="icon-"],
.main-header.ph-escuro .mobile-header [class*="la-"], .main-header.ph-escuro .mobile-header [class*="flaticon"] { color:#fff !important; }
.ph-logo-branco { filter:brightness(0) invert(1); }

/* ---------- aba atrás do logo (só no computador) */
@media (min-width:1024px) {
  .main-header.ph-aba { --ph-extra:14px; --ph-curva:8px; --ph-canto:8px; }
  .main-header.ph-aba .main-box { align-items:stretch; }
  .main-header.ph-aba .nav-outer { align-items:stretch; }
  .main-header.ph-aba .nav-outer > .main-menu, .main-header.ph-aba .outer-box { align-self:center; }
  .main-header.ph-aba .logo-box {
    position:relative; z-index:2; align-items:center;
    /* a aba desce --ph-extra abaixo do cabeçalho e o logo fica centrado na altura toda dela */
    margin:0 40px calc(-1 * var(--ph-extra)) -60px; padding:0 24px 0 24px;
    background:inherit; background-color:var(--ph-fundo, #fff);
    border-bottom-right-radius:var(--ph-canto);
    box-shadow:0 12px 20px -14px rgba(16,24,40,.35);
  }
  .main-header.ph-aba.ph-escuro .logo-box { --ph-fundo:var(--c-topo, #0F2747); box-shadow:0 12px 22px -14px rgba(16,24,40,.6); }
  .main-header.ph-aba .logo { margin-right:0; padding:0; }
  /* curva invertida no encontro da aba com a linha de baixo do cabeçalho */
  .main-header.ph-aba .logo-box::after {
    content:""; position:absolute; left:100%; top:calc(100% - var(--ph-extra));
    width:var(--ph-curva); height:var(--ph-curva); pointer-events:none;
    background:radial-gradient(circle at 100% 100%, transparent calc(var(--ph-curva) - .5px), var(--ph-fundo, #fff) var(--ph-curva));
  }
}
/* telas internas do trabalhador: o cabeçalho fica num .container-fluid com 12px de margem,
   que deixava um vão à esquerda da aba (a aba tem de encostar na borda, como na página inicial) */
@media (min-width:1024px) {
  .dashboard .main-header.ph-aba > .container-fluid { padding-left:0; }
}
/* o cabeçalho tem 60px de respiro lateral (15px até 1366px): a aba encosta na borda */
@media (min-width:1024px) and (max-width:1366px) {
  .main-header.ph-aba .logo-box { margin-left:-15px; padding-left:15px; }
}

/* logo de qualquer formato (largo, quadrado, alto): limita altura e largura e nunca deforma */
.main-header .main-box .logo { width:auto; display:flex; align-items:center; }
.main-header .main-box .logo a { display:flex; align-items:center; }
.main-header .main-box .logo img { width:auto !important; height:auto !important; max-height:52px; max-width:260px; object-fit:contain; object-position:left center; }

/* lado direito do cabeçalho: botões mais perto da borda e mais próximos entre si,
   cada um com a largura do próprio texto (o tema forçava 140px e 20px de espaço) */
@media (min-width:1367px) {
  .main-header .main-box { padding-right:24px; }
}
.main-header .outer-box { gap:8px; }
.main-header .outer-box .upload-cv { margin-right:8px; }
.main-header .outer-box .btn-box { gap:8px; }
.main-header .outer-box .btn-box a { margin-left:0; min-width:0; }
.main-header .outer-box .btn-box .theme-btn { padding:10px 16px; min-width:0; font-size:13px; }

/* ---------- botões redondos do cabeçalho: um padrão só (sino, favoritos, foto) ----------
   40px, mesmo contorno, mesmo espaço entre eles e contadores do mesmo tamanho */
.main-header .outer-box { gap:10px; align-items:center; }
.main-header .outer-box > .sino, .main-header .outer-box > .menu-btn, .main-header .outer-box > .dashboard-option { margin:0 !important; }
.main-header .sino__botao, .main-header .menu-btn {
  position:relative; width:40px; height:40px; padding:0; border-radius:50%; display:grid; place-items:center;
  border:1px solid #D1D5DB; background:#fff; color:#1F2937; cursor:pointer; }
.main-header .menu-btn .icon { font-size:20px; color:inherit; line-height:1; }
.main-header .menu-btn:hover, .main-header .sino__botao:hover { background:#F3F4F6; }
.main-header.ph-escuro .sino__botao, .main-header.ph-escuro .menu-btn { background:transparent; border-color:rgba(255,255,255,.3); color:#fff; }
.main-header.ph-escuro .menu-btn:hover, .main-header.ph-escuro .sino__botao:hover { background:rgba(255,255,255,.12); }
.main-header .menu-btn .count, .main-header .sino__badge {
  position:absolute; top:-5px; right:-5px; min-width:20px; width:auto; height:20px; padding:0 5px; border-radius:999px;
  display:grid; place-items:center; font-size:11.5px; font-weight:700; line-height:1; color:#fff; background:#B91C1C;
  box-shadow:0 0 0 2px var(--c-topo, #fff); }
.main-header:not(.ph-escuro) .menu-btn .count, .main-header:not(.ph-escuro) .sino__badge { box-shadow:0 0 0 2px #fff; }
.main-header .menu-btn .count[hidden] { display:none; }
.main-header .dashboard-option .dropdown-toggle { display:flex; align-items:center; gap:8px; }
.main-header .dashboard-option .thumb { width:40px; height:40px; }
.main-header.ph-escuro .dashboard-option .name { color:#fff; }
.main-header .mobile-header .sino__botao, .main-header .mobile-header #toggle-user-sidebar .thumb { width:40px; height:40px; }
.main-header .dashboard-option .name { margin:0; padding:0; }