/* RakennusPro-ulkoasun pohja. Tunnukset ovat CSS-muuttujia.
   Vaalea on oletus (kojelauta). Tumma tulee [data-teema="tumma"]-attribuutista
   tai prefers-color-scheme-kyselystä, kun valinta on automaattinen.
   Valinta tallennetaan rp-teema.js:ssä (vaalea / tumma / automaattinen).
   Uudet näkymät käyttävät .rp-ds-*-luokkia. Vanhat --ink- ja --rp-ink-arvot
   säilyvät vaaleassa, jotta nykyiset näkymät eivät vaihda ilmettä. */

:root {
  color-scheme: light;

  --rp-vari: #2563eb;
  --rp-vari-vahva: #1d4ed8;
  --rp-vari-pehmea: #eff4ff;
  --rp-vari-teksti: #1d4ed8;
  --rp-paalle: #ffffff;

  --rp-n-0: #ffffff;
  --rp-n-25: #fafbfc;
  --rp-n-50: #f5f7fa;
  --rp-n-100: #eceff3;
  --rp-n-200: #dfe3ea;
  --rp-n-300: #c9cfd9;
  --rp-n-400: #9aa3b2;
  --rp-n-500: #5c6575;
  --rp-n-700: #353d4b;
  --rp-n-900: #111827;

  --rp-onnistuminen: #047857;
  --rp-onnistuminen-tausta: #ecfdf5;
  --rp-varoitus: #b45309;
  --rp-varoitus-tausta: #fffbeb;
  --rp-vaara: #b91c1c;
  --rp-vaara-tausta: #fef2f2;

  --rp-pinta: var(--rp-n-0);
  --rp-tausta: var(--rp-n-50);
  --rp-teksti: var(--rp-n-900);
  --rp-himmea: var(--rp-n-500);
  --rp-reuna: var(--rp-n-200);
  --rp-reuna-vahva: #7d8799;
  --rp-kentta: #ffffff;

  --rp-kriittinen: #dc2626;
  --rp-kriittinen-teksti: #ffffff;
  --rp-tanaan: #0d9488;
  --rp-pelivara: #3a4658;

  --rp-ero-alle: #25622a;
  --rp-ero-alle-tausta: #dcefdc;
  --rp-ero-pieni: #8a5a00;
  --rp-ero-pieni-tausta: #fbecc4;
  --rp-ero-yli: #a3311b;
  --rp-ero-yli-tausta: #f8d7cf;

  --rp-fontti: Inter, system-ui, sans-serif;
  --rp-koko-xs: 11px;
  --rp-koko-sm: 12px;
  --rp-koko-md: 13px;
  --rp-koko-base: 14px;
  --rp-koko-lg: 16px;
  --rp-koko-xl: 20px;
  --rp-koko-2xl: 26px;
  --rp-numerot: tabular-nums;

  --rp-tila-1: 4px;
  --rp-tila-2: 8px;
  --rp-tila-3: 12px;
  --rp-tila-4: 16px;
  --rp-tila-5: 24px;
  --rp-tila-6: 32px;
  --rp-tila-7: 48px;

  --rp-sade-sm: 6px;
  --rp-sade: 10px;
  --rp-sade-lg: 12px;
  --rp-sade-iso: 16px;
  --rp-sade-pilleri: 999px;

  --rp-varjo: 0 1px 2px rgba(16, 24, 40, 0.05), 0 1px 3px rgba(16, 24, 40, 0.04);
  --rp-varjo-lg: 0 8px 24px rgba(16, 24, 40, 0.08);
  /* Kojelaudan osat lukevat nämä nimet. Arvot seuraavat tunnuksia, myös tummassa. */
  --rp-pinta-2: var(--rp-n-100);
  --rp-reuna-2: var(--rp-n-300);
  --rp-teksti-2: var(--rp-n-500);
  --rp-teksti-3: var(--rp-n-400);
  --rp-korostus: var(--rp-vari);
  --rp-korostus-2: var(--rp-vari-pehmea);
  --rp-korostus-tausta: var(--rp-vari-pehmea);
  --rp-ok: var(--rp-onnistuminen);
  --rp-ok-tausta: var(--rp-onnistuminen-tausta);
  --rp-virhe: var(--rp-vaara);
  --rp-virhe-tausta: var(--rp-vaara-tausta);
  --rp-sade-pieni: var(--rp-sade-sm);
  --rp-sarja-1: var(--rp-vari);
  --rp-sarja-2: var(--rp-n-400);
  --rp-sarja-3: var(--rp-vari-vahva);
  --rp-sarja-4: var(--rp-n-300);
  --rp-sarja-5: var(--rp-vari-teksti);
  --rp-sarja-6: var(--rp-n-500);
  /* Lisäsarjat (tahtinäkymän työvaiheet): selvästi erottuvat, ei sekoitu kriittiseen tai varoitukseen. */
  --rp-sarja-7: #7c3aed;
  --rp-sarja-8: #be185d;

  /* Aikataulu (Gantt): ainoat janavärit. Ei käyttäjän omia värejä. */
  --rp-gantt-suunnittelu: #64748b;
  --rp-gantt-rakentaminen: var(--rp-vari);
  --rp-gantt-virstan: #b45309;
  --rp-gantt-loma: #5ea89f;
  --rp-gantt-loma-tausta: #e6f4f2;
  --rp-gantt-kriittinen: var(--rp-kriittinen);
  --rp-gantt-yhteenveto: var(--rp-n-500);
  /* Tulosteet: aina vaalea. Yrityksen brändiväri vain tulosteen otsikkoon (--print-accent). */
  --rp-tuloste-teksti: var(--rp-n-25);
  --rp-tuloste-himmea: #5c6575;
  --rp-tuloste-reuna: #c9cfd9;
  --rp-tuloste-korostus: #2563eb;
  --rp-peite: rgba(17, 24, 39, 0.45);
  --rp-vihje: #111827;
  --rp-vihje-teksti: #ffffff;
  --rp-fokus: 0 0 0 3px rgba(37, 99, 235, 0.25);
}

