/* ========================================================== CENCRAFT MEMBERS DIRECTORY ========================================================== */ /* ========================================================== CENCRAFT MEMBERS PAGE SPACING FIX ========================================================== */ /* Remove top spacing from BuddyPress directory page */ body.directory.members .site-content, body.directory.members .site-main, body.directory.members .entry-content { margin-top:0 !important; padding-top:0 !important; } body.directory.members .cc-page { padding-top:10px !important; } /* Remove WordPress page title spacing if present */ body.directory.members .entry-header { display:none !important; } /* BuddyPress wrapper */ body.directory.members #buddypress { margin-top:0 !important; padding-top:0 !important; } /* Members container */ body.directory.members .cc-members-directory { padding-top:0 !important; } /* ========================================================== CONTAINER ========================================================== */ .cc-members-directory { width:100%; max-width:900px; margin:0 auto; padding-top:10px; } /* ========================================================== MEMBER LIST ========================================================== */ .cc-members-directory #members-dir-list { width:100%; } .cc-members-directory #members-list, .cc-members-directory #members-list.bp-list { display:flex !important; flex-direction:column !important; gap:16px !important; width:100% !important; margin:0 !important; padding:0 !important; list-style:none !important; } /* Remove BuddyPress layout */ .cc-members-directory #members-list > li.item-entry, .cc-members-directory #members-list > li.item-entry.odd, .cc-members-directory #members-list > li.item-entry.even { display:block !important; float:none !important; width:100% !important; margin:0 !important; padding:0 !important; position:relative !important; } /* Remove separators */ .cc-members-directory #members-list > li::before, .cc-members-directory #members-list > li::after { display:none !important; } /* ========================================================== MEMBER CARD ========================================================== */ .cc-members-directory #members-list .list-wrap { position:relative; display:flex !important; align-items:center !important; min-height:120px !important; padding:20px 24px !important; overflow:hidden; background: linear-gradient( 145deg, #0b1d30, #071523 ); border: 1px solid rgba(18,217,239,.16); border-radius:10px; box-shadow: 0 10px 30px rgba(0,0,0,.18); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } /* Cyan accent */ .cc-members-directory #members-list .list-wrap::before { content:""; position:absolute; top:0; bottom:0; left:0; width:4px; background:#12d9ef; opacity:.65; } /* Hover */ .cc-members-directory #members-list li:hover .list-wrap { transform:translateY(-3px); border-color: rgba(18,217,239,.45); box-shadow: 0 15px 40px rgba(0,0,0,.25), 0 0 20px rgba(18,217,239,.08); } /* ========================================================== AVATAR ========================================================== */ .cc-members-directory .item-avatar { flex:0 0 84px !important; width:84px !important; height:84px !important; margin-right:24px !important; } .cc-members-directory .item-avatar a { display:block; width:100%; height:100%; } .cc-members-directory .item-avatar img.avatar { display:block; width:84px !important; height:84px !important; object-fit:cover; image-rendering:pixelated; border-radius:8px !important; border: 1px solid rgba(18,217,239,.25); box-shadow: 0 8px 25px rgba(0,0,0,.35); } /* ========================================================== CONTENT ========================================================== */ .cc-members-directory .item { flex:1; min-width:0; } .cc-members-directory .item-block { width:100%; } /* ========================================================== USERNAME ========================================================== */ .cc-members-directory .member-name { margin: 0 0 8px !important; } .cc-members-directory .member-name a { display:flex !important; align-items:center; gap:8px; color:#f8fafc !important; font-size:22px !important; font-weight:700 !important; text-decoration:none !important; } .cc-members-directory li:hover .member-name a { color:#12d9ef !important; } /* Verified */ .cc-members-directory .bp-verified-badge { flex-shrink:0; } /* ========================================================== ACTIVITY ========================================================== */ .cc-members-directory .last-activity { display:flex; align-items:center; margin:0 !important; padding:0 !important; color:#8495a8 !important; font-size:14px !important; font-weight:500 !important; } /* Online dot */ .cc-members-directory li.is-online .last-activity::before { content:""; width:8px; height:8px; margin-right:10px; background:#12d9ef; border-radius:50%; box-shadow: 0 0 12px rgba(18,217,239,.8); } /* ========================================================== SEARCH ========================================================== */ .cc-members-directory #members-dir-search { width:100% !important; margin-bottom:30px !important; } .cc-members-directory #members-dir-search form { position:relative !important; display:block !important; } .cc-members-directory #members-dir-search input[type="search"] { width:420px !important; max-width:100% !important; height:46px !important; padding: 0 50px 0 16px !important; background:#071523 !important; color:#f8fafc !important; border: 1px solid rgba(18,217,239,.25) !important; border-radius:8px !important; font-size:15px !important; } .cc-members-directory #members-dir-search input[type="search"]::placeholder { color:#718195 !important; } .cc-members-directory #members-dir-search input[type="search"]:focus { outline:none !important; border-color:#12d9ef !important; box-shadow: 0 0 15px rgba(18,217,239,.15); } /* Search button */ .cc-members-directory #members-dir-search input[type="submit"], .cc-members-directory #members-dir-search button { position:absolute !important; left:370px !important; top:50% !important; transform:translateY(-50%) !important; width:32px !important; height:32px !important; padding:0 !important; background:transparent !important; border:0 !important; } /* ========================================================== REMOVE SORTING ========================================================== */ .cc-members-directory #members-order-select, .cc-members-directory .members-order-select { display:none !important; } /* ========================================================== PAGINATION ========================================================== */ .cc-members-directory .bp-pagination { margin:25px 0 !important; } .cc-members-directory .pag-count { color:#718195 !important; font-size:13px !important; letter-spacing:0 !important; text-transform:none !important; } /* Hide bottom duplicate */ .cc-members-directory .bp-pagination.bottom { display:none !important; } /* ========================================================== MOBILE ========================================================== */ @media(max-width:600px) { .cc-members-directory { padding-top:20px; } .cc-members-directory #members-list .list-wrap { padding:18px !important; } .cc-members-directory .item-avatar { flex-basis:64px !important; width:64px !important; height:64px !important; margin-right:18px !important; } .cc-members-directory .item-avatar img.avatar { width:64px !important; height:64px !important; } .cc-members-directory .member-name a { font-size:18px !important; } } /* ========================================================= AUTHENTIK ACCOUNT STATUS DEACTIVATED ========================================================= */ .cc-member-name-row { display: flex; align-items: center; gap: 12px; } .cc-member-name-row .member-name { margin: 0; } .cc-member-disabled-badge { display: inline-flex !important; align-items: center !important; width: auto !important; height: auto !important; margin: 0 !important; padding: 3px 9px !important; border: 1px solid rgba(239, 68, 68, 0.45) !important; border-radius: 999px !important; background: rgba(239, 68, 68, 0.10) !important; color: #f87171 !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.4 !important; letter-spacing: 0.05em !important; text-transform: uppercase !important; white-space: nowrap; } .cc-member-disabled-status { display: flex !important; align-items: center; gap: 8px; color: #f87171 !important; } .cc-disabled-dot { display: block; width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #ef4444; box-shadow: 0 0 8px rgba(239, 68, 68, 0.55); }