/* ================================================================
   Schergen Corp – Windows-7-Ansicht (Aero) für alle Werkzeuge
   Haut über der 98er-Ansicht: greift nur bei
   <html data-theme="win98" data-skin="win7">. Fenster aus Milchglas,
   dunkle Glas-Taskleiste mit Start-Kugel, Harmony-Desktop.
   ================================================================ */

:root[data-theme="win98"][data-skin="win7"] {
  --bg:            #0d5aa7;
  --bg-2:          #f0f0f0;
  --surface-2:     #f7f7f7;
  --line:          #c4c4c4;
  --line-soft:     #e0e0e0;
  --accent:        #0066cc;
  --accent-strong: #0066cc;

  --w-face:    #f0f0f0;
  --w-light:   #f7f7f7;
  --w-hi:      #ffffff;
  --w-shadow:  #a0a0a0;
  --w-dark:    #6d6d6d;
  --w-title:   linear-gradient(180deg, rgba(255, 255, 255, .45), rgba(255, 255, 255, .08) 55%, rgba(255, 255, 255, 0));
  --w-desktop: #0d5aa7;
  --w-ui:      "Segoe UI", "Segoe UI Web", Tahoma, "Noto Sans", Arial, sans-serif;
  --w-select:  #3399ff;
  --w-glass:   rgba(165, 198, 236, .62);

  --w-raised:  inset 0 0 0 1px #c4c4c4;
  --w-pressed: inset 0 0 0 1px #6d6d6d, inset 1px 1px 3px rgba(0, 0, 0, .2);
  --w-sunken:  inset 0 0 0 1px #abadb3;
  --w-field:   inset 0 0 0 1px #d5d5d5;
}

