/* Pars Medicine Navbar Fix
 * Fixes: menu right-aligned, logo visible, horizontal login form
 * v1.2.0 - 2026-02-09
 */

/* Dynamic menu transparent inside navbar */
.pars-navbar .pars-dynamic-nav,
.pars-navbar [id^="pars-menu-"] {
    background: transparent !important;
    flex: 1 !important;
    z-index: auto !important;
}

/* Hide module hamburger (Bootstrap toggler handles mobile) */
.pars-navbar .pars-dynamic-nav .pars-nav-toggle {
    display: none !important;
}

/* Push menu items to the RIGHT */
.pars-navbar .pars-dynamic-nav .pars-nav-menu,
.pars-navbar [id^="pars-menu-"] .pars-nav-menu {
    justify-content: flex-end !important;
    margin-left: auto !important;
}

/* Also push navbar-nav to the right */
.pars-navbar .navbar-nav {
    margin-left: auto !important;
}

/* Logo always visible */
.pars-navbar .navbar-brand {
    z-index: 1050 !important;
    position: relative !important;
    flex-shrink: 0 !important;
    margin-right: 30px !important;
}

/* Mega parent static for full-width dropdown (3+ columns) */
.pars-navbar .nav-item.has-mega-menu {
    position: static !important;
}

/* Small mega menus (1-2 cols) use relative positioning */
.pars-navbar .nav-item.has-mega-menu.mega-cols-1,
.pars-navbar .nav-item.has-mega-menu.mega-cols-2 {
    position: relative !important;
}

/* Right-align small mega dropdowns near right edge to prevent overflow */
.pars-navbar .nav-item.has-mega-menu.mega-cols-1:nth-last-child(-n+3) > .dropdown-menu.mega-menu,
.pars-navbar .nav-item.has-mega-menu.mega-cols-2:nth-last-child(-n+3) > .dropdown-menu.mega-menu {
    left: auto;
    right: 0;
}

/* Mega menu dropdown white bg */
.pars-navbar .pars-dynamic-nav .mega-menu-dropdown,
.pars-navbar .dropdown-menu.mega-menu {
    background: #ffffff !important;
}

/* === FIX: Ensure dropdown-menu.mega-menu shows on Bootstrap .show === */
.pars-navbar .dropdown-menu.mega-menu.show {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    flex-wrap: wrap;
    padding: 20px 25px;
    max-width: 1000px;
}

/* Small mega menus: tighter sizing when shown */
.pars-navbar .dropdown-menu.mega-menu.mega-cols-1.show {
    min-width: 240px;
    max-width: 320px;
    padding: 15px 20px;
}
.pars-navbar .dropdown-menu.mega-menu.mega-cols-2.show {
    min-width: 420px;
    max-width: 560px;
    padding: 18px 22px;
}

/* === FIX: Hide empty dropdown menus (no children) === */
.pars-navbar .dropdown-menu:empty,
.pars-navbar .dropdown-menu.mega-menu:empty {
    display: none !important;
}

