/* Armoneda (b52, refăcut în b53): a 3-a temă — Magenta (din Harmon-Proiect-Avatare.html, Meta AI).
   Fundal negru cu halouri magenta în degrade, carduri cu tentă magenta, butoane care strălucesc.
   Se sprijină pe tema închisă a sursei (data-theme="dark"). Fișier separat, servit direct (nu trece prin Tailwind). */
html[data-armoneda-tema="magenta"] {
  --am-mag: #FF00FF;
  --am-mag-soft: #FF99FF;
  --am-mag-deep: #E600E6;
  --am-bg: radial-gradient(1100px 700px at 50% -15%, rgba(255, 0, 255, 0.42), transparent 65%),
           radial-gradient(900px 700px at -10% 110%, rgba(255, 0, 255, 0.30), transparent 60%),
           radial-gradient(700px 600px at 110% 60%, rgba(170, 0, 255, 0.22), transparent 60%),
           linear-gradient(160deg, #1f0020 0%, #0a000a 45%, #000000 100%);

  --color-surface: #050005;
  --color-surface-hover: rgba(255, 0, 255, 0.08);
  --color-surface-inset: rgba(255, 255, 255, 0.04);
  --color-surface-inset-hover: rgba(255, 0, 255, 0.10);
  --color-container: rgba(14, 4, 14, 0.78);
  --color-container-hover: rgba(40, 0, 40, 0.85);
  --color-container-inset: rgba(255, 255, 255, 0.05);
  --color-container-inset-hover: rgba(255, 0, 255, 0.12);
  --color-focus-ring: rgba(255, 0, 255, 0.7);
  --color-nav-indicator: #FF00FF;
  --color-owner-b: #FB923C; /* Raluca: portocaliu-coral pe tema Magenta (decizia lui Gabriel) */
  --font-sans: 'Inter', 'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  background: #000;
}

/* Fundalul: negru + magenta în degrade. Fixat pe fereastră, ca toate suprafețele să arate aceeași bucată. */
html[data-armoneda-tema="magenta"] body,
html[data-armoneda-tema="magenta"] .bg-surface {
  background-color: #050005;
  background-image: var(--am-bg);
  background-attachment: fixed;
  background-repeat: no-repeat;
}
/* Antetul lipicios: translucid, cu blur, ca degradeul să se vadă prin el */
html[data-armoneda-tema="magenta"] .sticky.bg-surface {
  background: rgba(8, 0, 8, 0.55);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-color: rgba(255, 0, 255, 0.18);
}

/* Cardurile: degrade magenta → transparent, chenar magenta, strălucire slabă */
html[data-armoneda-tema="magenta"] .bg-container {
  background-image: linear-gradient(135deg, rgba(255, 0, 255, 0.14) 0%, rgba(255, 0, 255, 0.03) 45%, rgba(255, 255, 255, 0.02) 100%);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
html[data-armoneda-tema="magenta"] .shadow-border-xs,
html[data-armoneda-tema="magenta"] .shadow-border-sm,
html[data-armoneda-tema="magenta"] .shadow-border-md {
  box-shadow: 0 0 0 1px rgba(255, 0, 255, 0.28), 0 0 28px rgba(255, 0, 255, 0.12);
}
html[data-armoneda-tema="magenta"] .border-primary { border-color: rgba(255, 0, 255, 0.22); }
html[data-armoneda-tema="magenta"] .border-secondary { border-color: rgba(255, 255, 255, 0.14); }
html[data-armoneda-tema="magenta"] .border-tertiary,
html[data-armoneda-tema="magenta"] .border-divider { border-color: rgba(255, 0, 255, 0.14); }

/* Butoanele principale: magenta, cu o strălucire discretă; la trecerea mouse-ului puțin mai puternică
   (b63: mai puțin stridente, la cererea lui Gabriel) */
html[data-armoneda-tema="magenta"] .bg-inverse {
  background-color: #E600E6;
  color: #FFFFFF;
  box-shadow: 0 0 8px rgba(255, 0, 255, 0.28);
  transition: box-shadow .18s ease, transform .18s ease, filter .18s ease, background-color .18s ease;
}
html[data-armoneda-tema="magenta"] .text-inverse { color: #FFFFFF; }
html[data-armoneda-tema="magenta"] .bg-inverse:hover,
html[data-armoneda-tema="magenta"] .hover\:bg-inverse-hover:hover {
  background-color: #D100D1;
  box-shadow: 0 0 14px rgba(255, 0, 255, 0.42);
}
html[data-armoneda-tema="magenta"] .bg-inverse:disabled,
html[data-armoneda-tema="magenta"] .bg-inverse[disabled] {
  background-color: rgba(255, 0, 255, 0.35);
  box-shadow: none; filter: none; transform: none;
}

/* Butoanele secundare / contur: sticlă, cu chenar și strălucire magenta la hover */
html[data-armoneda-tema="magenta"] [class*="theme-dark:bg-gray-700"] {
  background-color: rgba(255, 255, 255, 0.07);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14) inset;
  transition: box-shadow .18s ease, background-color .18s ease;
}
html[data-armoneda-tema="magenta"] [class*="theme-dark:bg-gray-700"]:hover,
html[data-armoneda-tema="magenta"] .border-secondary.bg-transparent:hover {
  background-color: rgba(255, 0, 255, 0.14);
  box-shadow: 0 0 0 1px rgba(255, 0, 255, 0.5) inset, 0 0 10px rgba(255, 0, 255, 0.22);
  border-color: rgba(255, 0, 255, 0.6);
}

/* Meniul lateral: pictograma activă magenta, cu halo */
html[data-armoneda-tema="magenta"] [aria-current="page"] .bg-container {
  background: rgba(255, 0, 255, 0.22);
  color: #FFFFFF;
  box-shadow: 0 0 0 1px rgba(255, 0, 255, 0.45), 0 0 10px rgba(255, 0, 255, 0.3);
}
html[data-armoneda-tema="magenta"] .bg-nav-indicator { box-shadow: 0 0 6px rgba(255, 0, 255, 0.6); }

/* Filele/segmentele selectate (ex. Aspect, perioade) */
html[data-armoneda-tema="magenta"] .bg-container.shadow-sm,
html[data-armoneda-tema="magenta"] .bg-container.shadow-xs { box-shadow: 0 0 0 1px rgba(255, 0, 255, 0.35), 0 0 14px rgba(255, 0, 255, 0.25); }

/* Câmpuri: focalizare magenta */
html[data-armoneda-tema="magenta"] input:focus,
html[data-armoneda-tema="magenta"] select:focus,
html[data-armoneda-tema="magenta"] textarea:focus {
  border-color: rgba(255, 0, 255, 0.7) !important;
  box-shadow: 0 0 0 1px rgba(255, 0, 255, 0.5), 0 0 16px rgba(255, 0, 255, 0.3) !important;
}

html[data-armoneda-tema="magenta"] ::selection { background: #FF00FF; color: #FFFFFF; }
html[data-armoneda-tema="magenta"] .text-link { color: #FF99FF; }

/* Punctul „a cui e” — culoarea pentru tema Magenta, dacă e pusă */
html[data-armoneda-tema="magenta"] .owner-dot { background: var(--owner-magenta, var(--owner-dark)); }

/* b63: bifele în culoarea temei */
html[data-armoneda-tema="magenta"] input[type="checkbox"], html[data-armoneda-tema="magenta"] input[type="radio"] { accent-color: #E600E6; }