/* ================================================================
   Schergen Corp – KDE-Plasma-Ansicht (Breeze) für alle Werkzeuge
   Haut über der 98er-Ansicht: greift nur bei
   <html data-theme="win98" data-skin="kde">. Helle Breeze-Fenster mit
   zentriertem Titel, dunkle Plasma-Leiste, Akzent #3daee9.
   ================================================================ */

:root[data-theme="win98"][data-skin="kde"] {
  --bg:            #1b2b3a;
  --bg-2:          #eff0f1;
  --surface-2:     #f7f7f7;
  --line:          #bdc3c7;
  --line-soft:     #dcdfe2;
  --accent:        #2980b9;
  --accent-strong: #2980b9;

  --w-face:    #eff0f1;
  --w-light:   #f7f7f7;
  --w-hi:      #fcfcfc;
  --w-shadow:  #bdc3c7;
  --w-dark:    #7f8c8d;
  --w-title:   #dee0e2;
  --w-desktop: #1b2b3a;
  --w-ui:      "Noto Sans", "Oxygen", "Ubuntu", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --w-select:  #3daee9;

  --w-raised:  inset 0 0 0 1px #bdc3c7;
  --w-pressed: inset 0 0 0 1px #3daee9;
  --w-sunken:  inset 0 0 0 1px #bdc3c7;
  --w-field:   inset 0 0 0 1px #d1d5d9;
}