[data-teema="vaalea"] {
  color-scheme: light;
}

@media screen {
[data-teema="tumma"] {
  color-scheme: dark;

  --rp-sarja-7: #a78bfa;
  --rp-sarja-8: #f472b6;

  --rp-gantt-suunnittelu: #94a3b8;
  --rp-gantt-virstan: #fbbf24;
  --rp-gantt-loma: #2d8a80;
  --rp-gantt-loma-tausta: #12302d;
  --rp-reuna-vahva: #7d8799;
  --rp-kriittinen: #f87171;
  --rp-kriittinen-teksti: #0d1117;
  --rp-pelivara: #8d97a8;
  --rp-peite: rgba(0, 0, 0, 0.6);
  --rp-vihje: #2a3240;
  --rp-vihje-teksti: #eef2f7;
  --rp-fokus: 0 0 0 3px rgba(34, 211, 238, 0.3);

  --rp-vari: #22d3ee;
  --rp-vari-vahva: #67e8f9;
  --rp-vari-pehmea: #12343f;
  --rp-vari-teksti: #67e8f9;
  --rp-paalle: #0d1117;

  --rp-n-0: #151a23;
  --rp-n-25: #121720;
  --rp-n-50: #0d1117;
  --rp-n-100: #232a36;
  --rp-n-200: #2a3240;
  --rp-n-300: #3a4352;
  --rp-n-400: #6b7689;
  --rp-n-500: #8d97a8;
  --rp-n-700: #c4ccd8;
  --rp-n-900: #eef2f7;

  --rp-onnistuminen: #34d399;
  --rp-onnistuminen-tausta: #064e3b;
  --rp-varoitus: #fbbf24;
  --rp-varoitus-tausta: #451a03;
  --rp-vaara: #f87171;
  --rp-vaara-tausta: #450a0a;

  --rp-pinta: var(--rp-n-0);
  --rp-tausta: var(--rp-n-50);
  --rp-teksti: var(--rp-n-900);
  --rp-himmea: var(--rp-n-500);
  --rp-reuna: var(--rp-n-200);
  --rp-kentta: #1c2330;

  --rp-tanaan: #29d3a6;

  --rp-ero-alle: #86efac;
  --rp-ero-alle-tausta: #14532d;
  --rp-ero-pieni: #fcd34d;
  --rp-ero-pieni-tausta: #451a03;
  --rp-ero-yli: #fca5a5;
  --rp-ero-yli-tausta: #450a0a;

  --rp-varjo: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.28);
  --rp-varjo-lg: 0 16px 40px rgba(0, 0, 0, 0.45);

}
}

