/*
 * Senshu: Postiz im Portal-Rahmen (eingeschleust von nginx, gesteuert von einbettung.js).
 * Greift nur mit html[data-senshu="eingebettet"]; Farben nur mit html[data-senshu-farben].
 * Greift ein Selektor nach einem Postiz-Update nicht mehr, bleibt das Element sichtbar.
 */

/* Senshu statt Postiz in beiden Modi: Zeichen in der linken Leiste, Schriftzug auf der Anmeldeseite.
   Die Postiz-SVGs (feste viewBox) bleiben im DOM, nur ihr Inhalt verschwindet hinter dem Senshu-Bild. */
html[data-senshu] #left-menu svg[viewBox="0 0 60 60"] {
  background: url(/senshu/senshu-zeichen.svg) center / 48px 48px no-repeat;
}
html[data-senshu] #left-menu svg[viewBox="0 0 60 60"] > *,
html[data-senshu] svg[viewBox="0 0 101 33"] > * {
  display: none;
}
html[data-senshu] svg[viewBox="0 0 101 33"] {
  width: 196px;
  height: 22px;
  background: url(/senshu/senshu-schriftzug-hell.png) left center / contain no-repeat;
}

/* Eigener Tab: Portal-Palette und -Schrift fest hinterlegt (Werte aus portal/src/styles/portal.css
   und theme.css; bei Änderungen dort hier nachziehen). Im Portal-Rahmen schickt das Portal sie selbst. */
