/* ============================================================
   EMEA — Site Chrome (Header + Footer GLOBAIS)
   Componente ÚNICO de navbar + footer, idêntico ao da Home
   (index.html). Reutilizado por todas as páginas da Área Cliente
   (dashboard*.html). Carregar DEPOIS de dashboard.css.
   O estado autenticado (.nav-user) vem de auth-nav.css — o MESMO
   arquivo de componente usado pela Home.
   ============================================================ */
:root{
  --emea-blue:#004AAD;
  --emea-blue-hover:#003A8C;
  --violet-500:#004AAD;
  --ink:#0A0E1A;
  --radius-pill:999px;
  --ease:cubic-bezier(.22,.61,.36,1);
  /* Paleta da navbar branca premium (igual à Home) */
  --primary:#003B8F;
  --primary-dark:#002E73;
  --background:#FFFFFF;
  --text:#1A1A1A;
  --header-h:96px;            /* navbar: mesma altura da Home */
}

/* ===== HEADER — navbar branca premium (idêntico à Home) ===== */
.header{
  position:fixed;top:0;left:0;right:0;width:100%;z-index:100;
  background:#FFFFFF;
  border-bottom:1px solid rgba(0,59,143,.06);
  box-shadow:0 1px 3px rgba(0,30,80,.06), 0 1px 2px rgba(0,30,80,.04);
}
.header-inner{
  max-width:1440px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 32px;height:var(--header-h);
}
/* Logo: fundo transparente, sem caixa/moldura */
.header .logo{display:flex;align-items:center;background:transparent;padding:0;border:0;border-radius:0;box-shadow:none}
.header .logo-mark{width:clamp(104px,12vw,130px);height:auto;display:block}

/* Links do menu em azul escuro (cor principal) */
.header .nav{display:flex;gap:8px}
.header .nav-link{
  display:inline-flex;align-items:center;
  padding:10px 18px;border-radius:var(--radius-pill);
  font-weight:600;font-size:15px;color:var(--primary);
  transition:color .2s ease, background .2s ease;
  text-decoration:none;
}
.header .nav-link:hover,.header .nav-link.active{color:var(--primary-dark);background:rgba(0,59,143,.06)}

.header-actions{display:flex;align-items:center;gap:10px}
/* Botão "Area Clienti" (btn-ghost): fundo branco, borda+texto azul escuro */
.header .btn-ghost{
  padding:14px 24px;border-radius:var(--radius-pill);
  background:#fff;color:var(--primary);font-weight:700;font-size:15px;
  border:1.5px solid var(--primary);
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.header .btn-ghost:hover{background:rgba(0,59,143,.06);color:var(--primary-dark);border-color:var(--primary-dark);transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,59,143,.12)}
/* Botão "Contattaci" (btn-primary): fundo azul escuro, texto branco */
.header .btn-primary{
  padding:14px 28px;border-radius:var(--radius-pill);
  background:var(--primary);color:#fff;font-weight:700;font-size:15px;
  box-shadow:0 2px 6px rgba(0,59,143,.20);
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}
.header .btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,59,143,.28)}
/* Hamburguer (mobile) em azul escuro */
.header .menu-toggle{display:none;width:42px;height:42px;border-radius:50%;color:var(--primary);place-items:center}

/* O estado autenticado (.nav-user / avatar / menu) é fornecido por
   auth-nav.css — o MESMO componente compartilhado com a Home. */

/* ===== FOOTER — branco, centralizado (idêntico à Home) ===== */
footer{background:#FFFFFF;color:#4B5563;padding:80px 64px 48px;font-size:14px;border-radius:24px;box-shadow:0 10px 30px rgba(0,0,0,0.05);position:relative;z-index:10}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;justify-content:center;align-items:flex-start;gap:140px;flex-wrap:wrap}
.footer-brand{flex:0 1 420px;display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.footer-brand .logo{margin-bottom:28px}
.footer-brand p{max-width:420px;line-height:1.6;margin:0}
.footer .logo-mark{width:150px;height:auto;display:block}
.logo-footer .logo-mark{width:150px}
.footer-col{flex:0 1 200px}
.footer-col h4{color:#111827;font-weight:700;margin-bottom:18px;font-size:15px}
.footer-col a{display:block;padding:6px 0;color:#374151;transition:color .2s}
.footer-col a:hover{color:#111827}
.footer-bottom{max-width:1200px;margin:48px auto 0;padding-top:28px;border-top:1px solid #E5E7EB;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:13px}

/* ============================================================
   ESTRUTURA DA PÁGINA (raiz do layout)
   <header.header>  navbar fixa, 100% largura, estável
   <div.dashboard-layout>  sidebar + main-content
   <footer>  após o conteúdo (branco, em coluna)
   Compensa-se o topo com padding-top = altura da navbar.
   ============================================================ */
body{display:flex;flex-direction:column;min-height:100vh;padding-top:var(--header-h)}
footer{flex:none;width:100%}

/* ===== RESPONSIVO (igual à Home) ===== */
@media (max-width:1024px){
  .header .nav{display:none}
  .header .menu-toggle{display:grid}
  .header-inner{padding:0 20px}
  .header-actions .btn-primary{display:none}
}
@media (max-width:600px){
  :root{--header-h:82px}
  .header .logo-mark{width:clamp(92px,24vw,112px)}
  footer{padding:48px 24px 24px}
  .footer-bottom{flex-direction:column;gap:12px;text-align:center}
}
