/* vg-theme.css — Variables et styles ARB partagés entre toutes les pages */

html[data-arb-theme="day"], body[data-arb-theme="day"]{
  --arb-bg:#ecfaff;
  --arb-board-bg:#f8fafc; --arb-panel:#ffffff; --arb-panel-2:#f0fbff;
  --arb-line:rgba(14,116,144,.16); --arb-line-2:rgba(124,58,237,.10);
  --arb-text:#082032; --arb-text-soft:#34556b;
  --arb-accent:#0891b2; --arb-accent-2:#7c3aed; --arb-accent-3:#db2777;
  --arb-shadow:0 0 0 1px rgba(8,145,178,.10),0 8px 28px rgba(8,145,178,.08);
}
html[data-arb-theme="midday"], body[data-arb-theme="midday"]{
  --arb-bg:#1e3a5f;
  --arb-board-bg:#1a3350; --arb-panel:#24466e; --arb-panel-2:#2c5280;
  --arb-line:rgba(147,220,255,.25); --arb-line-2:rgba(192,132,252,.20);
  --arb-text:#eaf6ff; --arb-text-soft:#9dcde8;
  --arb-accent:#7dd3fc; --arb-accent-2:#c084fc; --arb-accent-3:#f9a8d4;
  --arb-shadow:0 0 0 1px rgba(125,211,252,.15),0 0 18px rgba(125,211,252,.12),0 0 32px rgba(192,132,252,.08);
}
html[data-arb-theme="night"], body[data-arb-theme="night"]{
  --arb-bg:#071224;
  --arb-board-bg:#0b1220; --arb-panel:#0b1830; --arb-panel-2:#10213f;
  --arb-line:rgba(125,211,252,.22); --arb-line-2:rgba(167,139,250,.18);
  --arb-text:#eaf7ff; --arb-text-soft:#b8d7ea;
  --arb-accent:#67e8f9; --arb-accent-2:#a78bfa; --arb-accent-3:#f472b6;
  --arb-shadow:0 0 0 1px rgba(103,232,249,.12),0 0 18px rgba(103,232,249,.10),0 0 34px rgba(167,139,250,.08);
}
body{
  background:radial-gradient(circle at top left,rgba(103,232,249,.08),transparent 32%),
             radial-gradient(circle at top right,rgba(167,139,250,.08),transparent 28%),
             var(--arb-bg) !important;
  color:var(--arb-text) !important;
}
.vg-app-flat,.vg-main-flat,.vg-stage,.vg-topbar,.vg-domains-top,.vg-domains-actions,.vg-title-row{color:var(--arb-text);}
.vg-topbar{
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.00)),var(--arb-panel) !important;
  border-bottom:1px solid var(--arb-line) !important;
  box-shadow:var(--arb-shadow);
}
.vg-arb-theme-switch{margin-left:auto;display:flex;align-items:center;gap:8px;}
.vg-arb-theme-switch label{font:600 12px/1 Arial,sans-serif;color:var(--arb-text-soft);}
.vg-arb-theme-switch select{
  height:34px;border-radius:999px;padding:0 12px;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),var(--arb-panel-2) !important;
  color:var(--arb-text) !important;border:1px solid var(--arb-line) !important;box-shadow:var(--arb-shadow);
}
.vg-fullscreen-btn,.vg-mini-pill,.vg-mini-pill-add,.vg-now-pill,.vg-now-scale-pill,.vg-picker-btn,
button:not(.vg-swatch-btn):not(.vg-face-btn):not(.vg-mini-tab):not(.vg-tab):not(.vg-ptab):not(.vg-mini-pill):not(.vg-mode-toggle):not(.vg-nav-ptab):not(.vg-nav-ref-btn):not(.vg-ech-btn):not(.vg-digit-key):not(.vg-dt-mini):not(.vg-dt-target):not(.vg-icon-btn):not(.vg-save-view-btn),
select,input,textarea,.vg-content-editor,.vg-modal,.vg-hover-preview-card,
#hoverLargeCard,#hoverLargeCard *{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02)),var(--arb-panel) !important;
  color:var(--arb-text) !important;border-color:var(--arb-line) !important;box-shadow:var(--arb-shadow);
}
.vg-modal-header{
  background:linear-gradient(90deg,rgba(103,232,249,.08),rgba(167,139,250,.08)),var(--arb-panel-2) !important;
  color:var(--arb-text) !important;border-bottom:1px solid var(--arb-line) !important;
}
.vg-title-row strong,.vg-dt-card-title,.vg-dt-current,.vg-modal-header{color:var(--arb-text) !important;}
.vg-pill-btn:hover,.vg-mini-pill:hover,.vg-mini-pill-add:hover,.vg-now-pill:hover,.vg-now-scale-pill:hover,.vg-picker-btn:hover,.vg-fullscreen-btn:hover{
  border-color:var(--arb-accent) !important;
  box-shadow:0 0 0 1px rgba(103,232,249,.22),0 0 18px rgba(103,232,249,.16),0 0 28px rgba(167,139,250,.12);
}
.vg-now-scale-pill.is-active{
  background:linear-gradient(180deg,rgba(251,191,36,.35),rgba(245,158,11,.22)),var(--arb-panel-2) !important;
  border-color:rgba(251,191,36,.70) !important;
  color:#fef08a !important;
  box-shadow:0 0 0 1px rgba(251,191,36,.22),0 0 14px rgba(251,191,36,.20) !important;
}
.vg-now-pill.is-active{
  background:linear-gradient(180deg,rgba(34,211,238,.35),rgba(6,182,212,.22)),var(--arb-panel-2) !important;
  border-color:rgba(34,211,238,.70) !important;
  color:#cffafe !important;
  box-shadow:0 0 0 1px rgba(34,211,238,.22),0 0 14px rgba(34,211,238,.20) !important;
}
.vg-mini-tab.is-active,.vg-tab.is-active,.vg-ptab.is-active,.vg-dt-target.is-active{
  background:linear-gradient(180deg,rgba(103,232,249,.18),rgba(167,139,250,.14)),var(--arb-panel-2) !important;
  border-color:var(--arb-accent) !important;color:var(--arb-text) !important;
}
#boardSvg,svg{color:var(--arb-text);}
@media(max-width:860px){.vg-arb-theme-switch{width:100%;justify-content:flex-end;}}

