/* ============================================================
   HSD nav.css — updated for dark SaaS navbar
   Old Bootstrap navbar hidden. All legacy classes preserved.
   ============================================================ */

/* ── Kill old body padding (belt+suspenders — also fixed in global.css) ── */
body {
    padding-top: 0 !important;
}

/* ── Hide old Bootstrap navbar shell entirely ── */
nav.navbar,
.navbar-collapse,
.navbar-toggler,
.navbar-brand,
.modern-divider-glow {
    display: none !important;
}

/* ── Kill jm-topbar offset — new nav is sticky, doesn't need it ── */
.navbar {
    top: 0 !important;
    transition: none !important;
}

/* ============================================================
   INNER WRAPPER
   ============================================================ */
.hsd-nav-inner {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

@media (min-width: 768px) {
    .hsd-nav-inner { padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media (min-width: 992px) {
    .hsd-nav-inner { flex-wrap: nowrap; padding-left: 3rem; padding-right: 3rem; }
}

/* ============================================================
   VERTICAL DIVIDER
   ============================================================ */
.vl {
    margin: 0 8px;
    border-left: 1px solid rgba(0,0,0,.12);
    height: 24px;
    align-self: center;
    flex-shrink: 0;
}

/* ============================================================
   LEGACY DROPDOWN STYLES — kept for admin/other pages
   ============================================================ */
.hsd-company-menu,
.hsd-account-menu {
    border: 1px solid rgba(15,110,86,.12);
    border-radius: 16px;
    padding: .5rem;
    box-shadow: 0 16px 48px rgba(0,0,0,.10), 0 4px 12px rgba(15,110,86,.06);
    min-width: 260px;
    margin-top: 8px !important;
    background: #fff;
}
.hsd-dd-section-label {
    font-size: 10px; font-weight: 700; color: #8aaba0;
    text-transform: uppercase; letter-spacing: .07em;
    padding: 6px 10px 3px;
}
.hsd-dd-divider { border-color: rgba(15,110,86,.08); margin: .4rem .5rem; }
.hsd-dd-item {
    display: flex !important; align-items: center; gap: 10px;
    padding: 7px 10px !important; border-radius: 10px !important;
    transition: background .12s; cursor: pointer;
    width: 100%; background: none; border: none;
    text-align: left; text-decoration: none; color: inherit;
}
.hsd-dd-item:hover, .hsd-dd-item.active { background: #f0faf7 !important; color: inherit !important; }
.hsd-logout-item:hover { background: #fee2e2 !important; }
.hsd-dd-icon { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 12px; }
.hsd-dd-item-name { display: block; font-size: 13px; font-weight: 600; color: #0d1f1a; line-height: 1.2; }
.hsd-dd-item-desc { display: block; font-size: 11px; color: #8aaba0; font-family: 'DM Sans',sans-serif; margin-top: 1px; }
.hsd-account-chip { display: flex; align-items: center; gap: 10px; padding: 10px 12px 6px; }
.hsd-account-avatar { width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg,#0F6E56,#185FA5); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; color: #fff; font-family: 'Syne',sans-serif; flex-shrink: 0; }
.hsd-account-name { font-size: 13px; font-weight: 700; color: #0d1f1a; line-height: 1.2; }
.hsd-account-role { font-size: 11px; color: #8aaba0; font-family: 'DM Sans',sans-serif; }

/* ============================================================
   LANGUAGE DROPDOWN (legacy)
   ============================================================ */
.language-dropdown { position: relative; display: inline-block; }
.language-selected { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid rgba(0,0,0,.15); border-radius: 6px; padding: 5px 10px; cursor: pointer; font-size: 13px; white-space: nowrap; }
.language-menu { display: none; position: absolute; top: calc(100% + 6px); left: 0; background: #fff; border: 1px solid rgba(15,110,86,.15); border-radius: 10px; min-width: 180px; z-index: 1050; box-shadow: 0 8px 24px rgba(0,0,0,.10); overflow: hidden; }
.language-item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer; font-size: 13px; transition: background .12s; }
.language-item:hover { background: #e6f4f0; color: #0F6E56; }
.flag { width: 20px; height: 20px; border-radius: 2px; object-fit: cover; }

/* ============================================================
   LEGACY MEGA MENU
   ============================================================ */
.mega-menu { border-top: 2px solid #0F6E56 !important; box-shadow: 0 20px 60px rgba(0,0,0,.10) !important; border-radius: 0 0 16px 16px !important; background: #fff; }
.mega-inner { display: flex; }
.mega-sidebar { width: 200px; flex-shrink: 0; background: #f8faf9; border-right: 1px solid rgba(0,0,0,.06); padding: 1.25rem 0; }
.mega-sidebar-item { display: flex; align-items: center; gap: 10px; padding: 10px 20px; cursor: pointer; font-size: 14px; font-weight: 500; color: #4b5563; border-left: 3px solid transparent; transition: all .15s; }
.mega-sidebar-item:hover, .mega-sidebar-item.active { background: #fff; color: #0F6E56; border-left-color: #0F6E56; }
.mega-content { flex: 1; padding: 1.5rem 2rem; }
.mega-section { display: none; grid-template-columns: repeat(3,1fr) 200px; gap: 1.5rem; }
.mega-section.active { display: grid; }
.mega-col-title { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #9ca3af; margin-bottom: 10px; }
.mega-link { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 9px; font-size: 14px; color: #374151; text-decoration: none; margin-bottom: 2px; transition: background .12s, color .12s; }
.mega-link:hover { background: #f0fdf9; color: #0F6E56; }
.mega-link-icon { width: 32px; height: 32px; border-radius: 8px; background: #f3f4f6; display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; transition: background .12s; }
.mega-link:hover .mega-link-icon { background: #dcfce7; }
.mega-link-name { font-size: 14px; font-weight: 500; line-height: 1.2; }
.mega-link-sub { font-size: 11px; color: #9ca3af; }
.mega-featured { background: linear-gradient(145deg,#0F6E56,#185FA5); border-radius: 16px; padding: 1.25rem; display: flex; flex-direction: column; gap: 8px; }
.mega-featured-tag { display: inline-flex; align-items: center; background: rgba(255,255,255,.18); border-radius: 20px; padding: 3px 10px; font-size: 10px; font-weight: 700; color: #fff; align-self: flex-start; }
.mega-featured h4 { font-size: 15px; font-weight: 700; color: #fff; margin: 0; }
.mega-featured p { font-size: 11.5px; color: rgba(255,255,255,.75); margin: 0; line-height: 1.5; }
.mega-featured-btn { display: inline-flex; align-items: center; background: #fff; color: #0F6E56; border-radius: 8px; padding: 7px 14px; font-size: 12px; font-weight: 700; text-decoration: none; align-self: flex-start; transition: transform .12s; }
.mega-featured-btn:hover { transform: translateY(-1px); color: #0F6E56; }
.mega-footer { border-top: 1px solid rgba(0,0,0,.06); padding: .75rem 2rem .75rem calc(200px + 2rem); display: flex; gap: 1.5rem; background: #fafafa; border-radius: 0 0 16px 16px; }
.mega-footer-link { font-size: 12px; font-weight: 500; color: #6b7280; text-decoration: none; display: flex; align-items: center; gap: 5px; transition: color .12s; }
.mega-footer-link:hover { color: #0F6E56; }

@media (max-width: 991.98px) {
    .mega-inner { flex-direction: column; }
    .mega-sidebar { width: 100%; border-right: none; border-bottom: 1px solid rgba(0,0,0,.06); display: flex; flex-wrap: wrap; gap: 4px; padding: .5rem; }
    .mega-sidebar-item { padding: 6px 12px; border-left: none; border-radius: 8px; font-size: 13px; }
    .mega-sidebar-item.active { background: #e6f4f0; border-left: none; }
    .mega-content { padding: 1rem; }
    .mega-section { grid-template-columns: 1fr 1fr; gap: .75rem; }
    .mega-featured { display: none; }
    .mega-footer { padding: .75rem 1rem; flex-wrap: wrap; gap: .75rem; }
}

/* ============================================================
   DASHBOARD PAGE
   ============================================================ */
.dashboard-page .dropdown-menu { display: none !important; }