/* ==========================================================================
   Digital Soulspace: night-sky skin for the BuddyBoss Theme.
   The colours themselves live in the theme options (set_palette.php); this
   file adds what options can't: the sky, glass panels, lettering and glow.
   Source of truth: C:\Users\mikem\dss-migration\wordpress\theme\ on Mike's PC.
   ========================================================================== */

:root {
	--dss-night: #0b0920;
	--dss-gold: #f0cf7e;
	--dss-gold-hi: #ffe3a3;
	--dss-orchid: #c08cff;
	--dss-rose: #ff9ad5;
	--dss-teal: #66e3d6;
	--dss-violet: #6b4bd6;
	--dss-glow: 0 18px 50px -20px rgba(192, 140, 255, .55);
	--dss-display: "Cinzel", "Times New Roman", serif;
}

/* ---------- the sky behind everything ---------- */
html {
	background:
		radial-gradient(60% 45% at 15% 10%, rgba(107, 75, 214, .30), transparent 70%),
		radial-gradient(50% 40% at 90% 15%, rgba(255, 154, 213, .13), transparent 70%),
		radial-gradient(60% 50% at 60% 100%, rgba(102, 227, 214, .10), transparent 70%),
		var(--dss-night) fixed;
	min-height: 100%;
}
body.buddyboss-theme,
body.buddyboss-theme #page,
body.buddyboss-theme .site,
body.buddyboss-theme .site-content,
body.buddyboss-theme #content,
body.buddyboss-theme .bb-grid,
body.login {
	background-color: transparent !important;
}
#dss-sky {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	pointer-events: none;
}

/* Glass panels: the stars glow faintly through every card. */
body.buddyboss-theme {
	--bb-content-background-color: rgba(21, 17, 47, .86);
	--bb-content-alternate-background-color: rgba(29, 24, 64, .88);
	--bb-header-background: rgba(14, 11, 38, .78);
	--bb-sidenav-background: rgba(14, 11, 38, .72);
	--bb-footer-background: transparent;
	--bb-footer-widget-background: transparent;
}