html[data-senshu="eigenstaendig"] {
  --senshu-marke: #dda146;
  --senshu-markeCta: #9a6817;
  --senshu-markeCtaHover: #855912;
  --senshu-schrift: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
html[data-senshu="eigenstaendig"] body.light {
  --senshu-grund: oklch(98.5% 0.003 265);
  --senshu-flaeche: oklch(100% 0 0);
  --senshu-feld: oklch(100% 0 0);
  --senshu-schwach: oklch(80% 0.01 265);
  --senshu-gedimmt: oklch(52% 0.02 265);
  --senshu-sekundaer: oklch(44% 0.02 265);
  --senshu-text: oklch(26% 0.02 265);
  --senshu-textStark: oklch(20% 0.02 265);
}
html[data-senshu="eigenstaendig"] body.dark {
  --senshu-grund: oklch(13% 0.02 265);
  --senshu-flaeche: oklch(21% 0.02 265);
  --senshu-feld: oklch(13% 0.02 265);
  --senshu-schwach: oklch(37% 0.02 265);
  --senshu-gedimmt: oklch(55% 0.02 265);
  --senshu-sekundaer: oklch(70% 0.02 265);
  --senshu-text: oklch(89% 0.01 265);
  --senshu-textStark: oklch(94% 0.005 265);
}

/* Linke Postiz-Leiste samt Logo (fester Anker #left-menu): die Portal-Reiter steuern Postiz. */
html[data-senshu="eingebettet"] div:has(> #left-menu) {
  display: none !important;
}

/* Obere Postiz-Zeile (Titel, Hell/Dunkel, Sprache, Glocke): kommt aus dem Portal. */
html[data-senshu="eingebettet"] .blurMe > div:first-child {
  display: none !important;
}

/* Außenabstand weg, der Portal-Rahmen hat schon einen. */
html[data-senshu="eingebettet"] .min-h-screen.min-w-screen {
  padding: 0 !important;
}

/* Portal-Farben (Mischungen in oklab: oklch interpoliert den Farbton, und das Portal-Weiß „oklch(100% 0 0)“ trägt Farbton 0° – Gold auf Weiß würde rosa). Höhere Spezifität als Postiz' „:root .dark“ und „:root .light“. */
html[data-senshu-farben] body.light,
html[data-senshu-farben] body.dark {
  --new-bgColor: var(--senshu-grund);
  --new-bgColorInner: var(--senshu-flaeche);
  --new-bgLineColor: var(--senshu-grund);
  --new-big-strips: color-mix(in oklab, var(--senshu-text) 4%, var(--senshu-flaeche));
  --new-small-strips: color-mix(in oklab, var(--senshu-text) 3%, var(--senshu-flaeche));
  --new-col-color: color-mix(in oklab, var(--senshu-text) 5%, var(--senshu-flaeche));
  --new-table-header: color-mix(in oklab, var(--senshu-text) 4%, var(--senshu-flaeche));
  --new-box-hover: color-mix(in oklab, var(--senshu-text) 6%, var(--senshu-flaeche));
  --new-blockSeparator: color-mix(in oklab, var(--senshu-text) 8%, var(--senshu-flaeche));
  --new-settings: color-mix(in oklab, var(--senshu-text) 8%, var(--senshu-flaeche));
  --new-btn-simple: color-mix(in oklab, var(--senshu-text) 8%, var(--senshu-flaeche));
  --new-border: color-mix(in oklab, var(--senshu-text) 12%, var(--senshu-flaeche));
  --new-table-border: color-mix(in oklab, var(--senshu-text) 12%, var(--senshu-flaeche));
  --new-sep: color-mix(in oklab, var(--senshu-text) 22%, var(--senshu-flaeche));
  --new-boxFocused: color-mix(in oklab, var(--senshu-marke) 16%, var(--senshu-flaeche));
  --new-btn-primary: var(--senshu-markeCta);
  --new-ai-btn: var(--senshu-markeCta);
  --new-btn-text: var(--senshu-textStark);
  /* --new-textColor bleibt: Postiz nutzt dort ein RGB-Tripel („14 14 14“) in rgb(var(--new-textColor)). */
  --new-textItemFocused: var(--senshu-markeCta);
  --new-textItemBlur: var(--senshu-gedimmt);
  --new-table-text: var(--senshu-sekundaer);
  --new-table-text-focused: var(--senshu-marke);
  --new-menu-dots: var(--senshu-gedimmt);
  --new-menu-hover: var(--senshu-textStark);
  /* Postiz' Lila über die zweite Variablen-Ebene: Knöpfe (forth), Hover (seventh), lila Zusatzfarben. */
  --color-primary: var(--senshu-grund);
  --color-secondary: var(--senshu-flaeche);
  --color-third: var(--senshu-flaeche);
  --color-forth: var(--senshu-markeCta);
  --color-seventh: var(--senshu-markeCtaHover, var(--senshu-markeCta));
  --color-custom4: var(--senshu-markeCta);
  --color-custom30: var(--senshu-markeCta);
  --color-custom45: var(--senshu-markeCta);
  --color-custom28: color-mix(in oklab, var(--senshu-marke) 45%, var(--senshu-flaeche));
  --color-custom41: color-mix(in oklab, var(--senshu-marke) 30%, var(--senshu-flaeche));
}

/* Fest kodiertes Postiz-Lila (#612BD3) in einzelnen Klassen. */
html[data-senshu-farben] [class*="bg-[#612bd3]/10" i] {
  background-color: color-mix(in oklab, var(--senshu-markeCta) 10%, transparent) !important;
}
html[data-senshu-farben] [class*="hover:bg-[#612bd3]/80" i]:hover {
  background-color: color-mix(in oklab, var(--senshu-markeCta) 80%, transparent) !important;
}
html[data-senshu-farben] [class*="hover:border-[#612bd3]" i]:hover {
  border-color: color-mix(in oklab, var(--senshu-markeCta) 45%, transparent) !important;
}

/* Schrift des Portals (einbettung.js setzt --senshu-schrift); Symbol-Schriften setzen ihre eigene. */
html[data-senshu-schrift] body,
html[data-senshu-schrift] .min-h-screen.min-w-screen {
  font-family: var(--senshu-schrift) !important;
}

/* Agent-Chats löschen (eigenes Feature, bis Postiz es selbst kann): × am Chat-Eintrag,
   sichtbar beim Darüberfahren, auf Touch-Geräten immer. */
html[data-senshu="eingebettet"] a[data-senshu-x] {
  position: relative;
  padding-inline-end: 30px !important;
}
html[data-senshu="eingebettet"] .senshu-chat-x {
  position: absolute;
  inset-inline-end: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  line-height: 20px;
  text-align: center;
  border-radius: 6px;
  font-size: 17px;
  color: var(--senshu-gedimmt, #777b7f);
  opacity: 0;
  cursor: pointer;
}
html[data-senshu="eingebettet"] a[data-senshu-x]:hover .senshu-chat-x,
html[data-senshu="eingebettet"] .senshu-chat-x:focus-visible {
  opacity: 1;
}
html[data-senshu="eingebettet"] .senshu-chat-x:hover {
  color: var(--senshu-markeCta, #9a6817);
  background: color-mix(in oklab, var(--senshu-markeCta, #9a6817) 14%, transparent);
}
@media (hover: none) {
  html[data-senshu="eingebettet"] .senshu-chat-x {
    opacity: 1;
  }
}

/* Eingebettete Postiz-Symbole: Lila in Senshu-Gold (gleiche Rechnung wie die Illustrationen in
   deploy/postiz/nginx.conf; das Postiz-Hauptlila wird genau das Portal-Gold der Knöpfe). */
html[data-senshu] [fill="#612BD3" i] { fill: #9a6817 !important; }
html[data-senshu] [stroke="#612BD3" i] { stroke: #9a6817 !important; }
html[data-senshu] [stop-color="#612BD3" i] { stop-color: #9a6817 !important; }
html[data-senshu] [fill="#DACBFB" i] { fill: #efcea3 !important; }
html[data-senshu] [stroke="#DACBFB" i] { stroke: #efcea3 !important; }
html[data-senshu] [stop-color="#DACBFB" i] { stop-color: #efcea3 !important; }
html[data-senshu] [fill="#9162FF" i] { fill: #b67a01 !important; }
html[data-senshu] [stroke="#9162FF" i] { stroke: #b67a01 !important; }
html[data-senshu] [stop-color="#9162FF" i] { stop-color: #b67a01 !important; }
html[data-senshu] [fill="#8C66FF" i] { fill: #b67b08 !important; }
html[data-senshu] [stroke="#8C66FF" i] { stroke: #b67b08 !important; }
html[data-senshu] [stop-color="#8C66FF" i] { stop-color: #b67b08 !important; }
html[data-senshu] [fill="#4500E7" i] { fill: #734c01 !important; }
html[data-senshu] [stroke="#4500E7" i] { stroke: #734c01 !important; }
html[data-senshu] [stop-color="#4500E7" i] { stop-color: #734c01 !important; }
html[data-senshu] [fill="#FC69FF" i] { fill: #ea9e00 !important; }
html[data-senshu] [stroke="#FC69FF" i] { stroke: #ea9e00 !important; }
html[data-senshu] [stop-color="#FC69FF" i] { stop-color: #ea9e00 !important; }