/* ==========================================================================
   js/modules/kabbalah/kabbalah.module.css - SCOPED STYLES: KABBALAH & ÁRVORE DA VIDA
   ========================================================================== */

:root {
  --mod-kabbalah-accent: #ffd700;
  --mod-kabbalah-glow: rgba(255, 215, 0, 0.35);
  --mod-kabbalah-bg: rgba(13, 15, 23, 0.95);
  --mod-kabbalah-border: rgba(255, 215, 0, 0.25);
}

.tree-canvas-container {
  position: relative;
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  aspect-ratio: 3 / 4.6;
  background: radial-gradient(circle at center, rgba(30, 27, 75, 0.5) 0%, rgba(9, 9, 15, 0.95) 100%);
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 20px;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  overflow: hidden;
}

.tree-interactive-canvas {
  width: 100%;
  height: 100%;
  display: block;
  cursor: pointer;
  touch-action: none;
}

.mod-kabbalah-sephirah-card {
  background: var(--mod-kabbalah-bg);
  border: 1px solid var(--mod-kabbalah-border);
  border-radius: 14px;
  padding: 16px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mod-kabbalah-sephirah-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px var(--mod-kabbalah-glow);
}