@media screen and (prefers-color-scheme: dark) {
  :root:not([data-teema="vaalea"]) {
    color-scheme: dark;

  --rp-sarja-7: #a78bfa;
  --rp-sarja-8: #f472b6;

  --rp-gantt-suunnittelu: #94a3b8;
  --rp-gantt-virstan: #fbbf24;
  --rp-gantt-loma: #2d8a80;
  --rp-gantt-loma-tausta: #12302d;
  --rp-reuna-vahva: #7d8799;
  --rp-kriittinen: #f87171;
  --rp-kriittinen-teksti: #0d1117;
  --rp-pelivara: #8d97a8;
  --rp-peite: rgba(0, 0, 0, 0.6);
  --rp-vihje: #2a3240;
  --rp-vihje-teksti: #eef2f7;
  --rp-fokus: 0 0 0 3px rgba(34, 211, 238, 0.3);

    --rp-vari: #22d3ee;
    --rp-vari-vahva: #67e8f9;
    --rp-vari-pehmea: #12343f;
    --rp-vari-teksti: #67e8f9;
    --rp-paalle: #0d1117;

    --rp-n-0: #151a23;
    --rp-n-25: #121720;
    --rp-n-50: #0d1117;
    --rp-n-100: #232a36;
    --rp-n-200: #2a3240;
    --rp-n-300: #3a4352;
    --rp-n-400: #6b7689;
    --rp-n-500: #8d97a8;
    --rp-n-700: #c4ccd8;
    --rp-n-900: #eef2f7;

    --rp-onnistuminen: #34d399;
    --rp-onnistuminen-tausta: #064e3b;
    --rp-varoitus: #fbbf24;
    --rp-varoitus-tausta: #451a03;
    --rp-vaara: #f87171;
    --rp-vaara-tausta: #450a0a;

    --rp-pinta: var(--rp-n-0);
    --rp-tausta: var(--rp-n-50);
    --rp-teksti: var(--rp-n-900);
    --rp-himmea: var(--rp-n-500);
    --rp-reuna: var(--rp-n-200);
    --rp-kentta: #1c2330;

    --rp-tanaan: #29d3a6;

    --rp-ero-alle: #86efac;
    --rp-ero-alle-tausta: #14532d;
    --rp-ero-pieni: #fcd34d;
    --rp-ero-pieni-tausta: #451a03;
    --rp-ero-yli: #fca5a5;
    --rp-ero-yli-tausta: #450a0a;

    --rp-varjo: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.28);
    --rp-varjo-lg: 0 16px 40px rgba(0, 0, 0, 0.45);

  }
}



@media screen {
[data-teema="tumma"] .rp-app .module-nav {
  background: var(--rp-pinta);
  border-right: 1px solid var(--rp-reuna);
}

/* Vanhat kovakoodatut vaaleat rivit: tummassa tekstin väri on --rp-teksti, joten
   pohja ei voi jäädä kermanväriseksi. Vaalea teema ei muutu. */
[data-teema="tumma"] .wk.is-today {
  background: var(--rp-varoitus-tausta);
  color: var(--rp-teksti);
}
[data-teema="tumma"] .row.is-summary.is-building .gutter-wrap,
[data-teema="tumma"] .row.is-summary.is-building .gutter {
  background: var(--rp-gantt-loma-tausta);
  color: var(--rp-teksti);
}
[data-teema="tumma"] .row.is-summary.is-group .gutter-wrap,
[data-teema="tumma"] .row.is-summary.is-group .gutter {
  background: var(--rp-n-100);
  color: var(--rp-teksti);
}
[data-teema="tumma"] .row.is-late .task-btn,
[data-teema="tumma"] .row.is-selected .task-btn,
[data-teema="tumma"] .budget-hint,
[data-teema="tumma"] .vac-shift-block {
  background: var(--rp-n-100);
  color: var(--rp-teksti);
}
[data-teema="tumma"] .row.is-critical .task-name {
  color: var(--rp-ero-yli);
}
[data-teema="tumma"] .bar.is-summary-bar.has-progress-fill,
[data-teema="tumma"] .bar.is-site-summary-bar.has-progress-fill {
  background: color-mix(in srgb,var(--rp-tanaan) 35%,transparent);
}
[data-teema="tumma"] .bar.is-summary-bar.has-progress-fill .bar-fill,
[data-teema="tumma"] .bar.is-site-summary-bar.has-progress-fill .bar-fill {
  background: var(--rp-tanaan);
}
[data-teema="tumma"] .task-info,
[data-teema="tumma"] .add-sub-bar,
[data-teema="tumma"] .license-flag,
[data-teema="tumma"] .resource-trade,
[data-teema="tumma"] .day-diary-btn,
[data-teema="tumma"] .summary-add,
[data-teema="tumma"] .gantt-settings-btn.is-on,
[data-teema="tumma"] .sub-add-toggle,
[data-teema="tumma"] .day-cell.is-in {
  background: var(--rp-kentta);
  color: var(--rp-vari-teksti);
}
[data-teema="tumma"] .wk.is-vacation,
[data-teema="tumma"] .wk.is-vacation .wk-num,
[data-teema="tumma"] .day-h.is-vacation,
[data-teema="tumma"] .day-cell.is-vacation {
  color: var(--rp-n-400);
}
[data-teema="tumma"] .phone-week-item.is-late .phone-week-tag {
  color: var(--rp-vaara);
  background: var(--rp-vaara-tausta);
}
[data-teema="tumma"] .phone-week-facts .has-pending {
  color: var(--rp-vaara);
}
[data-teema="tumma"] .task-meta .late { color: var(--rp-ero-yli); }
[data-teema="tumma"] .row.is-late .task-meta,
[data-teema="tumma"] body.gantt-density-kohde #board .row.is-late .task-meta { color: var(--rp-gantt-suunnittelu); }
[data-teema="tumma"] .wk.is-vacation .wk-h { color: var(--rp-vaara); }
[data-teema="tumma"] .rp-trust { background: var(--rp-pinta); color: var(--rp-teksti); }
[data-teema="tumma"] .rp-trust li { color: var(--rp-himmea); }
[data-teema="tumma"] .rp-trust li b { color: var(--rp-teksti); }
[data-teema="tumma"] .rp-trust-i { color: var(--rp-vari-teksti); }
[data-teema="tumma"] .gate-card-go { color: var(--rp-vari-teksti); }
}