/* Plasma: dunkles Schiefer, schräge Flächen in Breeze-Blau */
:root[data-theme="win98"][data-skin="kde"] body {
  background:
    linear-gradient(115deg, transparent 0 52%, rgba(61, 174, 233, .20) 52% 68%, transparent 68%),
    linear-gradient(65deg, rgba(29, 153, 243, .22) 0 28%, transparent 28%),
    linear-gradient(155deg, transparent 0 60%, rgba(255, 255, 255, .05) 60% 78%, transparent 78%),
    linear-gradient(25deg, transparent 0 74%, rgba(61, 174, 233, .14) 74%),
    linear-gradient(180deg, #1b2b3a 0%, #22303d 50%, #31363b 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  font-size: 13px;
}

:root[data-theme="win98"][data-skin="kde"] a         { color: #2980b9; }
:root[data-theme="win98"][data-skin="kde"] a:visited { color: #7f4fb6; }

/* ----------------------------------------------------------------
   Fenster
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="kde"] [data-win] {
  padding-top: 38px !important;
  border-radius: 6px 6px 3px 3px;
  background: var(--w-face);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .22), 0 14px 34px rgba(0, 0, 0, .45);
}
:root[data-theme="win98"][data-skin="kde"] [data-win]::before {
  top: 0;
  left: 0;
  right: 0;
  height: 30px;
  padding: 0 96px;
  border-radius: 6px 6px 0 0;
  background: var(--w-title);
  box-shadow: inset 0 -1px rgba(0, 0, 0, .1);
  color: #232627;
  font: 400 13px/30px var(--w-ui);
  text-align: center;
}
/* Minimieren ˅, Maximieren ˄, Schließen ⊗ */
:root[data-theme="win98"][data-skin="kde"] [data-win]::after {
  top: 5px;
  right: 8px;
  width: 72px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='20'%3E%3Cpath d='M4 7.5l6 6 6-6' fill='none' stroke='%23232627' stroke-width='1.6'/%3E%3Cpath d='M28 12.5l6-6 6 6' fill='none' stroke='%23232627' stroke-width='1.6'/%3E%3Ccircle cx='62' cy='10' r='8.5' fill='none' stroke='%23232627' stroke-width='1.2'/%3E%3Cpath d='M58.5 6.5l7 7M65.5 6.5l-7 7' stroke='%23232627' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat;
}

/* ----------------------------------------------------------------
   Plasma-Leiste
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="kde"] .topbar {
  min-height: 40px;
  padding: 0 0 0 4px;
  align-items: center;
  background: rgba(35, 38, 41, .94);
  box-shadow: 0 1px 0 rgba(0, 0, 0, .5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  color: #fcfcfc;
}
:root[data-theme="win98"][data-skin="kde"] .topbar__right { align-self: stretch; align-items: center; gap: 4px; }
:root[data-theme="win98"][data-skin="kde"] .topbar__note,
:root[data-theme="win98"][data-skin="kde"] .topbar__user { color: #fcfcfc; }

:root[data-theme="win98"][data-skin="kde"] .sc-home {
  padding: 6px 12px;
  border-radius: 4px;
  background: transparent;
  box-shadow: none;
  color: #fcfcfc;
  font: 600 14px var(--w-ui);
}
:root[data-theme="win98"][data-skin="kde"] .sc-home:hover {
  background: rgba(61, 174, 233, .25);
  box-shadow: inset 0 0 0 1px #3daee9;
}

/* Das Werkzeug: aktive Aufgabe mit blauer Linie */
:root[data-theme="win98"][data-skin="kde"] .topbar__brand,
:root[data-theme="win98"][data-skin="kde"] .brand {
  align-self: stretch;
  margin-left: 4px;
  padding: 0 12px;
  background: rgba(61, 174, 233, .12);
  box-shadow: inset 0 -2px #3daee9;
  color: #fcfcfc;
  font: 13px var(--w-ui);
}

:root[data-theme="win98"][data-skin="kde"] .topbar .btn {
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
  color: #fcfcfc;
  box-shadow: none;
}
:root[data-theme="win98"][data-skin="kde"] .topbar .btn:hover {
  border-color: #3daee9;
  background: rgba(61, 174, 233, .22);
  box-shadow: none;
}

:root[data-theme="win98"][data-skin="kde"] .sc-tray {
  align-self: stretch;
  height: auto;
  padding: 0 14px;
  box-shadow: none;
  color: #fcfcfc;
  font: 13px var(--w-ui);
}

/* ----------------------------------------------------------------
   Knöpfe, Reiter, Felder
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="kde"] .btn {
  min-height: 26px;
  padding: 3px 14px;
  border: 1px solid #b4b6b8;
  border-radius: 3px;
  background: linear-gradient(180deg, #fcfcfc, #f2f3f4);
  color: #232627;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .06);
  font: 13px var(--w-ui);
}
:root[data-theme="win98"][data-skin="kde"] .btn:hover {
  border: 1px solid #3daee9;
  background: linear-gradient(180deg, #fcfcfc, #f2f3f4);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .06);
}
:root[data-theme="win98"][data-skin="kde"] .btn:active {
  border-color: #3daee9;
  background: #3daee9;
  color: #fff;
  box-shadow: none;
}
:root[data-theme="win98"][data-skin="kde"] .btn--primary,
:root[data-theme="win98"][data-skin="kde"] .btn:focus-visible {
  border-color: #3daee9;
  box-shadow: inset 0 0 0 1px #3daee9;
  outline: none;
}
:root[data-theme="win98"][data-skin="kde"] .btn:disabled {
  border-color: #d1d5d9;
  background: #f2f3f4;
  color: #a1a9b1;
  text-shadow: none;
  box-shadow: none;
}

:root[data-theme="win98"][data-skin="kde"] .tab,
:root[data-theme="win98"][data-skin="kde"] .groupbar__item {
  margin-right: 1px;
  border: 1px solid #bdc3c7;
  border-bottom: 0;
  border-radius: 3px 3px 0 0;
  background: #e3e5e7;
  box-shadow: none;
}
:root[data-theme="win98"][data-skin="kde"] .tab.is-active,
:root[data-theme="win98"][data-skin="kde"] .groupbar__item.is-active {
  background: #eff0f1;
  box-shadow: inset 0 2px #3daee9;
}

:root[data-theme="win98"][data-skin="kde"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
:root[data-theme="win98"][data-skin="kde"] select,
:root[data-theme="win98"][data-skin="kde"] textarea {
  border: 1px solid #b4b6b8;
  border-radius: 3px;
  background-color: #fcfcfc;
  box-shadow: none;
}
:root[data-theme="win98"][data-skin="kde"] input:focus,
:root[data-theme="win98"][data-skin="kde"] select:focus,
:root[data-theme="win98"][data-skin="kde"] textarea:focus {
  border: 1px solid #3daee9;
  box-shadow: 0 0 0 1px rgba(61, 174, 233, .4);
}

/* ----------------------------------------------------------------
   Statusleiste, Hinweis, Menü, Texte auf dem Desktop
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="kde"] .foot {
  border: 0;
  border-radius: 4px;
  background: #eff0f1;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .22), 0 8px 22px rgba(0, 0, 0, .35);
  color: #232627;
}

:root[data-theme="win98"][data-skin="kde"] .toast {
  border: 1px solid #bdc3c7;
  border-radius: 4px;
  background: #eff0f1;
  color: #232627;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
  font: 13px var(--w-ui);
}

:root[data-theme="win98"][data-skin="kde"] .shell > h1,
:root[data-theme="win98"][data-skin="kde"] .shell > p,
:root[data-theme="win98"][data-skin="kde"] .hero__meta { text-shadow: 0 1px 3px rgba(0, 0, 0, .7); }
:root[data-theme="win98"][data-skin="kde"] .hero .hero__meta { text-shadow: none; }

:root[data-theme="win98"][data-skin="kde"] .hero__title,
:root[data-theme="win98"][data-skin="kde"] .hero__title * {
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: #232627;
  text-shadow: none;
  filter: none;
  font: 300 clamp(2rem, 6vw, 3.2rem) var(--w-ui);
  letter-spacing: -.01em;
}
:root[data-theme="win98"][data-skin="kde"] .hero__title .brand__accent { color: #3daee9; }

:root[data-theme="win98"][data-skin="kde"] .tile:hover { box-shadow: 0 0 0 1px #3daee9, 0 14px 34px rgba(0, 0, 0, .45); }
:root[data-theme="win98"][data-skin="kde"] .tile:hover::before { background: #d3e9f6; }
:root[data-theme="win98"][data-skin="kde"] .tile--planned { opacity: .7; }
:root[data-theme="win98"][data-skin="kde"] .tile--planned::before { background: var(--w-title); }

:root[data-theme="win98"][data-skin="kde"] .table th,
:root[data-theme="win98"][data-skin="kde"] .table__row--head,
:root[data-theme="win98"][data-skin="kde"] .table__row--head:nth-child(odd),
:root[data-theme="win98"][data-skin="kde"] .pruef--kopf {
  background: #eff0f1;
  box-shadow: inset -1px 0 #d1d5d9, inset 0 -1px #bdc3c7;
}

/* Ansichtswahl: flach in der Plasma-Leiste */
:root[data-theme="win98"][data-skin="kde"] .sc-theme-select {
  height: 28px;
  padding: 2px 26px 2px 10px;
  border: 1px solid rgba(252, 252, 252, .2);
  border-radius: 3px;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23fcfcfc' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 9px center / 10px 6px;
  box-shadow: none;
  color: #fcfcfc;
  font: 13px var(--w-ui);
}
:root[data-theme="win98"][data-skin="kde"] .sc-theme-select:hover { border-color: #3daee9; background-color: rgba(61, 174, 233, .22); }