/* Eén openbare Fenix-header. Geen globale body- of header-regels. */
.fxsite-header, .fxsite-header * { box-sizing:border-box; }
.fxsite-header { position:sticky; top:0; z-index:45000; width:100%; height:100px; background:#fff; border-bottom:1px solid #e3e7ec; color:#151b2d; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
.fxsite-inner { width:min(1680px,calc(100% - 48px)); height:100%; margin:auto; display:flex; align-items:center; gap:42px; }
.fxsite-logo { display:flex; align-items:center; flex:none; text-decoration:none; }
.fxsite-logo img { display:block; width:210px; max-height:80px; object-fit:contain; }
.fxsite-nav { display:flex; align-items:center; justify-content:flex-end; margin-left:auto; gap:8px; white-space:nowrap; }
.fxsite-nav > a, .fxsite-nav > details > summary, .fxsite-nav > button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:0 13px; border:1px solid transparent; border-radius:12px; background:transparent; color:#151b2d; text-decoration:none; font:900 16px/1.2 Inter,ui-sans-serif,system-ui,sans-serif; cursor:pointer; }
.fxsite-nav > details { position:relative; }
.fxsite-nav summary { list-style:none; }
.fxsite-nav summary::-webkit-details-marker { display:none; }
.fxsite-nav summary::after { content:'⌄'; margin-left:9px; color:#667085; font-size:14px; }
.fxsite-nav details[open] > summary, .fxsite-nav > a:not(.fxsite-login):not(.fxsite-start):hover { color:#bf6700; background:#fff8ee; }
.fxsite-panel { position:absolute; top:calc(100% + 8px); left:0; width:245px; padding:9px; border:1px solid #e3e7ec; border-radius:15px; background:#fff; box-shadow:0 20px 45px rgba(15,23,35,.16); }
.fxsite-panel a { display:block; padding:12px; border-radius:8px; color:#151b2d; text-decoration:none; font-size:14px; font-weight:750; }
.fxsite-panel a:hover { background:#fff8ee; color:#bf6700; }
.fxsite-nav > .fxsite-language { margin-left:12px; }
.fxsite-language > summary { min-width:78px; background:#f4f5f7 !important; border-radius:999px !important; }
.fxsite-language .fxsite-panel { left:auto; right:0; width:170px; }
.fxsite-nav > .fxsite-login, .fxsite-nav > #logoutBtn { min-width:140px; margin-left:2px; padding:0 22px; border-color:#dbe1e9; border-radius:999px; background:#fff; }
.fxsite-nav > .fxsite-start, .fxsite-nav > .fxsite-start:link, .fxsite-nav > .fxsite-start:visited, .fxsite-nav > .fxsite-start:hover, .fxsite-nav > .fxsite-start:focus { min-width:210px; min-height:62px; padding:0 28px; border:1px solid #d07800; border-radius:999px; background:#d07800; color:#fff; }
.fxsite-nav > #userLabel:not(.fxsite-login) { display:none; }
.fxsite-menu { display:none; width:48px; height:48px; margin-left:auto; border:1px solid #e3e7ec; border-radius:50%; background:#f4f5f7; color:#151b2d; font-size:22px; cursor:pointer; }
.fxsite-drawer[hidden] { display:none !important; }
.fxsite-drawer { position:fixed; inset:0; z-index:65000; display:flex; justify-content:flex-end; background:rgba(15,23,35,.52); }
.fxsite-drawer-inner { width:min(430px,92vw); height:100%; overflow:auto; padding:25px; background:#fff; box-shadow:-20px 0 65px rgba(15,23,35,.2); }
.fxsite-drawer-head { display:flex; align-items:center; justify-content:space-between; padding-bottom:20px; border-bottom:1px solid #e3e7ec; }
.fxsite-drawer-head img { width:175px; }
.fxsite-close { width:44px; height:44px; border:0; border-radius:50%; background:#f4f5f7; font-size:23px; cursor:pointer; }
.fxsite-drawer nav { display:grid; gap:8px; margin:22px 0; }
.fxsite-drawer nav a { padding:14px; border:1px solid #e3e7ec; border-radius:10px; color:#151b2d; text-decoration:none; font-weight:850; }
.fxsite-drawer nav a.fxsite-start { background:#d07800; color:#fff; border-color:#d07800; }
body > header:not(.fxsite-header) { display:none !important; }
body > #menuOverlay { display:none !important; }
@media(max-width:1330px) { .fxsite-nav { display:none; } .fxsite-menu { display:block; } }
@media(max-width:650px) { .fxsite-header { height:76px; } .fxsite-inner { width:calc(100% - 30px); } .fxsite-logo img { width:160px; } }

/* Gecentreerde, gedeelde navigatie; v2. */
.fxsite-inner { width:min(1560px,calc(100% - 48px)); gap:28px; }
.fxsite-nav { flex:1; justify-content:center; margin-left:0; gap:8px; }
.fxsite-nav > .fxsite-language { margin-left:0; }
.fxsite-nav > .fxsite-start { min-width:225px; }

/* Telefoonmenu volgt dezelfde hoofdindeling als de desktopbalk. */
.fxsite-drawer-inner { height:100dvh; max-height:100%; overscroll-behavior:contain; padding-bottom:max(24px,env(safe-area-inset-bottom)); }
.fxsite-drawer nav { gap:9px; }
.fxsite-drawer nav > a, .fxsite-drawer nav > details > summary, .fxsite-mobile-language { display:flex; align-items:center; min-height:52px; padding:11px 16px; border:1px solid #e3e7ec; border-radius:12px; background:#fff; color:#151b2d; font:850 16px/1.3 Inter,ui-sans-serif,system-ui,sans-serif; text-decoration:none; }
.fxsite-drawer nav > details > summary { list-style:none; cursor:pointer; }
.fxsite-drawer nav > details > summary::-webkit-details-marker { display:none; }
.fxsite-drawer nav > details > summary::after { content:'⌄'; margin-left:auto; color:#667085; }
.fxsite-drawer nav > details[open] > summary::after { transform:rotate(180deg); }
.fxsite-mobile-sub { display:grid; gap:2px; padding:5px 8px 9px 13px; }
.fxsite-mobile-sub a { display:block; padding:10px 14px !important; border:0 !important; border-radius:8px !important; font-size:15px; }
.fxsite-drawer nav > a.fxsite-start { background:#d07800; color:#fff; border-color:#d07800; border-radius:999px; }
.fxsite-mobile-language { background:#f4f5f7; }
.fxsite-drawer a:focus-visible,.fxsite-drawer summary:focus-visible,.fxsite-menu:focus-visible,.fxsite-close:focus-visible { outline:3px solid #ff6a14; outline-offset:2px; }
@media(max-width:650px) { .fxsite-drawer-inner { width:min(380px,92vw); padding:17px 18px; } .fxsite-drawer-head { padding-bottom:14px; } .fxsite-drawer-head img { width:150px; } .fxsite-drawer nav { margin:16px 0; } }

/* Schermbreedte en toetsenbordgebruik. */
.fxsite-drawer nav > details { min-width:0; }
.fxsite-drawer nav > details > summary { font:850 16px/1.3 Inter,ui-sans-serif,system-ui,sans-serif; }
.fxsite-drawer nav > a, .fxsite-drawer nav > details > summary { overflow-wrap:anywhere; }
@media (max-width:650px) { .fxsite-logo img { max-width:calc(100vw - 105px); } }

/* =====================================================
   FENIX PUBLIC HEADER - LOGO UITERST LINKS
   Zelfde merk-as als Fenix Planner
   ===================================================== */

@media(min-width:1051px){

  .fxsite-header{
    width:100%!important;
  }

  .fxsite-inner{
    width:100%!important;
    max-width:none!important;
    margin:0!important;

    padding-left:16px!important;
    padding-right:24px!important;

    box-sizing:border-box!important;
  }

  .fxsite-logo{
    margin-left:0!important;
    margin-right:0!important;
    flex:0 0 auto!important;
  }

  /*
   * Navigatie gebruikt de resterende ruimte.
   * Het logo staat daardoor los op de linker merk-as,
   * zonder dat het menu tegen het logo aankruipt.
   */
  .fxsite-nav{
    margin-left:auto!important;
  }
}

@media(max-width:1050px){

  .fxsite-inner{
    padding-left:12px!important;
    padding-right:12px!important;
  }

}