/* ---------- lettering ---------- */
.site-title,
.site-title a,
.entry-title,
.bb-title,
h1, h2,
.bp-feedback-heading,
#item-header-content .bb-user-content-wrap h2,
.groups-header .group-title,
.item-title h2 {
	font-family: var(--dss-display) !important;
	letter-spacing: .03em;
	font-weight: 400 !important;
}
h1.entry-title,
.bb-title,
.site-title a {
	background: linear-gradient(100deg, #fff 0%, var(--dss-gold) 30%, var(--dss-rose) 55%, var(--dss-orchid) 75%, #fff 100%);
	background-size: 250% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
	animation: dss-shimmer 12s ease-in-out infinite;
}
@keyframes dss-shimmer {
	0%, 100% { background-position: 0 0; }
	50% { background-position: 100% 0; }
}
.site-title a { font-size: 1.15rem; letter-spacing: .18em; text-transform: uppercase; }

a { transition: color .25s ease; }
::selection { background: rgba(240, 207, 126, .35); color: #fff; }

/* ---------- header ---------- */
body.buddyboss-theme .site-header {
	backdrop-filter: blur(14px) saturate(140%);
	-webkit-backdrop-filter: blur(14px) saturate(140%);
	box-shadow: none !important;
	border-bottom: 1px solid transparent;
	border-image: linear-gradient(90deg, transparent, rgba(240, 207, 126, .45), rgba(192, 140, 255, .35), transparent) 1;
}
.dss-moon {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-right: 14px;
	vertical-align: middle;
	cursor: default;
}
.dss-moon svg {
	width: 26px;
	height: 26px;
	filter: drop-shadow(0 0 8px rgba(240, 207, 126, .55));
	animation: dss-breathe 7s ease-in-out infinite;
}
@keyframes dss-breathe { 50% { filter: drop-shadow(0 0 14px rgba(240, 207, 126, .9)); } }

/* ---------- side panel (BuddyPanel) ---------- */
.buddypanel {
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-right: 1px solid rgba(240, 207, 126, .12) !important;
}
.buddypanel .side-panel-menu a { border-radius: 999px !important; }
.buddypanel .current-menu-item > a {
	box-shadow: 0 0 22px rgba(240, 207, 126, .35);
}

/* ---------- cards ---------- */
.activity-list > li.activity-item,
.bb-activity-list > li,
#buddypress .activity-list > li,
.item-list > li .list-wrap,
.bp-list.grid > li .list-wrap,
.widget,
.bb-card,
.bp-widget-wrap,
#whats-new-form,
.activity-update-form,
.bb-media-container,
.bp-messages-wrap,
.entry-content-wrap,
.bb-grid .bp-widget {
	border-radius: 18px !important;
	transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, border-color .45s ease;
}
.activity-list > li.activity-item:hover,
.item-list > li .list-wrap:hover,
.bp-list.grid > li .list-wrap:hover {
	border-color: rgba(240, 207, 126, .45) !important;
	box-shadow: var(--dss-glow);
}
.bp-list.grid > li .list-wrap:hover { transform: translateY(-4px); }

/* Avatars wear a soft gold halo. */
img.avatar {
	box-shadow: 0 0 0 2px rgba(240, 207, 126, .35), 0 0 16px rgba(192, 140, 255, .25);
	transition: box-shadow .4s ease;
}
a:hover img.avatar,
img.avatar:hover {
	box-shadow: 0 0 0 2px rgba(240, 207, 126, .85), 0 0 24px rgba(240, 207, 126, .45);
}

/* ---------- buttons ---------- */
.button.primary,
.bp-primary-action,
#aw-whats-new-submit,
input[type="submit"].button-primary,
.bb-primary-button,
.button.bb-primary-button,
#wp-submit,
.login .button-primary {
	background-image: linear-gradient(120deg, var(--dss-gold), #fff3cf 45%, #d9a94e) !important;
	background-size: 200% 100% !important;
	color: #120c33 !important;
	border-color: var(--dss-gold) !important;
	transition: background-position .6s ease, box-shadow .4s ease, transform .3s ease !important;
}
.button.primary:hover,
.bp-primary-action:hover,
#aw-whats-new-submit:hover,
.bb-primary-button:hover,
#wp-submit:hover,
.login .button-primary:hover {
	background-position: 100% 0 !important;
	box-shadow: 0 0 26px rgba(240, 207, 126, .45) !important;
}

/* ---------- forms ---------- */
body.buddyboss-theme input[type="text"],
body.buddyboss-theme input[type="email"],
body.buddyboss-theme input[type="search"],
body.buddyboss-theme input[type="password"],
body.buddyboss-theme input[type="url"],
body.buddyboss-theme input[type="number"],
body.buddyboss-theme textarea,
body.buddyboss-theme select,
body.login input[type="text"],
body.login input[type="password"],
body.login input[type="email"] {
	background-color: rgba(255, 255, 255, .045) !important;
	color: #ece6ff !important;
	border-color: rgba(240, 207, 126, .22) !important;
}
body.buddyboss-theme input:focus,
body.buddyboss-theme textarea:focus,
body.buddyboss-theme select:focus {
	border-color: var(--dss-gold) !important;
	box-shadow: 0 0 0 3px rgba(240, 207, 126, .18) !important;
}
::placeholder { color: rgba(211, 202, 240, .55) !important; }

/* ---------- imported Mighty posts ----------
   Some posts carry inline colours chosen for Mighty's white background
   (black text, white boxes). On the night sky they would vanish. */
.activity-inner [style*="color"],
.bb-activity-inner [style*="color"],
.activity-comments [style*="color"] {
	color: inherit !important;
}
.activity-inner [style*="background"],
.bb-activity-inner [style*="background"] {
	background: transparent !important;
}
.activity-inner a,
.activity-comments .acomment-content a { color: var(--dss-gold); }

/* Post and comment text: bright moonlight, easy to read on the night sky (Mike, 2026-10-08). */
body.buddyboss-theme .activity-inner,
body.buddyboss-theme .activity-inner p,
body.buddyboss-theme .activity-inner li,
body.buddyboss-theme .activity-inner span,
body.buddyboss-theme .activity-inner div,
body.buddyboss-theme .bb-activity-inner,
body.buddyboss-theme .activity-content .activity-inner,
body.buddyboss-theme .acomment-content,
body.buddyboss-theme .acomment-content p,
body.buddyboss-theme .activity-read-more,
body.buddyboss-theme .bp-activity-post-title,
body.buddyboss-theme .activity-post-title,
body.buddyboss-theme .bb-activity-post-title,
body.buddyboss-theme .entry-content,
body.buddyboss-theme .entry-content p,
body.buddyboss-theme .bp-messages-content .message-content,
body.buddyboss-theme .bp-messages-content .message-content p {
	color: #f4f0ff !important;
	opacity: 1 !important;
}

/* Post titles and headings inside posts: light candle-yellow, heavier Cinzel, soft glow.
   Cinzel at weight 400 read as faint at title size (Mike, 2026-10-08). */
body.buddyboss-theme .activity-title h2,
body.buddyboss-theme .activity-inner h1,
body.buddyboss-theme .activity-inner h2,
body.buddyboss-theme .activity-inner h3,
body.buddyboss-theme .activity-inner h4,
body.buddyboss-theme .activity-inner h5,
body.buddyboss-theme .activity-inner h6,
body.buddyboss-theme .activity-discussion-title-wrap a,
body.buddyboss-theme .activity-link-preview-title,
body.buddyboss-theme .activity-link-preview-title a {
	color: #ffeaa8 !important;
	font-weight: 600 !important;
	opacity: 1 !important;
	-webkit-text-fill-color: #ffeaa8 !important;
	text-shadow: 0 0 18px rgba(255, 220, 140, .25);
}

/* ---------- small touches ---------- */
.bb-icon-bell, .bb-icon-inbox, .bb-icon-shopping-cart { transition: color .3s, text-shadow .3s; }
.notification-wrap:hover i,
.header-aside a:hover i { text-shadow: 0 0 12px rgba(240, 207, 126, .8); }

html { scrollbar-color: rgba(240, 207, 126, .35) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgba(240, 207, 126, .28); border-radius: 10px; }
::-webkit-scrollbar-track { background: transparent; }

/* Gentle entrance for feed items as they arrive. */
@keyframes dss-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.activity-list > li.activity-item,
.bp-list > li { animation: dss-rise .7s cubic-bezier(.2, .7, .2, 1) both; }

/* ---------- login page ---------- */
body.login {
	background: transparent !important; /* the sky is painted on <html>; a body background would hide the stars */
	color: #d3caf0;
}
body.login #login form,
body.login .login-split,
body.login #loginform {
	background: rgba(21, 17, 47, .82) !important;
	border: 1px solid rgba(240, 207, 126, .25) !important;
	border-radius: 22px !important;
	box-shadow: 0 30px 80px -30px rgba(107, 75, 214, .8) !important;
	backdrop-filter: blur(10px);
}
body.login h1 a,
body.login .login-heading,
body.login #login h1 {
	font-family: var(--dss-display) !important;
	color: var(--dss-gold) !important;
}
body.login label,
body.login #nav a,
body.login #backtoblog a { color: #d3caf0 !important; }
body.login #nav a:hover,
body.login #backtoblog a:hover { color: var(--dss-gold) !important; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
}