/* Store4 colour themes (Ivan, 2026-10-01: "make real theme switchers — colors and logo").
   Same model as bizinly.com: Studio's page is the site; a theme changes the accent colour and the logo, never the
   layout, the copy or the components. Lime is the default (no attribute); Blue is <html data-theme="blue">, set by the
   header dots and remembered in localStorage ("store4-theme"), applied before paint by the script in <head>.

   Studio draws every accent from one token, --lime. Blue redefines it to the Classic blue. Where Studio puts dark
   text ON the accent, Blue needs light text to stay readable; where Studio puts the accent AS text on a dark
   surface, Blue uses a lighter blue for the same reason. The theme is still to be worked on with Ivan — this is
   the working minimum. */

[data-theme='blue'] {
  --lime: #343cbf;
  /* white page, as the Classic design had (Ivan, 2026-10-01) — Studio's warm off-white #f7f8f3 sits oddly with indigo */
  --paper: #fff;
}



/* ── GENERATED by the blue sweep (2026-10-01): every green tint Studio hard-codes, as the same shade in Classic's
   indigo hue (lightness kept, so contrast stays as designed); base tokens set to Classic's own values. Status
   pills keep green/amber as Classic did. Regenerate rather than edit by hand. ── */
[data-theme='blue']{--ink:#202744;--muted:#667087;--line:#e1e5ef}
[data-theme='blue'] .header nav a:hover,[data-theme='blue'] .underlink:hover{color:#1a2671}
[data-theme='blue'] .hero-copy>p{color:#4d4f61}
[data-theme='blue'] .powered{color:#646880}
[data-theme='blue'] .powered>span{border-left:1px solid #acafc4}
[data-theme='blue'] .order-receipt div>span{color:#2c3465}
[data-theme='blue'] .order-receipt>b>span{color:#1e2b7f}
[data-theme='blue'] .mock-label{color:#71758f}
[data-theme='blue'] .store-details article{border-top:1px solid #b1b3c6}
[data-theme='blue'] .detail-number{color:#6a6f8c}
[data-theme='blue'] .store-note>span{color:#727690}
[data-theme='blue'] .business .section-kicker{border-color:#373946;color:#b1b4c8}
[data-theme='blue'] .business .section-kicker>span:last-child{color:#7c809a}
[data-theme='blue'] .business-copy p{color:#9c9fb3}
[data-theme='blue'] .workspace{background:#f4f5f8;border:1px solid #444967;box-shadow:12px 12px 0 #212437}
[data-theme='blue'] .workspace-head{background:#222434;color:#a4a9c7}
[data-theme='blue'] .avatar{background:#b7bde3;color:#313867}
[data-theme='blue'] .workspace-eyebrow{color:#797d96}
[data-theme='blue'] .workspace-metrics{border:1px solid #d3d5e5}
[data-theme='blue'] .workspace-metrics>div+div{border-left:1px solid #d3d5e5}
[data-theme='blue'] .workspace-metrics span{color:#6c708a}
[data-theme='blue'] .order-line{border-bottom:1px solid #dadceb}
[data-theme='blue'] .order-line div>span{color:#7e8199}
[data-theme='blue'] .order-line.table-label{color:#8b8fa8}
[data-theme='blue'] .workspace-lucy{background:#daddef}
[data-theme='blue'] .workspace-lucy p{color:#545a85}
[data-theme='blue'] .workspace-lucy strong{color:#313656}
[data-theme='blue'] .workspace-footer{color:#8e92ad}
[data-theme='blue'] .business-bottom{border-top:1px solid #343645;color:#a3a8c4}
[data-theme='blue'] .lucy-section .section-kicker{border-color:#364bd0}
[data-theme='blue'] .lucy-section .section-kicker>span:last-child{color:#1f2c84}
[data-theme='blue'] .lucy-copy p{color:#252e66}
[data-theme='blue'] .lucy-demo{background:#eef0fb;border:1px solid #2f44c9;box-shadow:10px 10px 0 #394dd0}
[data-theme='blue'] .lucy-head>span{color:#666fa8}
[data-theme='blue'] .lucy-prompts>button{border:1px solid #bfc3df;color:#515781}
[data-theme='blue'] .lucy-prompts>button:hover{border-color:#1b2671}
[data-theme='blue'] .lucy-reply-label{color:#6c73a4}
[data-theme='blue'] .lucy-reply p{color:#4c5277}
[data-theme='blue'] .lucy-reply>div{border-top:1px solid #cccfe5;color:#7d83a7}
[data-theme='blue'] .demo-note{color:#6e76aa}
[data-theme='blue'] .ecosystem-name>span{color:#283aac}
[data-theme='blue'] .start-section{background:#e3e4ed}
[data-theme='blue'] .start-layout h2>span{color:#243499}
[data-theme='blue'] .start-copy>p{color:#5a5d73}
[data-theme='blue'] .contact-note{color:#7d819a}
[data-theme='blue'] .faq-list summary span{color:#7d819c}
[data-theme='blue'] .footer{border-top:1px solid #b4b7cb}
[data-theme='blue'] .footer>a:not(.brand){border-bottom:1px solid #898da3}
[data-theme='blue'] .footer-bottom{color:#7a7e96}
[data-theme='blue'] .concept-switch{border:1px solid #d3d5e5}
[data-theme='blue'] .concept-switch>span{color:#767a95}
[data-theme='blue'] .concept-switch>a:hover{background:#dfe1ed}
@media(max-width:850px){[data-theme='blue'] .header nav{border:1px solid #b0b5d3}}
@media(max-width:850px){[data-theme='blue'] .menu-toggle{border:1px solid #a8adcb}}
@media(max-width:540px){[data-theme='blue'] .workspace{box-shadow:6px 6px 0 #212437}}
@media(max-width:540px){[data-theme='blue'] .lucy-demo{box-shadow:6px 6px 0 #394dd0}}
/* ── end of generated block ── */

/* dark text on the accent → white on blue */
[data-theme='blue'] ::selection,
[data-theme='blue'] .skip,
[data-theme='blue'] .button:hover,
[data-theme='blue'] .button.compact,
[data-theme='blue'] .hero h1 > span,
[data-theme='blue'] .order-receipt,
[data-theme='blue'] .statement-band,
[data-theme='blue'] .store-note a {
  color: #fff;
}

/* the Lucy band is the accent end to end: its own copy goes light (Studio colours it olive, which reads on lime and
   not on blue). Only the copy — the demo panel inside keeps its own light surface and dark text. */
[data-theme='blue'] .lucy-section .section-kicker,
[data-theme='blue'] .lucy-section .section-kicker *,
[data-theme='blue'] .lucy-copy,
[data-theme='blue'] .lucy-copy * {
  color: #fff;
}
[data-theme='blue'] .lucy-copy p,
[data-theme='blue'] .lucy-section .section-kicker > span:last-child {
  color: #dfe2ff;
}
[data-theme='blue'] .lucy-section .section-kicker {
  border-color: #5a62d6;
}

/* the order card's second line: Studio hard-codes it olive, which only reads on lime (Ivan, 2026-10-01) */
[data-theme='blue'] .order-receipt div > span {
  color: #fff;
}
/* …and the dot in "bizinly." on the same card, light like the rest of the card's text */
[data-theme='blue'] .order-receipt > b > span {
  color: #a9b0ff;
}

/* Where "same lightness" is not the right answer for the generated block above:
   the Lucy panel's offset shadow is darker than its band in Studio — so on blue it must be a darker blue (kept
   lightness made it vanish into the band) */
[data-theme='blue'] .lucy-demo {
  box-shadow: 10px 10px 0 #232a93;
}
@media (max-width: 540px) {
  [data-theme='blue'] .lucy-demo {
    box-shadow: 6px 6px 0 #232a93;
  }
}
/* the selected Lucy prompt keeps Studio's own state (dark button, white text) — the generated colour for the
   unselected prompts would otherwise override it, since this file loads after studio.css */
[data-theme='blue'] .lucy-prompts > button[aria-pressed='true'] {
  border-color: var(--ink);
  color: #fff;
}
/* the closing band: the Classic design's own pale band colour */
[data-theme='blue'] .start-section {
  background: #eff2fd;
}

/* the accent as text on a dark surface → a lighter blue */
[data-theme='blue'] .business-copy .underlink,
[data-theme='blue'] .workspace-head > strong > span,
[data-theme='blue'] .business-bottom span:nth-child(even) {
  color: #a9b0ff;
}

/* the site's logo (header and footer) — not the logos on the Brand Assets page, which must show what they are */
[data-theme='blue'] a.brand img[src$='store4-flat-lime.svg'] {
  content: url('assets/store4-flat-classic.svg');
}