@media screen and (prefers-color-scheme: dark) {
  :root:not([data-teema="vaalea"]) .rp-app .module-nav {
    background: var(--rp-pinta);
    border-right: 1px solid var(--rp-reuna);
  }
  :root:not([data-teema="vaalea"]) .wk.is-today {
    background: var(--rp-n-700);
    color: var(--rp-teksti);
  }
  :root:not([data-teema="vaalea"]) .row.is-summary.is-building .gutter-wrap,
  :root:not([data-teema="vaalea"]) .row.is-summary.is-building .gutter {
    background: var(--rp-n-700);
    color: var(--rp-teksti);
  }
  :root:not([data-teema="vaalea"]) .row.is-summary.is-group .gutter-wrap,
  :root:not([data-teema="vaalea"]) .row.is-summary.is-group .gutter {
    background: var(--rp-teksti);
    color: var(--rp-teksti);
  }
  :root:not([data-teema="vaalea"]) .row.is-late .task-btn,
  :root:not([data-teema="vaalea"]) .row.is-selected .task-btn,
  :root:not([data-teema="vaalea"]) .budget-hint,
  :root:not([data-teema="vaalea"]) .vac-shift-block {
    background: var(--rp-n-700);
    color: var(--rp-teksti);
  }
  :root:not([data-teema="vaalea"]) .row.is-critical .task-name {
    color: var(--rp-n-400);
  }
  :root:not([data-teema="vaalea"]) .bar.is-summary-bar.has-progress-fill,
  :root:not([data-teema="vaalea"]) .bar.is-site-summary-bar.has-progress-fill {
    background: color-mix(in srgb,var(--rp-gantt-loma) 35%,transparent);
  }
  :root:not([data-teema="vaalea"]) .bar.is-summary-bar.has-progress-fill .bar-fill,
  :root:not([data-teema="vaalea"]) .bar.is-site-summary-bar.has-progress-fill .bar-fill {
    background: var(--rp-gantt-loma);
  }
  :root:not([data-teema="vaalea"]) .task-info,
  :root:not([data-teema="vaalea"]) .add-sub-bar,
  :root:not([data-teema="vaalea"]) .license-flag,
  :root:not([data-teema="vaalea"]) .resource-trade,
  :root:not([data-teema="vaalea"]) .day-diary-btn,
  :root:not([data-teema="vaalea"]) .summary-add,
  :root:not([data-teema="vaalea"]) .gantt-settings-btn.is-on,
  :root:not([data-teema="vaalea"]) .sub-add-toggle,
  :root:not([data-teema="vaalea"]) .day-cell.is-in {
    background: var(--rp-kentta);
    color: var(--rp-vari-teksti);
  }
  :root:not([data-teema="vaalea"]) .wk.is-vacation,
  :root:not([data-teema="vaalea"]) .wk.is-vacation .wk-num,
  :root:not([data-teema="vaalea"]) .day-h.is-vacation,
  :root:not([data-teema="vaalea"]) .day-cell.is-vacation {
    color: var(--rp-vari-vahva);
  }
  :root:not([data-teema="vaalea"]) .phone-week-item.is-late .phone-week-tag {
    color: var(--rp-vaara);
    background: var(--rp-vaara-tausta);
  }
  :root:not([data-teema="vaalea"]) .phone-week-facts .has-pending {
    color: var(--rp-vaara);
  }
  :root:not([data-teema="vaalea"]) .task-meta .late { color: var(--rp-ero-pieni); }
  :root:not([data-teema="vaalea"]) .row.is-late .task-meta,
  :root:not([data-teema="vaalea"]) body.gantt-density-kohde #board .row.is-late .task-meta { color: var(--rp-n-400); }
  :root:not([data-teema="vaalea"]) .wk.is-vacation .wk-h { color: var(--rp-ero-yli); }
  :root:not([data-teema="vaalea"]) .rp-trust { background: var(--rp-pinta); color: var(--rp-teksti); }
  :root:not([data-teema="vaalea"]) .rp-trust li { color: var(--rp-himmea); }
  :root:not([data-teema="vaalea"]) .rp-trust li b { color: var(--rp-teksti); }
  :root:not([data-teema="vaalea"]) .rp-trust-i { color: var(--rp-vari-teksti); }
  :root:not([data-teema="vaalea"]) .gate-card-go { color: var(--rp-vari-teksti); }
}

