.navbar{flex-direction:row;width:100%;max-width:100%;padding:0 30px 0 20px;background:hsla(0,0%,100%,.7);backdrop-filter:blur(50px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(15,23,42,.08);box-shadow:0 1px 10px rgba(15,23,42,.04);box-sizing:border-box}#mainNavbar,.navbar{display:flex;align-items:center;justify-content:center;min-height:70px;position:sticky;top:0;z-index:1000}#mainNavbar{overflow:visible;transition:none}#mainApp{overflow:visible;opacity:1;transform:translateY(0) scale(1);transform-origin:top center;transition:opacity .25s ease,transform .25s ease}#mainNavbar.collapsed{min-height:45px!important;justify-content:center!important;padding:0 20px}.navbar.collapsed{justify-content:center}#navbarCollapseBtn,#quarksphereToggleBtn{width:28px;height:28px;border-radius:25%;border:1px solid #e5e7eb;background:#f9fafb;color:#6b7280;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1001;flex-shrink:0;padding:0;transition:all .04s ease}#navbarCollapseBtn{position:absolute;right:16px;top:50%;transform:translateY(-50%)}#quarksphereToggleBtn{position:absolute;top:-15px}#navbarCollapseBtn:hover,#quarksphereToggleBtn:hover{background:#e5e7eb;border-color:#3b82f6;color:#3b82f6}#navbarCollapseIcon,#quarksphereChevronIcon{transition:transform .35s cubic-bezier(.4,0,.2,1);font-size:1.11rem}#quarksphereChevronIcon{font-size:1.11rem}#mainNavbar.collapsed #navbarCollapseIcon,#quarksphereControls.collapsed #quarksphereChevronIcon{transform:rotate(180deg)}.dark-mode #navbarCollapseBtn,.dark-mode #quarksphereToggleBtn{background:#1f2937;border-color:#374151;color:#9ca3af}.dark-mode #navbarCollapseBtn:hover,.dark-mode #quarksphereToggleBtn:hover{background:#374151;border-color:#60a5fa;color:#60a5fa}#mainNavbar.collapsed #mainApp{opacity:0;pointer-events:none;transform:translateY(-4px) scale(.99);max-height:0;overflow:hidden;margin:0;padding:0;flex:0;width:0;min-width:0}#mainNavbar.collapsed .logo{margin:0 auto;flex:0 0 auto}#mainNavbar.collapsed .brand{display:none!important}#mainNavbar #mainApp{max-height:500px;overflow:visible}#mainNavbar .logo{flex-shrink:0;z-index:2}.logo{display:flex;align-items:center;gap:12px;flex-shrink:0}.spocnet-icon{width:50px;height:50px}.spocnet-icon svg{width:100%;height:100%}.brand{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:600;letter-spacing:-.5px;color:#111827;cursor:default;user-select:none;transition:color .2s ease;line-height:1.2;display:inline-block}.navbar .brand{white-space:nowrap;font-size:1.5rem}.brand .spoc{color:#111827;font-weight:600}.brand .net{color:#3b82f6;font-weight:600}#mainApp.container{flex:1;max-width:100%;padding:0 20px}#mainApp .row,#mainApp.container{display:flex;align-items:center;margin:0}#mainApp .row{flex-wrap:wrap;gap:1px;width:100%}.user-info{display:flex;flex-direction:row;align-items:center;gap:12px;padding:8px 6px;background:hsla(0,0%,100%,0)}#userAvatar{width:50px!important;height:50px!important;border-radius:4px!important;flex-shrink:0!important;object-fit:cover!important;margin:0!important;align-self:center!important;border:1px solid transparent}#userEmail{color:#374151;font-size:.875rem;font-weight:500;white-space:nowrap;margin:0}.online-status-toggle{display:inline-flex;align-items:center;position:relative;gap:8px;padding:0}.toggle-checkbox{display:none}.toggle-label{position:relative;width:85px;height:28px;background:#e5e7eb;border-radius:14px;display:inline-block;cursor:pointer;border:none;transition:all .3s ease;margin:0!important}.toggle-label:after{content:"";position:absolute;width:22px;height:22px;background:#fff;border:1px solid #9ca3af;border-radius:50%;top:2px;left:2px;transition:left .3s cubic-bezier(.4,0,.2,1)}.toggle-text-offline,.toggle-text-online{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:500;pointer-events:none;user-select:none;color:#6b7280;text-transform:uppercase;letter-spacing:.4px;transition:opacity .2s ease}.toggle-text-online{opacity:0}.toggle-text-offline{opacity:1}.toggle-checkbox:checked+.toggle-label{background:#10b981}.toggle-checkbox:checked+.toggle-label:after{left:calc(100% - 25px)}.toggle-checkbox:checked+.toggle-label .toggle-text-online{opacity:1;color:#fff}.toggle-checkbox:checked+.toggle-label .toggle-text-offline{opacity:0}.status-indicator{width:10px;height:10px;border-radius:50%;background-color:#9ca3af;transition:background-color .3s ease}.toggle-checkbox:checked~.status-indicator{background-color:#10b981}.user-info .btn{font-size:.8125rem;font-weight:500;letter-spacing:.3px;text-transform:uppercase;border:none!important;color:#374151}#settingsBtn:hover,.user-info .btn,.user-info .btn:hover{background:#f9fafb}#signOutBtn{background:#fff;color:#ef4444}#signOutBtn:hover{color:red}#inboxBtn,#notificationsBtn,#profileBtn{position:relative;min-width:48px;height:48px;padding:0;background:transparent;border:none;color:#6c757d;font-size:1.125rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:none}#notificationsBtn .fas{color:#6c757d}#notificationsBtn .fas.has-notifications{color:#343a40}.dark-mode #notificationsBtn .fas.has-notifications{color:#d1d5db}#inboxBtn .fas{font-size:1.2rem;color:#6c757d}#inboxBtn.active{background-color:#f8f9fa;border-radius:4px}#inboxBtn.active .fas{color:#6c757d!important}#searchDropdownBtn{position:relative;z-index:10;padding:10px;background:#f9fafb;border:none;border-left:1px solid #e5e7eb;color:#6b7280;cursor:pointer;transition:none}#searchDropdownBtn:hover{background:#f3f4f6;color:#374151}#searchDropdownBtn:after{display:none}#searchDropdownBtn:focus{outline:none;box-shadow:none}#inboxBadge,#notificationBadge{position:absolute;right:-6px;background:linear-gradient(135deg,#1e3a8a,#3b82f6 50%,#fbbf24 75%,#ea580c);color:#fff;font-size:.65rem;font-weight:800;text-shadow:0 1px 2px rgba(0,0,0,.3);min-width:22px;height:22px;padding:0 6px;border-radius:11px;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 3px 8px rgba(0,0,0,.25),inset 0 0 0 1px hsla(0,0%,100%,.1)}#inboxBadge.d-none,#notificationBadge.d-none{display:none}.dropdown-menu{min-width:200px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 10px 25px rgba(0,0,0,.1);padding:0;margin-top:8px;z-index:1050;overflow:hidden}#notificationsDropdown{font-weight:100;left:50%!important;margin-top:11px;min-width:350px;overflow-wrap:anywhere!important;z-index:1055!important;opacity:0;visibility:hidden;transform:translateX(-50%) translateY(-10px);transition:opacity .2s ease,transform .2s ease,visibility .2s;display:block!important;pointer-events:none}#notificationsDropdown.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);pointer-events:auto}.navbar .dropdown-menu{z-index:1055!important}#notificationsDropdown .scrollable-dropdown{max-height:400px;overflow-y:auto;padding:8px;width:100%!important}#notificationsList{max-height:400px;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.spinner-border-sm{width:1rem;height:1rem}.scrollable-dropdown::-webkit-scrollbar{width:6px}.scrollable-dropdown::-webkit-scrollbar-track{background:#f9fafb}.scrollable-dropdown::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.scrollable-dropdown::-webkit-scrollbar-thumb:hover{background:#9ca3af}#notificationsDropdown::-webkit-scrollbar{width:10px;height:10px;background-color:transparent}#notificationsDropdown::-webkit-scrollbar-thumb{background-color:#4f4f4f;border-radius:20px;border:2px solid hsla(0,0%,100%,.3);transition:background-color .3s ease}#notificationsDropdown::-webkit-scrollbar-thumb:hover{background-color:#939393}#notificationsDropdown::-webkit-scrollbar-track{background-color:rgba(0,0,0,.1);border-radius:20px}.dropdown-header{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 12px;font-size:.875rem;color:#374151;background-color:#f9fafb;text-transform:uppercase;font-weight:600;letter-spacing:1px;border-bottom:1px solid #e5e7eb;border-radius:8px 8px 0 0;position:sticky;top:0;z-index:10}.dropdown-title{text-align:center;width:100%}.notification-filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;width:100%}.filter-btn{font-size:.75rem;padding:4px 10px;border:none;background:#f9fafb;color:#495057;cursor:pointer;white-space:nowrap}.filter-btn:hover{background:#e9ecef}.filter-btn.active{background:#0d6efd;color:#fff}.notification-item.filtered{display:none!important}.dark-mode .filter-btn,body.dark .filter-btn{background:#1f2937;color:#cbd5e1;border-color:#1f2937}.dark-mode .filter-btn:hover,body.dark .filter-btn:hover{border-color:#58ddff}.dark-mode .filter-btn.active,body.dark .filter-btn.active{color:#58ddff}.dropdown-item{padding:8px 12px;cursor:pointer;transition:background .2s ease;border-radius:4px}.dropdown-item:hover{background:#f3f4f6}.dropdown-item label{cursor:pointer;margin:0;width:100%}#notificationContainer{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px}.notification{padding:15px 25px;border-radius:0 0 14px 14px;box-shadow:inset 0 -2px 0 0 rgba(0,0,0,.25);margin-top:0}.notification-actions{display:flex;gap:2px}.accept-friend-btn,.follow-back-btn,.reject-friend-btn{padding:1px 6px!important;background:#f9fafb;transition:none;border:1px solid #e2e8f0!important;border-radius:5px!important}.accept-friend-btn,.follow-back-btn{color:#3b82f6}.reject-friend-btn{color:#dc3545}.dark-mode .accept-friend-btn,.dark-mode .follow-back-btn,.dark-mode .reject-friend-btn{background:#111827!important}.deletenotification-btn,.select-all-btn,.view-modal-btn{background:transparent!important;padding:4px 8px!important;border-radius:8px!important;border:none!important}.select-all-btn{color:#00229c!important;font-size:1rem!important}.select-all-btn:hover{background:transparent!important;color:#001f8f!important}.view-modal-btn:hover{background:transparent!important;color:#3b82f6!important}.deletenotification-btn:hover{background:transparent!important;color:#dc3545!important}.dark-mode .deletenotification-btn,.dark-mode .select-all-btn,.dark-mode .view-modal-btn{color:#e1e5e8!important;background-color:transparent!important}.btn-container-notification{justify-content:space-evenly!important}.checkbox{border-color:#000;border-radius:0!important;font-size:x-large;margin-top:0}.dark-mode .checkbox{border-color:#fff}.notification-item{padding:12px 16px;transition:background-color .08s ease}.notification-item:last-child{border-bottom:none}.notification-item:hover{background-color:#f0faff}.notification-item.unread{background-color:#fffef3}.notification-item.unread[data-type=favorite]{background-color:#e8f4ea;border-left:4px solid #28a745}.notification-item[data-type=favorite]:hover{background-color:#f0f9f1}.notification-item:not([data-type=favorite]):hover{background-color:#f2f3f3}.notification-item .time{font-size:.8rem;color:#08f}.usernamenotification{--border:#6c757d;--hover-border:#003cbf;--arrow-size:11px;--outline:2px;position:relative;display:inline-block;font-weight:700;color:#111827;font-size:14px;padding:2px 6px;letter-spacing:.3px;border-left:5px solid #6c757d;border-radius:24px 0 0 24px;margin-right:calc(var(--arrow-size) + var(--outline));z-index:2;overflow:visible;margin-bottom:8px}.usernamenotification:before{content:"";position:absolute;top:50%;right:calc((var(--arrow-size) + var(--outline))*-1);transform:translateY(-50%);width:0;height:0;border-top:calc(var(--arrow-size) + var(--outline)) solid transparent;border-bottom:calc(var(--arrow-size) + var(--outline)) solid transparent;border-left:calc(var(--arrow-size) + var(--outline)) solid var(--border);z-index:0;pointer-events:none;transition:border-left-color .22s ease-in-out}.usernamenotification:after{display:none}.usernamenotification:hover{border-color:var(--hover-border);color:#111827}.usernamenotification:hover:before{border-left-color:var(--hover-border)}.dark-mode .usernamenotification{--hover-border:#60a5fa;color:#f1f5f9}.dark-mode .usernamenotification:hover{color:#f9fafb}.notification-timestamp{color:#6c757d!important;font-style:normal;opacity:.8}.text-warning-graffiti{color:#ff3700!important}.p-3{padding:.3rem!important;overflow-wrap:anywhere!important;text-wrap:auto!important}.text-decoration-none{color:#000;font-weight:400;font-size:.9rem!important;text-decoration:none;margin:1rem!important}.partnership-accepted-inline{display:inline-flex;align-items:center;vertical-align:middle;margin-right:8px}.partnership-accepted-inline .partnership-container{display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 20px 0 12px;position:relative;border:2px solid #10b981;border-radius:18px;background:#f0f6fa}.partnership-accepted-inline .username-label{color:inherit;font-weight:700;font-size:14px;white-space:nowrap;letter-spacing:.3px;z-index:2}.partnership-accepted-inline .partnership-icon{display:flex;align-items:center;justify-content:center;width:56px;height:32px;position:relative;flex-shrink:0}.partnership-accepted-inline .partner-left,.partnership-accepted-inline .partner-right{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:1px}.partnership-accepted-inline .partner-left{left:4px}.partnership-accepted-inline .partner-right{right:4px}.partnership-accepted-inline .partner-left .p-head{width:11px;height:11px;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:50%;border:1px solid #1d4ed8}.partnership-accepted-inline .partner-left .p-body{width:16px;height:14px;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:8px 8px 2px 2px;position:relative;border:1px solid #1d4ed8}.partnership-accepted-inline .partner-left .p-body:before{content:"";position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:14px;height:5px;background:linear-gradient(135deg,#60a5fa,#3b82f6);border-radius:3px 3px 0 0}.partnership-accepted-inline .partner-right .p-head{width:11px;height:11px;background:linear-gradient(135deg,#fb923c,#f97316);border-radius:50%;border:1px solid #ea580c}.partnership-accepted-inline .partner-right .p-body{width:16px;height:14px;background:linear-gradient(135deg,#fb923c,#f97316);border-radius:8px 8px 2px 2px;position:relative;border:1px solid #ea580c}.partnership-accepted-inline .partner-right .p-body:before{content:"";position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:14px;height:5px;background:linear-gradient(135deg,#fdba74,#fb923c);border-radius:3px 3px 0 0}.partnership-accepted-inline .connect-line{position:absolute;width:20px;height:3px;background:linear-gradient(90deg,#10b981,#059669);top:50%;left:50%;transform:translate(-50%,-50%);border-radius:2px}.partnership-accepted-inline .partner-check{position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:24px;height:24px;background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;border:3px solid #fff;display:flex;align-items:center;justify-content:center;z-index:3}.partnership-accepted-inline .partner-check:before{content:"✓";color:#fff;font-size:14px;font-weight:700}.partnership-rejected-inline{display:inline-flex;align-items:center;vertical-align:middle;margin-right:8px}.partnership-rejected-inline .partnership-container{display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 20px 0 12px;position:relative;border:2px solid #ef4444;border-radius:18px;background:#f0f6fa}.partnership-rejected-inline .username-label{color:inherit;font-weight:700;font-size:14px;white-space:nowrap;letter-spacing:.3px;z-index:2}.partnership-rejected-inline .partnership-icon{display:flex;align-items:center;justify-content:center;width:56px;height:32px;position:relative;flex-shrink:0}.partnership-rejected-inline .partner-left,.partnership-rejected-inline .partner-right{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:1px}.partnership-rejected-inline .partner-left{left:4px}.partnership-rejected-inline .partner-right{right:4px}.partnership-rejected-inline .partner-left .p-head{width:11px;height:11px;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:50%;border:1px solid #1d4ed8}.partnership-rejected-inline .partner-left .p-body{width:16px;height:14px;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:8px 8px 2px 2px;position:relative;border:1px solid #1d4ed8}.partnership-rejected-inline .partner-left .p-body:before{content:"";position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:14px;height:5px;background:linear-gradient(135deg,#60a5fa,#3b82f6);border-radius:3px 3px 0 0}.partnership-rejected-inline .partner-right .p-head{width:11px;height:11px;background:linear-gradient(135deg,#fb923c,#f97316);border-radius:50%;border:1px solid #ea580c;box-shadow:0 1px 3px rgba(249,115,22,.3)}.partnership-rejected-inline .partner-right .p-body{width:16px;height:14px;background:linear-gradient(135deg,#fb923c,#f97316);border-radius:8px 8px 2px 2px;position:relative;border:1px solid #ea580c}.partnership-rejected-inline .partner-right .p-body:before{content:"";position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:14px;height:5px;background:linear-gradient(135deg,#fdba74,#fb923c);border-radius:3px 3px 0 0}.partnership-rejected-inline .connect-line{position:absolute;width:20px;height:3px;background:linear-gradient(90deg,#ef4444,#dc2626);top:50%;left:50%;transform:translate(-50%,-50%);border-radius:2px;opacity:.5}.partnership-rejected-inline .connect-line:before{content:"✕";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ef4444;font-size:14px;font-weight:700}.partnership-rejected-inline .partner-reject{position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:24px;height:24px;background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:50%;border:3px solid #fff;display:flex;align-items:center;justify-content:center;z-index:3}.partnership-rejected-inline .partner-reject:before{content:"✕";color:#fff;font-size:14px;font-weight:700}.pen-icon-4-inline{display:inline-block;height:36px;min-width:100px;position:relative;vertical-align:middle;margin-right:25px}@keyframes float-inline{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.pen-icon-4-inline .pen-body{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 20px 0 16px;background:linear-gradient(180deg,#e5e5e5,#f4f4f4 50%,#e5e5e5);border-radius:10px 0 0 10px;position:relative;border-left:7px solid #001eaf;overflow:hidden}.pen-icon-4-inline .pen-body:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,#ffffff00,hsla(0,0%,100%,.53) 50%,#ffffff00);z-index:1}.pen-icon-4-inline .username-label{color:#3d3d3d;font-weight:700;font-size:15px;white-space:nowrap;letter-spacing:.4px;position:relative;z-index:2}.pen-icon-4-inline .pen-nib{right:auto;border-top:18px solid #00000000;border-bottom:18px solid transparent;border-left:20px solid #0c2d6b;z-index:1}.pen-icon-4-inline .pen-nib,.pen-icon-4-inline .pen-nib:after{position:absolute;top:50%;transform:translateY(-50%);width:0;height:0}.pen-icon-4-inline .pen-nib:after{content:"";right:3px;border-top:14px solid transparent;border-bottom:14px solid transparent;border-left:14px solid #ff8c42}.row.align-items-center.mb-4{display:flex;justify-content:center;align-items:center;gap:1px;max-width:100%;margin:0 auto}.input-group{position:relative;display:flex;align-items:stretch;background:#fff;border:1px solid #e5e7eb;border-radius:8px;overflow:visible}.input-group:focus-within{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}#searchCountry{flex:1;padding:12px 16px;font-size:.875rem;border:none;background:transparent;color:#374151;outline:none;border-radius:8px 0 0 8px}#searchCountry::placeholder{color:#9ca3af}#searchCountry:focus{color:#111827}#searchCountry:disabled{opacity:.6;cursor:not-allowed}#searchBtn{position:relative;padding:10px;background:#f9fafb;border:none;color:#6b7280;font-weight:500;cursor:pointer;border-radius:0 8px 8px 0;border-left:1px solid #00000036!important;margin-left:auto;width:auto;transition:none}#searchBtn:hover{background:#f3f4f6;color:#374151}#searchBtn:active{background:#1d4ed8;color:#fff}#searchCountryInfo{position:absolute}.info-badge-btn{position:unset}#searchCountryInfo,.info-badge-btn{right:-8px;top:-8px;color:#94a3b8;font-size:1rem;cursor:pointer;padding:0;z-index:100;background:transparent;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;transition:all .2s ease-in-out}#searchCountryInfo:hover{color:#475569;transform:scale(1.1);background:transparent}#userSearchResults{position:absolute;top:100%;left:0;width:100%;background:#fff;border:1px solid #e5e7eb;border-top:none;border-radius:0 0 8px 8px;overflow-y:auto;max-height:400px;display:none;z-index:1000;box-shadow:0 4px 6px rgba(0,0,0,.1)}#userSearchResults::-webkit-scrollbar{width:6px}#userSearchResults::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:3px}#userSearchResults::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}.search-users-list{padding:12px 16px;border-bottom:1px solid #f3f4f6;display:flex;align-items:center;justify-content:space-between;gap:12px;transition:background-color .2s ease}.search-users-list:hover{background:#f9fafb}.search-users-list:last-child{border-bottom:none}.searchrounded-circle{width:40px;height:40px;object-fit:cover;border-radius:50%;border:none;flex-shrink:0}.fw-boldusername{font-weight:600;font-size:.875rem;color:#111827}.vprofilebutton{background:#fff;color:#374151;border:1px solid #d1d5db;padding:6px 14px;cursor:pointer;font-size:.8125rem;font-weight:500;border-radius:6px}.vprofilebutton:hover{background:#f9fafb;border-color:#3b82f6;color:#3b82f6}.fw-bold{font-weight:700;font-size:1rem}.fw-bold-IDR{font-weight:600;font-size:1.375rem;color:#111827}.d-flex{display:flex}.flex-wrap{flex-wrap:wrap}.align-items-center{align-items:center}.justify-content-center{justify-content:center}.justify-content-between{justify-content:space-between}.gap-2{gap:8px}.w-100{width:100%}.position-relative{position:relative}.position-absolute{position:absolute}.position-sticky{position:sticky}.z-3{z-index:3}.heading-highlight{background-color:#fef3c7;padding:6px 12px;border-radius:6px;display:inline-block}.text-muted-delivery{display:inline-block;padding:16px 20px;background-color:#fffbeb;border-radius:8px;font-size:.9375rem;color:#92400e;line-height:1.6;margin-bottom:20px}.noresulttext-center{font-weight:700;font-size:1.25rem;color:#ef4444;text-align:center}@media screen and (min-width:768px) and (max-width:1024px){.navbar{padding:0 16px}.spocnet-icon{width:45px;height:45px}.brand{font-size:1.375rem}#mainApp.container{padding:0 16px}#mainApp .row{gap:10px}.user-info{padding:8px 12px;gap:10px}.user-info .btn{padding:8px 12px;font-size:.75rem}#inboxBtn,#notificationsBtn,#profileBtn{min-width:44px;height:44px}}@media screen and (max-width:767px){.navbar{flex-direction:column;padding:8px 12px;min-height:auto;align-items:stretch}#navbarCollapseBtn{position:absolute;top:8px;right:12px;transform:none}.logo{width:100%;justify-content:center;margin-bottom:8px}.spocnet-icon{width:45px;height:45px}.brand{font-size:.75rem}#mainApp.container{width:100%;padding:0 8px;margin:0}#mainApp .row{display:grid;grid-template-columns:30% 70%;grid-template-rows:auto auto auto auto;gap:5px;width:100%;margin:0}.col-6.col-md-auto:has(#notificationsBtn){grid-column:1/2;grid-row:1/2;width:100%}.col-6.col-md-auto:has(#inboxBtn){grid-column:1/2;grid-row:2/3;width:100%}.col-6.col-md-auto:has(#profileBtn){grid-column:1/2;grid-row:3/4;width:100%}.col-12.col-md-auto:has(.user-info){grid-column:2/3;grid-row:1/4;width:100%;margin-bottom:0!important}.col-6.col-md:has(#searchCountry),.col-6.col-md:has(.input-group){grid-column:1/3;grid-row:4/5;width:100%}.user-info{display:grid!important;grid-template-columns:auto 1fr!important;grid-template-rows:auto auto auto!important;column-gap:8px!important;row-gap:4px!important;align-items:center!important;padding:6px 8px!important;width:100%!important}#userAvatar{grid-column:1/2!important;grid-row:1/3!important;width:50px!important;height:50px!important}.user-info>div:nth-child(2){grid-column:2/3!important;grid-row:1/2!important;margin:0!important}#userEmail{font-size:.85rem!important;font-weight:500!important;display:block!important;margin:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.online-status-toggle{grid-column:2/3!important;grid-row:2/3!important;padding:0!important;justify-content:center!important;align-items:center!important;align-self:center!important;margin:0!important;width:fit-content!important;min-width:0!important;justify-self:center!important;background:none!important}.toggle-label{height:18px!important;border-radius:9px!important;margin:0!important}.toggle-label:after{width:13px!important;height:13px!important;top:1px!important;left:2px!important}.toggle-checkbox:checked+.toggle-label:after{left:calc(100% - 16px)!important}.toggle-text-offline,.toggle-text-online{font-size:.55rem!important}.user-info>div:last-child{grid-column:1/3!important;grid-row:3/4!important;display:flex!important;gap:10px!important;width:100%!important;margin:14px 0 0!important}.user-info .btn{flex:1!important;padding:4px 6px!important;font-size:.65rem!important;background:#f9fafb!important}#inboxBtn,#notificationsBtn,#profileBtn{width:100%!important;min-width:auto!important;height:28px!important;background:#f9fafb}.input-group{width:100%}#notificationsDropdown{min-width:300px}}@media screen and (max-width:599px){.navbar{padding:6px 10px}#navbarCollapseBtn{top:6px;right:10px}.logo{margin-bottom:6px}.spocnet-icon{width:45px;height:45px}.brand{font-size:.6rem}.user-info{display:grid!important;grid-template-columns:auto 1fr!important;grid-template-rows:auto auto auto!important;column-gap:8px!important;row-gap:4px!important;align-items:center!important;padding:5px 7px!important;width:100%!important}#userAvatar{grid-column:1/2!important;grid-row:1/3!important;width:50px!important;height:50px!important}.user-info>div:nth-child(2){grid-column:2/3!important;grid-row:1/2!important;gap:10px!important;width:100%!important;margin:14px 0 0!important}#userEmail{font-size:.85rem!important;display:block!important;margin:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.online-status-toggle{grid-column:2/3!important;grid-row:2/3!important;padding:0!important;justify-content:center!important;align-items:center!important;align-self:center!important;margin:0!important;width:80%!important;min-width:0!important;justify-self:center!important}.toggle-label{width:100%;height:16px!important;border-radius:8px!important}.toggle-label:after{width:12px!important;height:12px!important}.toggle-checkbox:checked+.toggle-label:after{left:calc(100% - 14px)!important}.toggle-text-offline,.toggle-text-online{font-size:.52rem!important}.user-info>div:last-child{grid-column:1/3!important;grid-row:3/4!important;display:flex!important;gap:5px!important;width:100%!important}.user-info .btn{padding:3px 5px!important;font-size:.75rem!important;background:#f9fafb!important}#inboxBtn,#notificationsBtn,#profileBtn{height:26px!important;background:#f9fafb!important}#searchBtn,#searchCountry{padding:7px 10px;font-size:.75rem}#searchDropdownBtn{padding:7px 10px}#notificationsDropdown{min-width:280px}.notification-item{padding:8px 10px}.searchrounded-circle{width:28px;height:28px}}@media (max-width:768px){#notificationsDropdown{position:fixed!important;top:60px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:92vw;max-width:420px;max-height:65vh;overflow-y:auto;z-index:9999}}@media (max-width:480px){#notificationsDropdown{top:55px!important;width:96vw;max-height:60vh}}@media screen and (max-width:374px){.navbar{padding:6px 8px}#navbarCollapseBtn{top:6px;right:8px}.spocnet-icon{width:45px;height:45px}.brand{font-size:.6rem}.user-info{grid-template-columns:auto 1fr!important;padding:4px 6px!important;row-gap:3px!important;column-gap:6px!important}#userAvatar{width:50px!important;height:50px!important}#userEmail{font-size:.7rem!important}.toggle-label{height:15px!important;margin:0!important}.toggle-label:after{width:11px!important;height:11px!important}.toggle-checkbox:checked+.toggle-label:after{left:calc(100% - 13px)!important}.toggle-text-offline,.toggle-text-online{font-size:.5rem!important}.user-info .btn{padding:3px 4px!important;font-size:.575rem!important;background:#f9fafb!important}#inboxBtn,#notificationsBtn,#profileBtn{height:24px!important;background:#f9fafb!important}#notificationsDropdown{min-width:260px}}.dark-mode .navbar{background:rgba(17,24,39,.9);border-bottom:1px solid #374151;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.dark-mode .brand .spoc{color:#f9fafb}.dark-mode .brand .net{color:#60a5fa}.dark-mode .user-info{background:#0f1623!important}.dark-mode #userAvatar{border:3px solid transparent;background:linear-gradient(#000,#000) padding-box,linear-gradient(135deg,#60a5fa,#e16800) border-box}.dark-mode #userEmail{color:#e5e7eb}.dark-mode .online-status-toggle{background:#0f1623}.dark-mode .toggle-label{background:#374151}.dark-mode .toggle-label:after{background:#f9fafb}.dark-mode .toggle-text-offline,.dark-mode .toggle-text-online{color:#d1d5db}.dark-mode .status-indicator{background-color:#6b7280}.dark-mode #settingsBtn,.dark-mode #signOutBtn{background:#00000000!important}.dark-mode .notification-item.unread[data-type=favorite]{background-color:#052e16!important;border-left-color:#22c55e!important}.dark-mode .notification-content{color:#d1d5db!important}.dark-mode #notificationsDropdown::-webkit-scrollbar-thumb{background-color:#4b5563!important}.dark-mode #notificationsDropdown::-webkit-scrollbar-track{background-color:hsla(0,0%,100%,.05)!important}.dark-mode .dropdown-menu{background:#1f2937;border:1px solid #374151;box-shadow:0 10px 25px rgba(0,0,0,.5)}.dark-mode .scrollable-dropdown::-webkit-scrollbar-track{background:#111827}.dark-mode .scrollable-dropdown::-webkit-scrollbar-thumb{background:#4b5563}.dark-mode .scrollable-dropdown::-webkit-scrollbar-thumb:hover{background:#6b7280}.dark-mode .dropdown-header{background-color:#374151;color:#e5e7eb}.dark-mode .dropdown-item:hover{background:#374151}.dark-mode .dropdown-item,.dark-mode .dropdown-item label{color:#e5e7eb}.dark-mode .dropdown-item input[type=checkbox]{accent-color:#60a5fa}.dark-mode #inboxBtn,.dark-mode #notificationsBtn,.dark-mode #profileBtn{background:#0f1623!important}.dark-mode #inboxBadge,.dark-mode #notificationBadge{background:linear-gradient(135deg,#1e3a8a,#3b82f6 50%,#fbbf24 75%,#ea580c);border:2px solid #111827;box-shadow:0 3px 8px rgba(0,0,0,.4),inset 0 0 0 1px hsla(0,0%,100%,.05)}.dark-mode #notificationsDropdown{background-color:#1f2937;color:#e5e7eb}.dark-mode .notification-item{background-color:#111827;border-bottom:1px solid #374151}.dark-mode .notification-item.unread,.dark-mode .notification-item:hover{background-color:#1f2937}.dark-mode .notification-timestamp{color:#9ca3af!important}.dark-mode .text-decoration-none{color:#e5e7eb}.dark-mode .input-group{background:#1f2937;border:1px solid #374151}.dark-mode .input-group:focus-within{border-color:#60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.1)}.dark-mode #searchCountry{background:transparent;color:#e5e7eb}.dark-mode #searchCountry::placeholder{color:#6b7280}.dark-mode #searchCountry:focus{color:#f9fafb}.dark-mode #searchBtn{background:#374151;color:#9ca3af}.dark-mode #searchBtn:hover{background:#2563eb}.dark-mode #searchDropdownBtn{background:#374151;border-left:1px solid #4b5563;color:#9ca3af}.dark-mode #searchDropdownBtn:hover{background:#4b5563;color:#e5e7eb}.dark-mode #userSearchResults{background:#1f2937;border:1px solid #374151}.dark-mode #userSearchResults::-webkit-scrollbar-thumb{background-color:#4b5563}.dark-mode #userSearchResults::-webkit-scrollbar-thumb:hover{background-color:#6b7280}.dark-mode .search-users-list{background:#111827;border-bottom:1px solid #374151}.dark-mode .search-users-list:hover{background:#1f2937}.dark-mode .fw-boldusername{color:#e5e7eb}.dark-mode .vprofilebutton{background:#374151;color:#e5e7eb;border:1px solid #4b5563}.dark-mode .vprofilebutton:hover{background:#4b5563;border-color:#60a5fa;color:#60a5fa}.dark-mode .fw-bold-IDR{color:#f9fafb}.dark-mode .heading-highlight{background-color:#92400e;color:#fef3c7}.dark-mode .text-muted-delivery{background-color:#422006;color:#fef3c7}.dark-mode .partnership-accepted-inline .username-label,.dark-mode .partnership-rejected-inline .username-label{color:#fff}.dark-mode .partnership-accepted-inline .partner-check,.dark-mode .partnership-rejected-inline .partner-reject{border-color:#1a1a1a}.dark-mode .partnership-accepted-inline .partnership-container,.dark-mode .partnership-rejected-inline .partnership-container{background:#2a2a2a}.dark-mode .pen-icon-4-inline .pen-body{background:linear-gradient(135deg,#1e40af,#1e3a8a 50%,#0c2d6b);box-shadow:0 6px 20px rgba(37,99,235,.7),inset -4px -4px 8px rgba(0,0,0,.5),inset 4px 4px 8px hsla(0,0%,100%,.3)}.dark-mode .pen-icon-4-inline .pen-nib{border-left-color:#082148}@media print{.navbar{position:static!important;box-shadow:none;border-bottom:2px solid #000}#inboxBtn,#notificationsBtn,#searchBtn,#settingsBtn,#signOutBtn{display:none}}@media (prefers-reduced-motion:reduce){*,:after,:before{transition-duration:.01ms}}.toggle-checkbox:focus-visible+.toggle-label,button:focus-visible,input:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.dark-mode .toggle-checkbox:focus-visible+.toggle-label,.dark-mode button:focus-visible,.dark-mode input:focus-visible{outline:2px solid #60a5fa}*{box-sizing:border-box}a,button,input{-webkit-tap-highlight-color:transparent}img{-webkit-user-drag:none;user-select:none}