/*
  CUBE — Glass Overlay
  Additive only. Loaded AFTER home.css / social.css so it can soften
  the existing box-like panels into glass without touching your real
  theme file. Safe to include on every page.
*/

/* Make sure real content sits above the particle canvas */
.dashboard {
  position: relative;
  z-index: 1;
}

/* ===== SIDEBAR — glassy ===== */
.sidebar {
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .sidebar {
  background: rgba(20, 20, 25, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.sidebar .cube-card {
  background: rgba(169, 45, 45, 0.18) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

.sidebar nav ul li.active a,
.sidebar nav ul li a:hover {
  background: rgba(255, 255, 255, 0.10) !important;
  backdrop-filter: blur(6px);
}

/* ===== TOP NAVBAR — glassy ===== */
.top-navbar {
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .top-navbar {
  background: rgba(20, 20, 25, 0.30) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
}

.search-bar {
  background: rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

/* ===== CARDS — glassy =====
   .glass-card, .profile-banner, and .pstat-card are deliberately NOT
   overridden here — verified directly in profile.css/project_detail.css
   that they already implement proper glass via CSS custom properties,
   and this blanket rule was silently flattening that nicer look.
   .edit-card and .skill-category-block ARE kept here since I have not
   seen edit_profile.css or skills.css to confirm they do the same —
   removing them without proof risks making those pages look flat. */
.stats-card,
.post-card,
.quick-links,
.featured-builders,
.builder-card,
.right-sidebar > div,
.inline-comment-box,
.edit-card,
.skill-category-block {
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
}

[data-theme="dark"] .stats-card,
[data-theme="dark"] .post-card,
[data-theme="dark"] .quick-links,
[data-theme="dark"] .featured-builders,
[data-theme="dark"] .builder-card,
[data-theme="dark"] .right-sidebar > div,
[data-theme="dark"] .inline-comment-box,
[data-theme="dark"] .edit-card,
[data-theme="dark"] .skill-category-block {
  background: rgba(20, 20, 25, 0.28) !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
}

/* Project preview image block inside post card keeps its own contrast */
.project-preview {
  backdrop-filter: none;
}