/* Harmony: blaues Leuchten, angedeutete Fahne in der Mitte */
:root[data-theme="win98"][data-skin="win7"] body {
  background:
    radial-gradient(ellipse 55% 40% at 50% 52%, rgba(255, 255, 255, .45), transparent 70%),
    radial-gradient(ellipse 9% 12% at 47% 46%, rgba(255, 120, 40, .75), transparent 70%),
    radial-gradient(ellipse 9% 12% at 53% 45%, rgba(130, 205, 60, .7), transparent 70%),
    radial-gradient(ellipse 9% 12% at 47% 58%, rgba(40, 150, 245, .75), transparent 70%),
    radial-gradient(ellipse 9% 12% at 53% 57%, rgba(255, 210, 40, .7), transparent 70%),
    linear-gradient(160deg, transparent 0 22%, rgba(255, 255, 255, .10) 22% 30%, transparent 30% 58%, rgba(255, 255, 255, .07) 58% 63%, transparent 63%),
    radial-gradient(ellipse at 50% 50%, #2b92dc 0%, #0d5aa7 48%, #062f66 100%);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
  font-size: 13px;
}

:root[data-theme="win98"][data-skin="win7"] a         { color: #0066cc; }
:root[data-theme="win98"][data-skin="win7"] a:visited { color: #6633aa; }

/* ----------------------------------------------------------------
   Fenster: Glasrahmen, der den Desktop durchscheinen lässt
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="win7"] [data-win] {
  padding-top: 38px !important;
  border: 7px solid var(--w-glass);
  border-top: 0;
  border-radius: 8px 8px 4px 4px;
  background:
    linear-gradient(180deg, rgba(185, 212, 242, .68) 0, rgba(150, 186, 228, .62) 30px, #f0f0f0 30px) padding-box;
  box-shadow: 0 0 0 1px rgba(15, 30, 55, .65), 0 0 0 2px rgba(255, 255, 255, .25), 0 12px 32px rgba(0, 0, 0, .5);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
:root[data-theme="win98"][data-skin="win7"] [data-win]::before {
  top: 0;
  left: 0;
  right: 0;
  height: 30px;
  padding: 0 110px 0 4px;
  border-radius: 7px 7px 0 0;
  background: var(--w-title);
  color: #000;
  font: 400 13px/30px var(--w-ui);
  text-shadow: 0 0 8px #fff, 0 0 12px #fff, 0 0 16px #fff;
}
:root[data-theme="win98"][data-skin="win7"] [data-win]::after {
  top: 0;
  right: 2px;
  width: 96px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='20'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23eef4fc'/%3E%3Cstop offset='.45' stop-color='%23d5e2f3'/%3E%3Cstop offset='.5' stop-color='%23b9cbe6'/%3E%3Cstop offset='1' stop-color='%23cfe0f5'/%3E%3C/linearGradient%3E%3ClinearGradient id='r' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23eba595'/%3E%3Cstop offset='.45' stop-color='%23d9705a'/%3E%3Cstop offset='.5' stop-color='%23c4402a'/%3E%3Cstop offset='1' stop-color='%23d9603f'/%3E%3C/linearGradient%3E%3CclipPath id='c'%3E%3Crect x='.5' y='-5' width='95' height='24.5' rx='4'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23c)'%3E%3Crect x='0' y='-5' width='26' height='25' fill='url(%23g)'/%3E%3Crect x='26' y='-5' width='25' height='25' fill='url(%23g)'/%3E%3Crect x='51' y='-5' width='45' height='25' fill='url(%23r)'/%3E%3Cpath d='M26 0v20M51 0v20' stroke='%235a6b85' stroke-opacity='.7'/%3E%3C/g%3E%3Crect x='.5' y='-5' width='95' height='24.5' rx='4' fill='none' stroke='%232b3a52' stroke-opacity='.8'/%3E%3Crect x='8.5' y='11.5' width='9' height='3' fill='%23fff' stroke='%233c4a60'/%3E%3Crect x='33.5' y='4.5' width='10' height='9' fill='none' stroke='%233c4a60' stroke-width='3'/%3E%3Crect x='33.5' y='4.5' width='10' height='9' fill='none' stroke='%23fff' stroke-width='1.2'/%3E%3Cpath d='M68.5 5.5l9 9M77.5 5.5l-9 9' stroke='%233a1208' stroke-width='3.6' stroke-linecap='round'/%3E%3Cpath d='M68.5 5.5l9 9M77.5 5.5l-9 9' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
}

/* ----------------------------------------------------------------
   Taskleiste: dunkles Glas, Start-Kugel
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="win7"] .topbar {
  min-height: 40px;
  padding: 0 0 0 6px;
  align-items: center;
  background: linear-gradient(180deg, rgba(40, 62, 95, .82), rgba(12, 26, 48, .9));
  box-shadow: inset 0 1px rgba(255, 255, 255, .28), 0 1px 0 rgba(0, 0, 0, .6);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  color: #fff;
}
:root[data-theme="win98"][data-skin="win7"] .topbar__right { align-self: stretch; align-items: center; gap: 4px; }
:root[data-theme="win98"][data-skin="win7"] .topbar__note,
:root[data-theme="win98"][data-skin="win7"] .topbar__user { color: #fff; }

:root[data-theme="win98"][data-skin="win7"] .sc-home {
  padding: 5px 16px;
  border: 1px solid rgba(0, 0, 0, .65);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .08) 50%, transparent 51%),
    radial-gradient(ellipse at 50% 100%, #7fd0ff 0%, #2a8be0 40%, #0a4ea3 75%, #06306b 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25), 0 0 10px rgba(80, 170, 255, .55);
  color: #fff;
  font: 600 13px var(--w-ui);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .7);
}
:root[data-theme="win98"][data-skin="win7"] .sc-home:hover { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .4), 0 0 16px rgba(120, 200, 255, .9); }

/* Das Werkzeug: hervorgehobenes Programm in der Glasleiste */
:root[data-theme="win98"][data-skin="win7"] .topbar__brand,
:root[data-theme="win98"][data-skin="win7"] .brand {
  margin-left: 10px;
  padding: 4px 14px 4px 10px;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 3px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .08));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .35), 0 0 8px rgba(120, 190, 255, .35);
  color: #fff;
  font: 12px var(--w-ui);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .7);
}

:root[data-theme="win98"][data-skin="win7"] .topbar .btn {
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 3px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .04));
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .3);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}
:root[data-theme="win98"][data-skin="win7"] .topbar .btn:hover {
  border-color: rgba(255, 255, 255, .45);
  background: linear-gradient(180deg, rgba(160, 210, 255, .45), rgba(80, 150, 230, .2));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .3), 0 0 8px rgba(120, 190, 255, .6);
}

:root[data-theme="win98"][data-skin="win7"] .sc-tray {
  align-self: stretch;
  height: auto;
  margin-left: 4px;
  padding: 0 14px;
  border-left: 1px solid rgba(0, 0, 0, .45);
  box-shadow: inset 1px 0 rgba(255, 255, 255, .15);
  color: #fff;
  font: 12px var(--w-ui);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}

