/* Core Toggle Button Placement & Size */
.solar-toggle-fab {
  position: fixed;
  top: 6px;
  right: 16px;
  z-index: 10000; 

  width: 36px;
  height: 48px;

  background: transparent;
  border: none;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0;
  outline: none;
}

.solar-toggle-fab svg {
  position: absolute;
  width: 150%; 
  height: 150%;
  top: -25%;
  left: -25%;
  transition: transform 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 0.5s ease;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.5));
}

.solar-toggle-fab:hover svg {
  transform: scale(1.15) rotate(2deg) translateY(-5px) !important;
  filter: drop-shadow(0 0 15px rgba(59, 130, 246, 0.6));
}

.solar-toggle-fab .sun-icon {
  opacity: 0;
  transform: translateY(20px) scale(0.5);
}
.solar-toggle-fab .moon-icon {
  opacity: 1;
  transform: translateY(0px) scale(1);
}

body.solar-mode .solar-toggle-fab:hover svg {
  filter: drop-shadow(0 0 15px rgba(251, 191, 36, 0.6));
}

body.solar-mode .solar-toggle-fab .sun-icon {
  opacity: 1;
  transform: translateY(0px) scale(1);
}

body.solar-mode .solar-toggle-fab .moon-icon {
  opacity: 0;
  transform: translateY(20px) scale(0.5);
}

::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

html.transition-to-solar::view-transition-old(root) { z-index: 1; }
html.transition-to-solar::view-transition-new(root) { z-index: 9999; }

html.transition-to-lunar::view-transition-old(root) { z-index: 9999; }
html.transition-to-lunar::view-transition-new(root) { z-index: 1; }

:root {
    --bg-obsidian: #030712;
    --text-primary: #f8fafc;
    --text-secondary: #cbd5e1;
    --accent-corporate: #3b82f6;
    --card-bg: rgba(15, 23, 42, 0.4);
}

body.solar-mode {
    --bg-obsidian: #f8fafc; 
    --text-primary: #0f172a; 
    --text-secondary: #475569;
    --accent-corporate: #2563eb; 
    --card-bg: #ffffff;
}