/* =========================================
   CUSTOM PRELOADER CSS
   ========================================= */
#custom-preloader {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: #ffffff; display: flex; justify-content: center;
    align-items: center; z-index: 9999999; 
    transition: opacity 0.5s ease, visibility 0.5s ease;
}
.loader-wrapper { position: relative; display: flex; justify-content: center; align-items: center; }

.ring-loader {
    position: absolute; width: 150px; height: 150px;
    border: 4px solid transparent; border-radius: 50%;
    animation: rotate-ring-custom 2s linear infinite;
}
.ring-loader:nth-child(1) { border-top-color: #0891b2; animation-duration: 1s; }
.ring-loader:nth-child(2) { border-right-color: #f43f5e; animation-duration: 1.5s; }
.ring-loader:nth-child(3) { border-bottom-color: #facc15; animation-duration: 2s; }

.logo-banten-slide {
    width: 80px !important; height: 80px !important;
    position: relative; z-index: 10;
    animation: slide-horizontal 2.5s ease-in-out infinite !important;
}

.loading-text-custom {
    position: absolute; top: 180px; font-weight: bold; color: #0891b2; letter-spacing: 2px;
}

@keyframes rotate-ring-custom { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes slide-horizontal { 0% { transform: translateX(-25px); } 50% { transform: translateX(25px); } 100% { transform: translateX(-25px); } }


/* =========================================
   CHAT WIDGET CSS
   ========================================= */
#chat-mobile-btn {
    position: fixed; bottom: 20px; right: 20px; z-index: 99999; 
    border-radius: 50%; width: 50px; height: 50px; font-size: 18px; 
    display: flex; align-items: center; justify-content: center; border: 2px solid #fff;
}
#chat-badge-mobile {
    display:none; position: absolute; top: -5px; right: -5px; 
    border-radius: 50%; font-size: 12px; padding: 5px 8px; border: 2px solid #fff;
}
#chat-container-main {
    display: none; position: fixed; bottom: 90px; right: 20px; 
    z-index: 99998; width: 320px;
}
.chat-card { border-radius: 15px; overflow: hidden; border: none; }
.chat-header { cursor:pointer; }
.chat-window { height: 350px; overflow-y: auto; padding: 15px; background: #f8f9fa; }
#emoji-picker { background:#fff; border-top:1px solid #ddd; padding:10px; max-height:200px; overflow-y:auto; }