.rp-teema-valinta {
  display: inline-flex;
  align-items: center;
  gap: var(--rp-tila-1);
  font-size: 13px;
  font-weight: 600;
  color: inherit;
  white-space: nowrap;
  flex: none;
}

.rp-teema-valinta select {
  font: inherit;
  line-height: 1.2;
  padding: 5px 8px;
  border-radius: var(--rp-sade-sm);
  border: 1px solid var(--rp-reuna);
  background: var(--rp-kentta);
  color: var(--rp-teksti);
}

@media (pointer: coarse) {
  .rp-teema-valinta select { min-height: 44px; }
}

/* Kojelauta: kortit, luvut ja merkit. Värit tulevat tunnuksista. */
.rp-app .rp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.rp-app .rp-ds-kh{display:flex;justify-content:space-between;align-items:center;gap:8px}
.rp-app .rp-ds-board{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,0.8fr);gap:16px}
.rp-app .rp-ds-board .is-main{grid-column:1}
.rp-app .rp-ds-board .is-wide{grid-column:1 / -1}
.rp-app .rp-ds-board .is-side{grid-column:2;grid-row:1}
@media (max-width:1000px){.rp-app .rp-ds-board{grid-template-columns:1fr}.rp-app .rp-ds-board .is-side{grid-column:auto;grid-row:auto}}
.rp-app .rp-ds-crumb{margin:0 0 4px;color:var(--rp-himmea);font-size:var(--rp-koko-sm)}
.rp-app .rp-dash .rp-title{margin:0;font-size:var(--rp-koko-xl);font-weight:700;letter-spacing:-.3px;color:var(--rp-teksti)}
.rp-app .rp-ds-kpi small{color:var(--rp-himmea);font-size:var(--rp-koko-sm);font-weight:500}
.rp-app .rp-ds-kpi b{color:var(--rp-teksti);font-size:var(--rp-koko-2xl);font-weight:700;letter-spacing:-.03em}
.rp-app .rp-ds-kpi b.is-none{color:var(--rp-himmea);font-size:var(--rp-koko-lg);font-weight:600}
.rp-app .rp-ds-num{font-variant-numeric:var(--rp-numerot)}
.rp-app .rp-ds-badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--rp-koko-xs);font-weight:600;padding:2px 6px;border-radius:4px}
.rp-app .rp-ds-badge.is-ok{color:var(--rp-onnistuminen);background:var(--rp-onnistuminen-tausta)}
.rp-app .rp-ds-badge.is-warn{color:var(--rp-varoitus);background:var(--rp-varoitus-tausta)}
.rp-app .rp-ds-badge.is-bad{color:var(--rp-vaara);background:var(--rp-vaara-tausta)}
.rp-app .rp-ds-btn{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:var(--rp-sade-sm);border:1px solid var(--rp-reuna);background:var(--rp-pinta);color:var(--rp-teksti);font-size:var(--rp-koko-md);font-weight:600}
.rp-app .rp-ds-btn.is-primary{background:var(--rp-vari);border-color:var(--rp-vari);color:var(--rp-paalle)}

/* Teemavalinnan esikatselu: kiinteät värit, koska näyte näyttää teeman eikä seuraa aktiivista teemaa. */
.theme-swatch-oletus { background: linear-gradient(90deg, #f5f7fa 50%, #2563eb 50%); }
.theme-swatch-tumma { background: linear-gradient(90deg, #0d1117 50%, #22d3ee 50%); }
