/* Loading background and mobile menu styles */
#loading { background-color: var(--loader-bg, transparent) !important; }

/* Ensure header dropdowns render above surrounding content even when not sticky */
@media (max-width: 500px) {
    /* .header { position: relative; z-index: 1002; }
    .header .header-right .box-user { position: relative; }
    .header .header-right .box-user .menu-user { z-index: 1003; } */
    .menu-mobile-open {
        overflow: hidden !important;
        position: fixed;
        width: 100%;
    }
}

/* CSS cho toggle password icon */
.toggle-password {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 10;
}

.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.navigation li.current-menu > a,
.navigation li.current-menu-parent > a {
    color: var(--Primary) !important;
}

.navigation li.current-menu .submenu li.current-item > a {
    color: #721c24 !important;
}

/* Contact popup positioning */
.float-btns .float-btn-item{top: -58px;}
.float-btns { position: fixed; right: 16px; bottom: 24px; z-index: 1100; }
.float-btns .float-contact-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.12); top: -62px; cursor: pointer; }
.float-btns .float-contact-btn svg path { transition: stroke 0.2s ease; }
.float-btns .float-contact-btn:hover svg path { stroke: var(--Primary, #ff9900); }

/* Pulse (phóng to thu nhỏ) animation ~2s for contact button */
@keyframes contactPulse {
    0% { transform: scale(1); }
    45% { transform: scale(1.22); }
    50% { transform: scale(1.24); }
    55% { transform: scale(1.22); }
    100% { transform: scale(1); }
}
.float-btns .float-contact-btn {
    animation: contactPulse 2s ease-in-out infinite;
    will-change: transform;
}
.float-btns .float-contact-btn:hover { transform: scale(1.28); }
@media (prefers-reduced-motion: reduce) {
    .float-btns .float-contact-btn { animation: none; transform: none; }
    .float-btns .float-contact-btn:hover { transform: none; }
}

/* Ensure initial state is fully hidden to avoid flash */
.contact-popup { position: fixed; right: 72px; bottom: 82px; width: min(360px, 92vw); max-height: 70vh; overflow: auto; background: #fff; border: 1px solid rgba(0,0,0,0.08); box-shadow: 0 12px 24px rgba(0,0,0,0.16); border-radius: 12px; padding: 12px; display: none; transform: translateY(8px); transition: opacity .18s ease, transform .18s ease; z-index: 91200; opacity: 0; }
.contact-popup.show { display: block; opacity: 1; transform: translateY(0); }
.contact-popup.show .form-contact-seller{
    margin-bottom: 0px!important;
    background-color: transparent!important;
    border: none!important;
    box-shadow: none!important;
}
.contact-popup .contact-popup-close { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border: none; background: #fff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,0.12); cursor: pointer; }
.contact-popup .contact-popup-close:hover svg path { stroke: var(--Primary, #ff9900); }

@media (max-width: 576px) {
    .contact-popup { right: 16px; bottom: 84px; width: calc(100vw - 32px); }
    /* Hide contact toggle and popup on mobile */
    .float-btns .float-contact-btn { display: none !important; }
    #contactPopup { display: none !important; }
}