/* ====== Reset & variables — LIGHT THEME ====== */
:root{
  --bg: #f5f7fb;
  --card: #ffffff;
  --muted: #5f6b7a;
  --text: #111827;
  --primary: #4460ff;
  --primary-2: #2f46e6;
  --accent: #06b6d4;
  --danger: #e11d48;
  --ring: rgba(68,96,255,.25);
}

html,body{height:100%}
body{
  background:
    radial-gradient(1200px 800px at 15% -10%,rgba(6,182,212,.08),transparent 60%),
    radial-gradient(1000px 600px at 95% 10%,rgba(68,96,255,.10),transparent 50%),
    var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
}

/* ====== Layout ====== */
.container-lg{ max-width:1280px; }
.section-title{ font-weight:700; letter-spacing:.2px; display:flex; gap:.6rem; align-items:center; }
.section-title .dot{ width:.7rem;height:.7rem;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--primary)) }
.subtle{ color:var(--muted) }

/* ====== Cards ====== */
.card{
  background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.85));
  border:1px solid rgba(15,23,42,.08) !important;
  border-radius:18px !important;
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
  backdrop-filter: saturate(120%) blur(4px);
  color:var(--text);
}
.card .form-text{color:var(--muted)}

/* ====== Buttons / Inputs ====== */
.btn-primary{ background:linear-gradient(90deg,var(--primary),var(--primary-2)); border:0 }
.btn-outline-secondary{ border-color:rgba(15,23,42,.18); color:var(--text) }
.btn-outline-secondary:hover{ background:rgba(15,23,42,.04) }
.form-control,.form-select{
  background:rgba(255,255,255,1);
  border:1px solid rgba(15,23,42,.16);
  color:var(--text)
}
.form-control:focus,.form-select:focus{
  border-color:var(--ring); box-shadow:0 0 0 .25rem var(--ring);
}

/* ====== Orbit Animator ====== */
.orbit-widget{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.92));
  border:1px solid rgba(15,23,42,.10);
  border-radius:20px; padding:1rem
}
.orbit-toolbar{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.orbit-toolbar .badge{background:rgba(15,23,42,.06);color:var(--text)}
.orbit-canvas-wrap{
  position:relative;
  width:100%;
  /* Responsive : min 520px, préfère 75vh, max 1200px */
  height:clamp(520px, 75vh, 1200px) !important;
  max-height:1200px !important;
  min-height:520px !important;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
}
#orbitCanvas{
  width:100%;height:100%;display:block;
  background:
    radial-gradient(900px 600px at 50% 40%, rgba(68,96,255,.06), rgba(255,255,255,.04)),
    #ffffff;
}
.orbit-help{color:var(--muted);font-size:.92rem}

/* ====== Legend ====== */
.legend-item, .legend-moon{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.25rem .6rem;
  border:1px solid rgba(15,23,42,.14);
  border-radius:999px; margin:.25rem; cursor:pointer; user-select:none;
  background:#fff
}
.legend-dot{width:12px;height:12px;border-radius:999px;display:inline-block;box-shadow:0 0 0 2px rgba(15,23,42,.05) inset}
.legend-item.off{opacity:.45;text-decoration:line-through}
.legend-moon{font-size:.85rem;border-style:dashed}

/* ====== Planet rows ====== */
.planet-row{
  border:1px dashed rgba(15,23,42,.20);
  border-radius:14px; padding:.9rem; margin-bottom:.75rem;
  background:#fff
}

/* ====== Stats tables ====== */
.table{ --bs-table-bg: transparent; color:var(--text); }
.table thead th{
  position:sticky; top:0; z-index:1;
  background:linear-gradient(180deg, rgba(15,23,42,.04), rgba(15,23,42,.00));
  backdrop-filter: blur(2px);
  border-bottom:1px solid rgba(15,23,42,.15) !important;
}
.table-striped>tbody>tr:nth-of-type(odd)>*{ background:rgba(15,23,42,.02) }
.table td, .table th{ border-color:rgba(15,23,42,.12) }

/* ====== Column hints (tooltips + icon) ====== */
.th-wrap{display:flex; align-items:center; gap:.35rem; white-space:nowrap}
.th-hint{
  width:1.15rem; height:1.15rem; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(15,23,42,.25);
  border-radius:999px; cursor:help; font-size:.75rem; color:#334155;
  background:#fff
}
.th-hint:hover{background:#eef2ff}
.tooltip .svg-mini{display:block}

/* ====== Visibility icon ====== */
.vis-icon{font-size:1rem;vertical-align:middle}
.vis-icon.off{opacity:.38;filter:grayscale(1)}

/* ====== Responsive helpers ====== */
@media (max-width: 992px){
  .orbit-toolbar{justify-content:space-between}
}

/* small helper badges */
.badge-soft{ background:rgba(15,23,42,.05); border:1px solid rgba(15,23,42,.12); color:var(--text) }
