/* Chart renderer — extracted styles for the North Indian chart SVG.
   Shared between /astrologer-desk and (future) jyotish_chart.html main app.
   Phase A1: rendering-only. Interactive feature styles (aspect tooltip,
   body-map chips) come in A2. */

/* ═══ Sizing ═══
   Chart fills its container so dragging the left pane wider enlarges it.
   The 520px cap was previously hard-locked here — removed so the chart
   grows with the .chart-box (which is aspect-ratio:1, so it stays square). */
.chart-svg{width:100%;height:auto;display:block;margin:0 auto}

/* ═══ North-Indian base ═══ */
.ni-svg{width:100%;height:auto;display:block;margin:0 auto;cursor:default}

/* ═══ House polygons — hover / focus / selected ═══ */
.hpoly{cursor:pointer;transition:fill .18s}
.hpoly:hover{fill:rgba(201,168,76,.08)}
.hpoly.sel{fill:rgba(201,168,76,.14)}
.hpoly.pa-lit{fill:rgba(80,180,80,.08)}
polygon.hpoly:focus{outline:none}
polygon.hpoly:focus-visible{fill:rgba(232,201,122,.10) !important;stroke:var(--g) !important;stroke-width:2.5 !important;outline:none}

/* ═══ Planet group ═══ */
.planet-g{transition:opacity .15s}
.planet-g.lagna-lord{filter:drop-shadow(0 0 4px rgba(201,168,76,.4))}

/* ═══ Transit marker pulse (A2 will activate) ═══ */
@keyframes tpulse{0%,100%{opacity:.7}50%{opacity:.4}}
.tmark{animation:tpulse 2s ease-in-out infinite}

/* ═══ Desk-mode CSS variable aliases ═══════════════════════════════════════
   The extracted renderer uses jyotish_chart.html's token names (--ink, --b2,
   --br, --g, --gd, --id, --if, --ai, --wa, --sun, --moo, etc.). The desk
   uses different token names (--txt, --bg-2, --line, --gold, --rose, etc.).
   These aliases let the extracted SVG render correctly in the desk theme
   AND adapt to whichever theme is currently active (dark, light, ambient,
   pearl, saffron, beige, classic, or hc).
   ═══════════════════════════════════════════════════════════════════════ */
.chart-svg, .ni-svg{
  --ink: var(--txt);
  --b2: var(--bg-2);
  --b3: var(--panel-2);
  --b4: var(--panel-hi);
  --br: var(--line);
  --g:  var(--gold);
  --gd: var(--gold-dim);
  --gl: var(--gold);
  --id: var(--txt-3);
  --if: var(--txt-faint);
  --ai: var(--rose);
  --wa: var(--terra);
  /* Planet colors — map to desk's planet color tokens */
  --sun: var(--gold);
  --moo: #5c8fc7;
  --mar: var(--terra);
  --mer: var(--sage);
  --jup: var(--gold);
  --ven: var(--rose);
  --sat: var(--violet);
  --rah: var(--txt-2);
  --ket: var(--txt-2);
}