/* ============================================
   Glass UI Enhanced Styles
   Pure CSS glassmorphism enhancements
   Based on Glass UI Generator principles
   ============================================ */

/* Enhanced Window Glass Effect */
.window {
  /* Improved glass background with gradient */
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.08) 100%
  ) !important;

  /* Enhanced backdrop filter with saturation boost */
  backdrop-filter: blur(40px) saturate(180%) brightness(110%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) brightness(110%) !important;

  /* Multi-layer border for depth */
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.37),
    inset 0 1px 0 rgba(255, 255, 255, 0.15),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1) !important;
}

.window.focused {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.15) 0%,
    rgba(255, 255, 255, 0.1) 100%
  ) !important;

  border: 1px solid rgba(255, 255, 255, 0.22) !important;

  box-shadow:
    0 12px 48px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1) !important;
}

/* Enhanced Menubar Glass Effect */
.menubar {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.1) 0%,
    rgba(255, 255, 255, 0.05) 100%
  ) !important;

  backdrop-filter: blur(20px) saturate(180%) brightness(105%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(105%) !important;

  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;

  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.1) inset,
    0 4px 16px rgba(0, 0, 0, 0.1) !important;
}

/* Enhanced Dock Glass Effect */
.dock {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.15) 0%,
    rgba(255, 255, 255, 0.1) 50%,
    rgba(255, 255, 255, 0.12) 100%
  ) !important;

  backdrop-filter: blur(30px) saturate(200%) brightness(115%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(200%) brightness(115%) !important;

  border: 1px solid rgba(255, 255, 255, 0.2) !important;

  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.4),
    0 40px 100px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.15),
    inset 0 -1px 0 rgba(0, 0, 0, 0.1) !important;
}

/* Enhanced Spotlight Modal Glass Effect */
.spotlight-modal {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.08) 100%
  ) !important;

  backdrop-filter: blur(25px) saturate(180%) brightness(110%) !important;
  -webkit-backdrop-filter: blur(25px) saturate(180%) brightness(110%) !important;

  border: 1px solid rgba(255, 255, 255, 0.18) !important;

  box-shadow:
    0 16px 48px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

/* Enhanced Context Menu Glass Effect */
.context-menu {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.14) 0%,
    rgba(255, 255, 255, 0.1) 100%
  ) !important;

  backdrop-filter: blur(20px) saturate(180%) brightness(110%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(110%) !important;

  border: 1px solid rgba(255, 255, 255, 0.2) !important;

  box-shadow:
    0 12px 32px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

/* Enhanced Notification Glass Effect */
.notification {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.08) 100%
  ) !important;

  backdrop-filter: blur(20px) saturate(180%) brightness(110%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) brightness(110%) !important;

  border: 1px solid rgba(255, 255, 255, 0.18) !important;

  box-shadow:
    0 12px 32px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.15) !important;
}

/* Light Theme Adjustments */
[data-theme="light"] .window {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.75) 0%,
    rgba(255, 255, 255, 0.65) 100%
  ) !important;

  border: 1px solid rgba(255, 255, 255, 0.5) !important;

  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    inset 0 -1px 0 rgba(0, 0, 0, 0.05) !important;
}

[data-theme="light"] .menubar {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.8) 0%,
    rgba(255, 255, 255, 0.7) 100%
  ) !important;

  border-bottom: 1px solid rgba(255, 255, 255, 0.4) !important;
}

[data-theme="light"] .dock {
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.85) 0%,
    rgba(255, 255, 255, 0.75) 100%
  ) !important;

  border: 1px solid rgba(255, 255, 255, 0.6) !important;
}

/* Performance optimization */
.window,
.menubar,
.dock,
.spotlight-modal,
.context-menu,
.notification {
  will-change: backdrop-filter, background, border-color;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}