/* Navbar: dropdown and profile menu */
.nav-dropdown { position: relative; display: inline-block; }
.nav-dropdown .dropdown-content { display:none; position:absolute; background:#1c2833; min-width:160px; z-index:1001; border-radius:6px; box-shadow:0 8px 16px rgba(0,0,0,0.2); }
.nav-dropdown:hover .dropdown-content { display:block; }
.nav-dropdown .dropdown-content a { color:#fff; padding:10px 14px; text-decoration:none; margin-left:0; padding-left:12px; display:block; }
.nav-dropdown .dropdown-content a:hover { background:#2c3e50; }

/* Mobile dropdown menu */
.dropdown-menu { position:fixed; top:80px; left:0; width:100%; z-index:1000; display:flex; flex-direction:column; background:rgba(20,24,30,0.98); backdrop-filter:blur(6px); border-radius:0 0 12px 12px; padding:1rem; opacity:0; transform:translateY(-20px); pointer-events:none; transition:opacity .4s ease, transform .4s ease; box-shadow:0 10px 30px rgba(0,0,0,.4); }
.dropdown-menu.open { opacity:1; transform:translateY(0); pointer-events:auto; }
.dropdown-menu a { color:#fff; text-decoration:none; padding:.6rem 0; font-size:1rem; border-bottom:1px solid rgba(255,255,255,.05); transition:color .2s ease; }
.dropdown-menu a:hover { color:#00c9db; }
.mobile-submenu { padding:10px 0; border-top:1px solid #444; }
.mobile-submenu .tools-toggle { background:none; border:none; color:#fff; font-size:1rem; text-align:left; padding:.75rem 0 .25rem 0; cursor:pointer; }
.tools-links { display:none; flex-direction:column; padding-left:1rem; opacity:0; transform:translateY(-5px); transition:all .3s ease; }
.tools-links.open { display:flex; opacity:1; transform:translateY(0); }
.tools-links a { font-size:.9rem; }
.hamburger-menu { background:none; border:none; position:absolute; right:20px; top:20px; font-size:1.8rem; color:#fff; cursor:pointer; z-index:1001; transition:transform .3s ease; }
.hamburger-menu:hover { transform:scale(1.15); }

/* Profile dropdown */
.sf-avatar { width:34px; height:34px; margin-left:20px; border-radius:50%; object-fit:cover; border:1px solid rgba(255,255,255,0.15); }
.sf-dropdown{ position:absolute; right:80px; top:45px; background:#1c2833; border-radius:10px; min-width:240px; box-shadow:0 10px 30px rgba(0,0,0,.35); display:none; flex-direction:column; opacity:0; transform:translateY(-10px); transition:opacity .18s ease, transform .18s ease; z-index:1500; overflow:hidden; }
.sf-dropdown.open{ display:flex; opacity:1; transform:translateY(0); }
.sf-menu-head{ padding:10px 14px 6px; border-bottom:1px solid rgba(255,255,255,.06); }
.sf-user-name{ font-weight:600; color:#fff; font-size:14px; }
.sf-user-email{ color:#c8d0d8; font-size:12px; margin-top:2px; }
.sf-dropdown-item{ background:none; border:0; color:#fff; text-align:left; padding:10px 14px; font:14px Poppins,system-ui; cursor:pointer; width:100%; }
.sf-dropdown-item:hover{ background:#2c3e50; }
.sf-divider{ height:1px; background:rgba(255,255,255,.08); margin:6px 0; }

html[data-auth="in"]  .only-guest { display:none !important; }
html[data-auth="out"] .only-user  { display:none !important; }

/* Sign-in mini panel */
.sf-signin-panel{ max-height:0; opacity:0; overflow:hidden; transition:max-height .25s ease, opacity .2s ease, padding .2s ease; padding:0 12px; gap:8px; display:flex; flex-direction:column; }
.sf-signin-panel.open{ max-height:220px; opacity:1; padding:8px 12px 12px; }
.sf-field input{ width:100%; padding:10px 12px; border-radius:8px; border:1px solid rgba(255,255,255,0.15); background:#203143; color:#fff; outline:none; }
.sf-field input::placeholder{ color:#9fb3c8; }
.sf-login-btn{ background:#2980b9; color:#fff; border:none; padding:10px 12px; border-radius:8px; cursor:pointer; }
.sf-login-btn:disabled{ opacity:.6; cursor:not-allowed; }
.sf-auth-msg{ color:#ffb4b4; font-size:12px; min-height:16px; }
.sf-auth-small{ color:#c8d0d8; font-size:12px; }
.sf-auth-small a{ color:#00c9db; text-decoration:none; }
.sf-auth-small a:hover{ text-decoration:underline; }


/* Shared original header geometry, also used by standalone tools. */
#navbar-container{position:relative;z-index:5000;font-family:Poppins,sans-serif}
#navbar-container header{box-sizing:border-box;position:fixed;top:0;left:0;width:100%;height:80px;padding:20px 40px;background:#1c2e40f2;display:flex;align-items:center;justify-content:space-between;color:white;z-index:5000}
#navbar-container #navlogo{height:58px;width:auto;max-width:210px;object-fit:contain;opacity:1}
#navbar-container #navbar{display:flex;align-items:center;gap:0}
#navbar-container #navbar>a,#navbar-container .nav-dropdown>a{color:white;margin-left:20px;font-size:16px;text-decoration:none}
#navbar-container .nav-dropdown.open .dropdown-content,#navbar-container .nav-dropdown:focus-within .dropdown-content{display:block}
#navbar-container .sf-dropdown-item{box-sizing:border-box;margin-left:0!important;text-decoration:none}
#navbar-container .sf-field input{box-sizing:border-box;font:14px Poppins,sans-serif}
#navbar-container .sf-signin-panel.open{max-height:320px}
#navbar-container .hamburger-menu{display:none}
#navbar-container .dropdown-menu{box-sizing:border-box;max-height:calc(100dvh - 80px);overflow-y:auto}
#navbar-container :is(a,button,input,[role=button]):focus-visible{outline:2px solid #55b9f0;outline-offset:3px}
@media(max-width:768px){#navbar-container header{padding:20px}#navbar-container #navbar>:not(#sfUserSlot){display:none}#navbar-container #navbar{display:flex;margin-right:50px}#navbar-container .hamburger-menu{display:block}#navbar-container #navlogo{max-width:170px}#navbar-container .sf-dropdown{right:0!important;width:260px;max-width:calc(100vw - 28px)}#navbar-container .sf-avatar{margin:0}#navbar-container .dropdown-menu.open{display:flex}}
@media(prefers-reduced-motion:reduce){#navbar-container *{transition:none!important}}