/* vars base */
:root {
  --grafito-00:#1a1a1a;
  --grafito-01:#222;
  --grafito-02:#2a2a2a;
  --grafito-03:#333;
  --grafito-04:#3d3d3d;
  --grad-bg:linear-gradient(135deg,#1f1f1f,#2a2a2a,#1f1f1f);
  --grad-panel:linear-gradient(135deg,#222,#2d2d2d,#222);
  --grad-accent:linear-gradient(135deg,#3a3a3a,#4a4a4a,#3a3a3a);
  --border-grafito:1px solid rgba(255,255,255,0.08);
  --text-color:#e6e6e6;}
/* fondo */
body { background:var(--grad-bg); color:var(--text-color); }
/* base grafito */
.panel-sala, .panel-idioma, .panel-texto,
.window, #leftPanel, #rightPanel,
.topbar, .elorida-footer {
  background:var(--grad-panel); border:var(--border-grafito); backdrop-filter:blur(12px);}
/* light panel */
.panel-sala.theme-light,
.panel-idioma.theme-light,
.panel-texto.theme-light {
  background:var(--panel-bg);
  border:var(--panel-border);
  color:var(--text-color);}
.panel-sala.theme-light .panel-header,
.panel-idioma.theme-light .panel-header,
.panel-texto.theme-light .panel-header {
  background:var(--panel-bg-2);
  border-bottom:var(--panel-border);}
.panel-sala.theme-light textarea,
.panel-idioma.theme-light textarea,
.panel-texto.theme-light textarea,
.panel-sala.theme-light [contenteditable="true"],
.panel-idioma.theme-light [contenteditable="true"],
.panel-texto.theme-light [contenteditable="true"] {
  background:var(--input-bg);
  border:var(--input-border);
  color:var(--text-color);}
/* light top/footer */
.topbar.theme-light,
.elorida-footer.theme-light {
  background:var(--panel-bg);
  border:var(--panel-border);
  color:var(--text-color);}
/* tema light */
.theme-light {
  --panel-bg:#bababd; --panel-bg-2:#dcdcdf;
  --panel-border:1px solid #c8c8ca;
  --text-color:#111;
  --input-bg:#f2f2f4; --input-border:1px solid #c8c8ca;}
/* tema azul */
.theme-grafito-azul {
  --grad-bg:linear-gradient(135deg,#1f1f1f,#26263a,#1f1f1f);
  --grad-panel:linear-gradient(135deg,#2a2a3a,#3a3a5a,#2a2a3a);
  --grad-accent:linear-gradient(135deg,#4a4a7a,#5a5a9a,#4a4a7a);
  --text-color:#d6a4ff;}
/* tema neon */
.theme-grafito-neon {
  --grad-bg:linear-gradient(135deg,#1a1a1a,#1f1f1f,#1a1a1a);
  --grad-panel:linear-gradient(135deg,#1f1f1f,#223322,#1f1f1f);
  --grad-accent:linear-gradient(135deg,#2a442a,#33aa33,#2a442a);
  --text-color:#c8ffc8;}
/* tema rosa */
.theme-grafito-rosa {
  --grad-bg:linear-gradient(135deg,#1f1f1f,#2a1f2a,#1f1f1f);
  --grad-panel:linear-gradient(135deg,#2a1f2a,#3a2a3a,#2a1f2a);
  --grad-accent:linear-gradient(135deg,#5a3a5a,#aa66aa,#5a3a5a);
  --text-color:#ffd6f7;}
/* tema elorida */
.theme-elorida {
  --grad-bg:linear-gradient(135deg,#1f1f1f,#2a2f55,#1f1f1f);
  --grad-panel:linear-gradient(135deg,#2a2f55,#1e2b63,#2a2f55);
  --grad-accent:linear-gradient(135deg,#3a4a7a,#4b6cff,#3a4a7a);
  --text-color:#77d8ff;}
/* aplicar temas */
.panel-sala.theme-grafito-azul,
.panel-idioma.theme-grafito-azul,
.panel-texto.theme-grafito-azul,
.panel-sala.theme-grafito-neon,
.panel-idioma.theme-grafito-neon,
.panel-texto.theme-grafito-neon,
.panel-sala.theme-grafito-rosa,
.panel-idioma.theme-grafito-rosa,
.panel-texto.theme-grafito-rosa,
.panel-sala.theme-elorida,
.panel-idioma.theme-elorida,
.panel-texto.theme-elorida {
  background:var(--grad-panel);
  border:var(--border-grafito);
  color:var(--text-color);}
/* texto footer por tema */
.elorida-footer.theme-light,
.elorida-footer.theme-light * {color:var(--text-color);}