/* PostSwipe brand-color override (staging only — not deployed).
   Port this file (and the data-source hooks in brand-colors.js / the later
   repo change to pass `source` through Kalender) into the app source.

   Tokens below are the intended app palette.
   Live postswipe.se (2026-11-14) actually uses --lime:#C8FF2E and has no
   wine-red. William asked for Higgsfield lime #A3FF12 on Create highlights
   and the original .se black/white base. --ps-wine is reserved; it is not
   painted across the UI because it does not appear on live .se.
*/

:root {
  --ps-bg: #000000;
  --ps-fg: #ffffff;
  --ps-t2: rgba(255, 255, 255, 0.66);
  --ps-t3: rgba(255, 255, 255, 0.45);
  --ps-t4: rgba(255, 255, 255, 0.28);
  --ps-l1: rgba(255, 255, 255, 0.10);
  --ps-sheet: #0e0e0e;
  --ps-btn: #141414;
  --ps-panel: #0b0b0b;
  --ps-cta: #ffffff;
  --ps-cta-fg: #000000;
  --ps-lime-se: #C8FF2E;   /* token on live postswipe.se */
  --ps-lime: #A3FF12;      /* Higgsfield lime — Create + own-created calendar */
  --ps-on-lime: #000000;
  --ps-wine: #6B0F1A;      /* requested; not found on live .se */
  --ps-cal-ai: #ffffff;    /* Kalender outline: AI / not from Create */
  --ps-cal-own: #A3FF12;   /* Kalender outline: own-created (source=create) */
}

/* -------------------------------------------------------------------------- */
/* Create ('creative'): lime only on key Higgsfield-style highlights          */
/* Default + studio/bla themes. Do not lime the rest of the app.              */
/* -------------------------------------------------------------------------- */

.ps-create,
html[data-cw-style][data-cw-mode] .ps-create,
html[data-cw-style=studio][data-cw-mode=dark] .ps-create,
html[data-cw-style=studio][data-cw-mode=light] .ps-create,
html[data-cw-style=bla][data-cw-mode=dark] .ps-create,
html[data-cw-style=bla][data-cw-mode=light] .ps-create {
  --cw-accent: var(--ps-lime);
  --cw-on-accent: var(--ps-on-lime);
  --cw-accent-fill: var(--ps-lime);
  --cw-accent-line: var(--ps-lime);
  --cw-accent-glow: 0 8px 24px color-mix(in srgb, var(--ps-lime) 28%, transparent);
  --cw-icon-fg: var(--ps-lime);
  --cw-eye: var(--ps-lime);
  --cw-ok: var(--ps-lime);
  --cw-badge-bg: var(--ps-lime);
  --cw-badge-fg: var(--ps-on-lime);
}

/* Solid lime CTAs (generate / Skapa video / primary) with black text.
   Overrides the studio glass mint gradient so contrast stays WCAG AAA. */
.ps-create .cs-hero-cta,
.ps-create .cr-pri,
.ps-create .cs-chip[aria-pressed=true],
.ps-create .cr-picks button[aria-pressed=true],
.ps-create .cr-steps li.on,
.ps-create .cw-use,
.cw .cw-use,
.cw .cw-done,
.cw .cw-seg button[aria-pressed=true],
.cw .cw-choice[aria-checked=true],
html[data-cw-style=studio] .ps-create :is(
  .cr-pri,
  .cs-hero-cta,
  .cs-chip[aria-pressed=true],
  .cr-picks button[aria-pressed=true],
  .cw-use,
  .cw-done,
  .cw-seg button[aria-pressed=true],
  .cw-choice[aria-checked=true]
) {
  background: var(--ps-lime);
  color: var(--ps-on-lime);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Active Create tab / Bild-Video toggle underline or fill */
.cw .cw-tabs button[aria-current=page] {
  color: var(--cw-text);
  border-bottom-color: var(--ps-lime);
}

/* Hero carousel: selected dot */
.ps-create .cs-hero-dots button[aria-selected=true] {
  background: var(--ps-lime);
}

/* Model chip / selected model tile */
.ps-create .cs-model-chip {
  box-shadow: inset 0 0 0 1px var(--ps-lime);
}
.ps-create .cs-ctile[aria-checked=true] .cs-ctile-pic,
.ps-create .cs-ctile[aria-pressed=true] .cs-ctile-pic {
  outline: 2px solid var(--ps-lime);
  outline-offset: 2px;
}
.ps-create .cs-modelfield[aria-pressed=true],
.ps-create .cs-modelfield[aria-checked=true],
.ps-create .cs-modelfield:has([aria-pressed=true]) {
  border-color: var(--ps-lime);
}

/* Progress (stepper + any accent-fill bar already using the token) */
.ps-create .cr-steps li.on {
  background: var(--ps-lime);
  color: var(--ps-on-lime);
}
.ps-create .cr-switch[aria-checked=true] .cr-sw {
  background: var(--ps-lime);
}

/* Focus rings inside Create */
.ps-create :focus-visible {
  outline: 2px solid var(--ps-lime);
  outline-offset: 2px;
}

/* -------------------------------------------------------------------------- */
/* Kalender: white outline = AI / not from Create; lime = own-created         */
/* Hooks: [data-source=create] or .is-own  vs  [data-source=ai] or default    */
/* -------------------------------------------------------------------------- */

.ps-app .mcell .mi.stack .st,
.ps-app .mcell .mi img:not(.b),
.ps-app .wk .dh img,
.ps-app .screen[data-s=planned] .dev > img,
.ps-app .mk-plan-thumb,
.ps-app .mk-thumb {
  outline: 1.5px solid var(--ps-cal-ai);
  outline-offset: 1.5px;
}

.ps-app .mcell .mi.stack .st[data-source=create],
.ps-app .mcell .mi.stack .st.is-own,
.ps-app .mcell .mi[data-source=create] img:not(.b),
.ps-app .mcell .mi.is-own img:not(.b),
.ps-app .wk .dh img[data-source=create],
.ps-app .wk .dh.is-own img,
.ps-app .screen[data-s=planned] .dev[data-source=create] > img,
.ps-app .screen[data-s=planned] .dev.is-own > img,
.ps-app .mk-plan-thumb[data-source=create],
.ps-app .mk-thumb[data-source=create],
.ps-app .mk-thumb.is-own,
.ps-app .mcell .mi.mp img:not(.b) {
  outline-color: var(--ps-cal-own);
}

/* -------------------------------------------------------------------------- */
/* App chrome stays .se black / white. Do not lime the main tab bar.          */
/* -------------------------------------------------------------------------- */

html[data-postswipe-web] .ps-app.morkrum {
  background: var(--ps-bg);
  color: var(--ps-fg);
}