/*
 * mira-b-showroom.css — GENERYCZNE domknięcie warstwy Showroom UX do KANONU (2026-08-26).
 *
 * Zero sluga klientki, zero zaszytego koloru. Robi dwie rzeczy:
 *  1) MOST KOLORU MARKI: bazowy mira-b-preview.css TWARDO ustawia domyślny fiolet Miry (#806bc5)
 *     na tokenach Showroomu (--show-accent*, --report-accent*, --deep-panel*) ORAZ nadpisuje --acc*
 *     fioletem w dwóch głównych kontenerach (.main:has(.mira-b-dzis), .mira-b-chat-preview
 *     .main:has(.saas-chat-wrap)). Sam mechanizm client-accent (--acc inline z panel-meta.akcent)
 *     NIE przebija tych kontenerów, więc główny ekran zostałby fioletowy u klientki. Ten most
 *     przywraca markę klientki, biorąc ją z NOŚNIKA --orb-accent (client-accent ustawia go inline
 *     = surowy akcent, a baza NIGDZIE go nie re-definiuje) i licząc pochodne tym samym color-mix,
 *     co mira-saas.css (78% black / 62% white). Pochodne, nie surowy hex — więc DOWOLNA marka działa.
 *  2) LAYOUT WSPÓLNY: układ integracji/zespołu/systemu w ramie 12-kolumn + ukrycie etykiety „showroom".
 *
 * SCOPE: most koloru pod .client-accent (klasa jest TYLKO gdy klientka ma panel-meta.akcent w jasnym
 * motywie) → DEMO bez marki zachowuje domyślny fiolet złotego standardu (regresja zero demo).
 * Cała warstwa inertna, dopóki loader nie doda klas mira-b-* (panel-meta.skora === 'saas-showroom').
 *
 * Geneza: de-bespoke prototypu gold (wariant r8) zaakceptowanego żywo u pierwszej klientki —
 * zaszyty kolor marki i ręczny muting zdjęte (to było strojenie pod konkretną, saturowaną barwę),
 * mechanizm uogólniony na nośnik --orb-accent. Bazowy mira-b-preview.css NIETKNIĘTY
 * (demo i istniejące klientki na skórze 'saas' bez ryzyka). Brief panelu Showroom, 2026-08-26 (ZARZADZANIE-FIRMA/).
 */

/* ── 1. MOST KOLORU MARKI (tylko gdy klientka ma akcent → jest klasa client-accent) ───────────
 * Lista kontenerów = ta sama co w r8 (przywraca markę tam, gdzie baza wpina fiolet): korzeń +
 * ekran Dziś + główna czatu + wspólna rama .mira-show + ekran Raportów. */
html.saas-skin.mira-b-preview.client-accent,
html.saas-skin.mira-b-preview.client-accent .mira-b-dzis,
html.saas-skin.mira-b-preview.client-accent .main:has(.saas-chat-wrap),
html.saas-skin.mira-b-preview.client-accent .mira-show,
html.saas-skin.mira-b-preview.client-accent .mira-b-report {
  /* pochodne marki liczone RAZ (te same proporcje co mira-saas.css .client-accent: 78% black / 12% white),
     żeby jedna zmiana odcienia nie wymagała ruszania siedmiu miejsc w tym bloku */
  --_acc-dark: color-mix(in srgb, var(--orb-accent) 78%, black);
  --_acc-soft: color-mix(in srgb, var(--orb-accent) 12%, white);
  /* rodzina --acc: baza nadpisuje CAŁĄ (--acc/--acc-2/--acc-dark/--acc-soft) fioletem w kontenerach
     Dziś/czat, więc każda z czterech musi tu być z !important (usunięcie którejś zostawia fiolet) */
  --acc: var(--orb-accent) !important;
  --acc-2: color-mix(in srgb, var(--orb-accent) 62%, white) !important;
  --acc-dark: var(--_acc-dark) !important;
  --acc-soft: var(--_acc-soft) !important;
  /* tokeny Showroomu: baza ustawia je tylko regułą (bez inline), więc bez !important wystarczy */
  --show-accent: var(--orb-accent);
  --show-accent-dark: var(--_acc-dark);
  --show-accent-soft: var(--_acc-soft);
  --report-accent: var(--orb-accent);
  --report-accent-dark: var(--_acc-dark);
  --report-accent-soft: var(--_acc-soft);
  --deep-panel: var(--_acc-dark);
  --deep-panel-2: color-mix(in srgb, var(--orb-accent) 84%, black);
}

/* ── 2. LAYOUT WSPÓLNY (bez koloru, dla KAŻDEJ klientki na Showroom — stąd .mira-b-preview, nie
 * .client-accent) ───────────────────────────────────────────────────────────────────────────── */

/* Etykieta „showroom" z bazowej warstwy podglądu nie może wisieć u klientki. */
html.saas-skin.mira-b-preview body::before {
  display: none !important;
  content: none !important;
}

/* Żywe integracje układają się jak karty systemu Złotego Standardu, nie jak stara długa lista. */
html.saas-skin.mira-b-preview .mira-show-system-live .intg-wrap > section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
html.saas-skin.mira-b-preview .mira-show-system-live .intg-wrap > section > h3,
html.saas-skin.mira-b-preview .mira-show-system-live .intg-wrap > section > .card:only-child {
  grid-column: 1 / -1;
}
html.saas-skin.mira-b-preview .mira-show-system-live .intg-wrap > section > .card {
  min-height: 118px;
  margin: 0 !important;
  padding: 20px !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}
@media (max-width: 760px) {
  html.saas-skin.mira-b-preview .mira-show-system-live .intg-wrap > section {
    grid-template-columns: 1fr;
  }
}

/* Zespół i System zachowują prawdziwe komponenty kapsuły, ale ich zawartość zajmuje pełną
 * szerokość dwunastokolumnowej ramy Złotego Standardu. */
html.saas-skin.mira-b-preview .mira-show-team-live > .mira-live-embed,
html.saas-skin.mira-b-preview .mira-show-system-live > .mira-live-embed {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
}
html.saas-skin.mira-b-preview .mira-show-system-live .intg-wrap {
  width: 100%;
  max-width: none !important;
  box-sizing: border-box;
}