/* === HORIZONTAL LOGIN FORM === */
.pars-login-form {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.pars-login-form input[type="text"],
.pars-login-form input[type="password"] {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.25);
    color: #fff;
    padding: 7px 12px;
    font-size: 13px;
    border-radius: 4px;
    width: 150px;
    outline: none;
    transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
    font-family: inherit;
}
.pars-login-form input::placeholder { color: rgba(255,255,255,0.5); }
.pars-login-form input:focus {
    border-color: #0066cc;
    background: rgba(255,255,255,0.18);
    box-shadow: 0 0 0 2px rgba(0,102,204,0.3);
}
.pars-login-form .btn-login {
    background: #0066cc;
    color: #fff;
    border: none;
    padding: 7px 18px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s, transform 0.1s;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.pars-login-form .btn-login:hover { background: #0055aa; transform: translateY(-1px); }
.pars-login-form .btn-login:disabled { opacity: 0.7; cursor: not-allowed; transform: none; }
.pars-login-form .login-divider { color: rgba(255,255,255,0.3); font-size: 12px; padding: 0 2px; }
.pars-login-form .btn-sso {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: transparent;
    color: rgba(255,255,255,0.8) !important;
    border: 1px solid rgba(255,255,255,0.3);
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none !important;
    transition: background 0.2s, color 0.2s;
}
.pars-login-form .btn-sso:hover { background: rgba(255,255,255,0.1); color: #fff !important; }
.pars-login-form .login-spinner {
    display: none;
    width: 14px; height: 14px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: pars-login-spin 0.6s linear infinite;
}
.pars-login-form.is-loading .login-spinner { display: inline-block; }
.pars-login-form.is-loading .btn-login .btn-text { display: none; }
.pars-login-form .login-error { color: #ff6b6b; font-size: 11px; white-space: nowrap; display: none; }
.pars-login-form.has-error .login-error { display: inline; }
.pars-login-form .login-success { color: #48bb78; font-size: 12px; font-weight: 600; white-space: nowrap; display: none; }
.pars-login-form.is-success .login-success { display: inline; }
.pars-login-form.is-success input,
.pars-login-form.is-success .btn-login,
.pars-login-form.is-success .btn-sso,
.pars-login-form.is-success .login-divider { display: none; }
@keyframes pars-login-spin { to { transform: rotate(360deg); } }
.auth-bar-login .auth-register-link { color: rgba(255,255,255,0.6); font-size: 11px; text-decoration: none; transition: color 0.2s; }
.auth-bar-login .auth-register-link:hover { color: #fff; text-decoration: underline; }
@media (max-width: 991px) {
    .pars-login-form { flex-wrap: wrap; justify-content: center; gap: 6px; }
    .pars-login-form input[type="text"],
    .pars-login-form input[type="password"] { width: 130px; }
}
@media (max-width: 576px) {
    .pars-login-form { flex-direction: column; width: 100%; }
    .pars-login-form input[type="text"],
    .pars-login-form input[type="password"] { width: 100%; }
    .pars-login-form .btn-login { width: 100%; justify-content: center; }
}

/* === STRATIFIED REGISTER DROPDOWN === */
.auth-register-dropdown {
    position: relative;
    display: inline-block;
}
.auth-register-dropdown .auth-register-link {
    background: none;
    border: none;
    color: rgba(255,255,255,0.6);
    font-size: 11px;
    cursor: pointer;
    padding: 2px 6px;
    font-family: inherit;
    transition: color 0.2s;
}
.auth-register-dropdown .auth-register-link:hover {
    color: #fff;
}
.register-menu {
    display: none;
    position: absolute;
    bottom: 100%;
    right: 0;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.2);
    min-width: 280px;
    z-index: 2000;
    overflow: hidden;
    margin-bottom: 8px;
}
.register-menu.is-open { display: block; }
.register-menu::after {
    content: '';
    position: absolute;
    bottom: -6px;
    right: 20px;
    width: 12px;
    height: 12px;
    background: #fff;
    transform: rotate(45deg);
    box-shadow: 2px 2px 4px rgba(0,0,0,0.05);
}
.register-menu-header {
    padding: 10px 16px 8px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6b7280;
    border-bottom: 1px solid #f3f4f6;
}
.register-option {
    display: flex !important;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    text-decoration: none !important;
    color: #374151 !important;
    transition: background 0.15s;
    border-bottom: 1px solid #f9fafb;
}
.register-option:last-child { border-bottom: none; }
.register-option:hover {
    background: #f0f7ff;
    color: #0066cc !important;
}
.register-option i {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border-radius: 6px;
    font-size: 12px;
    color: #0066cc;
    flex-shrink: 0;
}
.register-option:hover i {
    background: #dbeafe;
}
.register-option strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: inherit;
}
.register-option small {
    display: block;
    font-size: 11px;
    color: #9ca3af;
    margin-top: 1px;
}
.register-option:hover small { color: #6b7280; }

/* Registration group labels */
.register-group-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6b7280;
    padding: 8px 14px 4px;
    border-top: 1px solid #f3f4f6;
    margin-top: 2px;
}
.register-group-label:first-of-type { border-top: none; margin-top: 0; }
.register-group-label i { margin-right: 5px; font-size: 10px; }
.register-menu { max-height: 400px; overflow-y: auto; }

/* === AUTH BAR LOGGED-IN STATE === */
.auth-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 14px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 4px;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background 0.2s, transform 0.1s;
    cursor: pointer;
    border: none;
    font-family: inherit;
}
.auth-btn-profile {
    background: rgba(0,102,204,0.15);
    color: #8cb4ff !important;
}
.auth-btn-profile:hover {
    background: rgba(0,102,204,0.25);
    color: #fff !important;
}
.auth-btn-portal {
    background: rgba(0,168,89,0.15);
    color: #6dd9a0 !important;
}
.auth-btn-portal:hover {
    background: rgba(0,168,89,0.25);
    color: #fff !important;
}
.auth-btn-logout {
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.6) !important;
}
.auth-btn-logout:hover {
    background: rgba(220,53,69,0.2);
    color: #ff8a8a !important;
}
.auth-welcome {
    color: rgba(255,255,255,0.85);
    font-size: 13px;
    font-weight: 500;
    margin-right: 4px;
}
.auth-welcome i {
    color: #48bb78;
    margin-right: 4px;
}

/* === LOGIN STATE TRANSITION ANIMATIONS === */
@keyframes authFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes authShake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}
.auth-fade-in {
    animation: authFadeIn 0.35s ease-out forwards;
}
.pars-login-form.has-error {
    animation: authShake 0.4s ease-in-out;
}