/* ===== Mise en page ===== */
.vg-domains-top{display:block !important;}
.vg-domains-actions{display:flex !important;align-items:flex-start !important;justify-content:flex-start !important;gap:10px !important;flex-wrap:wrap !important;width:auto !important;}
.vg-now-pills-wrap{display:flex !important;flex-direction:column !important;gap:4px !important;}
.vg-now-scale-row,.vg-now-pills,#vgNowPills{display:flex !important;flex-wrap:wrap !important;gap:4px !important;}
.vg-now-pill,.vg-now-scale-pill{display:inline-flex !important;visibility:visible !important;opacity:1 !important;}
.vg-mini-pill,.vg-mini-pill-add,.vg-now-pill,.vg-now-scale-pill{
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  width:auto !important;min-width:28px !important;max-width:none !important;height:28px !important;
  padding:0 10px !important;border-radius:999px !important;font-size:12px !important;
  line-height:1 !important;flex:0 0 auto !important;
}


/* Styles de base communs */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: sans-serif;
  background: var(--arb-bg, #020617);
  color: var(--arb-text, #e2e8f0);
}
button { cursor: pointer; }
input, select, textarea {
  background: var(--arb-panel-2, #0f2040);
  color: var(--arb-text, #e2e8f0);
  border: 1px solid var(--arb-line, rgba(255,255,255,.1));
  border-radius: 8px;
  outline: none;
}
a { color: var(--arb-accent, #7dd3fc); }

/* Scrollbars modernes */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(125,211,252,.3); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: rgba(125,211,252,.6); }
* { scrollbar-width: thin; scrollbar-color: rgba(125,211,252,.3) transparent; }

/* Classes utilitaires */
.vg-btn-accent {
  padding: 6px 16px; border-radius: 8px;
  border: 1px solid var(--arb-accent); background: rgba(125,211,252,.1);
  color: var(--arb-accent); font-size: 12px; font-weight: 800;
}
.vg-btn-neutral {
  padding: 6px 14px; border-radius: 8px;
  border: 1px solid var(--arb-line); background: var(--arb-panel-2);
  color: var(--arb-text-soft); font-size: 12px; font-weight: 700;
}
.vg-btn-danger {
  padding: 5px 12px; border-radius: 7px;
  border: 1px solid rgba(239,68,68,.4); background: rgba(239,68,68,.08);
  color: #f87171; font-size: 11px; font-weight: 800;
}
.vg-panel {
  background: var(--arb-panel);
  border: 1px solid var(--arb-line);
  border-radius: 12px;
}
.vg-form-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.vg-form-row label { font-size: 11px; font-weight: 800; color: var(--arb-text-soft); }
.vg-form-row input, .vg-form-row select, .vg-form-row textarea {
  padding: 8px 10px; font-size: 13px; width: 100%;
}
.vg-form-row textarea { resize: vertical; min-height: 70px; }