/* ----------------------------------------------------------------
   Knöpfe, Reiter, Felder
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="win7"] .btn {
  min-height: 24px;
  padding: 3px 14px;
  border: 1px solid #707070;
  border-radius: 3px;
  background: linear-gradient(180deg, #f2f2f2 0%, #ebebeb 45%, #dddddd 50%, #cfcfcf 100%);
  color: #000;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7);
  font: 12px var(--w-ui);
}
:root[data-theme="win98"][data-skin="win7"] .btn:hover {
  border: 1px solid #3c7fb1;
  background: linear-gradient(180deg, #eaf6fd 0%, #d9f0fc 45%, #bee6fd 50%, #a7d9f5 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7);
}
:root[data-theme="win98"][data-skin="win7"] .btn:active {
  border-color: #2c628b;
  background: linear-gradient(180deg, #e5f4fc 0%, #c4e5f6 45%, #98d1ef 50%, #68b3db 100%);
  box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .25);
}
:root[data-theme="win98"][data-skin="win7"] .btn--primary,
:root[data-theme="win98"][data-skin="win7"] .btn:focus-visible {
  border-color: #3399ff;
  box-shadow: inset 0 0 0 1px #8fd0ff;
  outline: none;
}
:root[data-theme="win98"][data-skin="win7"] .btn:disabled {
  border-color: #adb2b5;
  background: #f4f4f4;
  color: #838383;
  text-shadow: none;
  box-shadow: none;
}

:root[data-theme="win98"][data-skin="win7"] .tab,
:root[data-theme="win98"][data-skin="win7"] .groupbar__item {
  margin-right: 1px;
  border: 1px solid #898c95;
  border-bottom: 0;
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, #f2f2f2, #e3e3e3);
  box-shadow: none;
}
:root[data-theme="win98"][data-skin="win7"] .tab.is-active,
:root[data-theme="win98"][data-skin="win7"] .groupbar__item.is-active { background: #fff; }

:root[data-theme="win98"][data-skin="win7"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
:root[data-theme="win98"][data-skin="win7"] select,
:root[data-theme="win98"][data-skin="win7"] textarea {
  border: 1px solid #abadb3;
  border-top-color: #8e8f8f;
  border-radius: 2px;
  box-shadow: none;
}
:root[data-theme="win98"][data-skin="win7"] input:hover,
:root[data-theme="win98"][data-skin="win7"] textarea:hover { border-color: #7eb4ea; }
:root[data-theme="win98"][data-skin="win7"] input:focus,
:root[data-theme="win98"][data-skin="win7"] select:focus,
:root[data-theme="win98"][data-skin="win7"] textarea:focus { border: 1px solid #3d7bad; box-shadow: none; }

/* ----------------------------------------------------------------
   Statusleiste, Tooltip, Menü, Texte auf dem Desktop
   ---------------------------------------------------------------- */
:root[data-theme="win98"][data-skin="win7"] .foot {
  border-top: 1px solid #a0afc3;
  border-radius: 4px;
  background: linear-gradient(180deg, #f1f5fb, #d9e3f0);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
  color: #1e395b;
}

:root[data-theme="win98"][data-skin="win7"] .toast {
  border: 1px solid #767676;
  border-radius: 3px;
  background: linear-gradient(180deg, #ffffff, #e4e5f0);
  box-shadow: 2px 3px 6px rgba(0, 0, 0, .3);
  font: 12px var(--w-ui);
}

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

/* Statt WordArt: dünne Segoe in Aero-Blau */
:root[data-theme="win98"][data-skin="win7"] .hero__title,
:root[data-theme="win98"][data-skin="win7"] .hero__title * {
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  color: #1e395b;
  text-shadow: none;
  filter: none;
  font: 300 clamp(2rem, 6vw, 3.2rem) var(--w-ui);
  letter-spacing: -.01em;
}
:root[data-theme="win98"][data-skin="win7"] .hero__title .brand__accent { color: #2a7fd4; }

:root[data-theme="win98"][data-skin="win7"] .tile:hover { box-shadow: 0 0 0 1px rgba(15, 30, 55, .65), 0 0 18px rgba(120, 190, 255, .8), 0 12px 32px rgba(0, 0, 0, .5); }
:root[data-theme="win98"][data-skin="win7"] .tile:hover::before { background: linear-gradient(180deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, .15)); }
:root[data-theme="win98"][data-skin="win7"] .tile--planned { opacity: .7; }
:root[data-theme="win98"][data-skin="win7"] .tile--planned::before { background: var(--w-title); }

:root[data-theme="win98"][data-skin="win7"] .table th,
:root[data-theme="win98"][data-skin="win7"] .table__row--head,
:root[data-theme="win98"][data-skin="win7"] .table__row--head:nth-child(odd),
:root[data-theme="win98"][data-skin="win7"] .pruef--kopf {
  background: linear-gradient(180deg, #ffffff, #f1f2f4);
  box-shadow: inset -1px 0 #e3e8ee, inset 0 -1px #d5d5d5;
}

/* Ansichtswahl: Glas in der Taskleiste */
:root[data-theme="win98"][data-skin="win7"] .sc-theme-select {
  height: 26px;
  padding: 2px 24px 2px 8px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 3px;
  background: rgba(255, 255, 255, .1) 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='%23ffffff' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 8px center / 10px 6px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .3);
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}
:root[data-theme="win98"][data-skin="win7"] .sc-theme-select:hover { background-color: rgba(160, 210, 255, .3); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .3), 0 0 8px rgba(120, 190, 255, .6); }