/*!
 * Chicago95 web adaptation, 2026-10-08.
 * Based on Chicago95 by Grassmunk, AdrianoML, and EMH-Mark-I.
 * Upstream: https://github.com/grassmunk/Chicago95
 * Revision: 5da19b8b1e2a886ebf6628403023d5fac3acc3ee
 * SPDX-License-Identifier: GPL-3.0-or-later
 * Source and credits: /themes/chicago95/sources.json and /themes/chicago95/upstream/
 * License: /THIRD_PARTY_LICENSES/Chicago95-GPL-3.0.txt
 */

:root:root {
  --chrome: #c0c0c0;
  --teal: #008080;
  --title-active: #000080;
  --title-inactive: #808080;
  --raised: inset 1px 1px #dfdfdf, inset -1px -1px #808080;
  --sunken: inset 1px 1px #000, inset -1px -1px #dfdfdf;
}

/* Root qualification keeps this theme above the legacy chrome rules, regardless of build order. */
:root .window,
:root .dialog,
:root .start-menu,
:root .context-menu,
:root .explorer__dropdown,
:root .explorer__export-menu,
:root .system-tray__overflow {
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
  border-radius: 0;
  background: var(--chrome);
  box-shadow: var(--raised);
}

:root .window,
:root .dialog { padding: 3px; }

:root .window__titlebar,
:root .dialog__titlebar {
  height: 23px;
  padding: 2px;
  color: #000;
  background: var(--title-inactive);
  font: bold 12px/1 Tahoma, Arial, sans-serif;
}

:root .window--active .window__titlebar,
:root .dialog__titlebar {
  color: #fff;
  background: var(--title-active);
}

:root .window__title { gap: 4px; }
:root .window__controls { gap: 2px; }

:root .window__controls button,
:root .window__controls button:last-child,
:root .dialog__titlebar button {
  width: 18px;
  height: 18px;
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
  color: #000;
  background: var(--chrome);
  box-shadow: var(--raised);
}

:root .window__controls button:last-child { margin-left: 2px; }
:root .window__controls button:active,
:root .dialog__titlebar button:active {
  border-color: #808080 #fff #fff #808080;
  box-shadow: var(--sunken);
}

:root .tool-button,
:root .explorer__address button,
:root .link-button,
:root .link-buttons a,
:root .link-buttons button,
:root .modern-button,
:root .dialog__ok,
:root .nag__cta,
:root .nag__decline,
:root .mail__actions button,
:root .wifi__actions button,
:root .wifi__header button,
:root .terminal__suggestions button,
:root .terminal__prompt button,
:root .bitsy__bubble-actions button,
:root .start-button,
:root .task-button,
:root .tag-chip {
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
  border-radius: 0;
  color: #000;
  background: var(--chrome);
  box-shadow: var(--raised);
  font-family: Tahoma, Arial, sans-serif;
  letter-spacing: 0;
}

:root .tool-button:active:not(:disabled),
:root .explorer__address button:active,
:root .link-button:active,
:root .link-buttons a:active,
:root .link-buttons button:active,
:root .modern-button:active,
:root .dialog__ok:active,
:root .nag__cta:active,
:root .nag__decline:active,
:root .mail__actions button:active,
:root .wifi__actions button:active,
:root .wifi__header button:active,
:root .terminal__suggestions button:active,
:root .terminal__prompt button:active,
:root .bitsy__bubble-actions button:active,
:root .start-button:active,
:root .start-button--active,
:root .task-button--active,
:root .tag-chip--on {
  border-color: #808080 #fff #fff #808080;
  background: var(--chrome);
  box-shadow: var(--sunken);
}

:root .task-button--active {
  background: repeating-conic-gradient(#dfdfdf 0% 25%, #fff 0% 50%) 0 0 / 2px 2px;
  font-weight: 700;
}

:root .tool-button:disabled {
  color: #808080;
  background: var(--chrome);
  text-shadow: 1px 1px #fff;
}

:root .explorer__menubar { padding: 1px 3px; }
:root .explorer__toolbar {
  padding: 4px 3px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #808080;
  background: var(--chrome);
}

:root .explorer__address input,
:root .folder-sort select {
  border: 1px solid;
  border-color: #808080 #fff #fff #808080;
  border-radius: 0;
  color: #000;
  background: #fff;
  box-shadow: var(--sunken);
}

:root .explorer__status,
:root .system-tray {
  border: 1px solid;
  border-color: #808080 #fff #fff #808080;
  background: var(--chrome);
  box-shadow: none;
}

:root .taskbar {
  border-top: 1px solid #fff;
  background: var(--chrome);
  box-shadow: inset 0 1px #dfdfdf;
}

:root .start-menu__hello { background: #808080; }
:root .start-menu { width: min(260px, calc(100vw - 8px)); }
:root .start-menu__hello { padding: 6px 8px; }
:root .start-menu__hello strong { font-size: 13px; }
:root .start-menu .menu-slot > button {
  min-height: 32px;
  padding: 5px 8px;
}
:root .start-menu .menu-label { font-weight: 400; }
:root .start-menu .menu-label small { display: none; }
:root .menu-divider {
  height: 2px;
  border-bottom: 1px solid #fff;
  background: #808080;
}

:root .desktop-icon { gap: 3px; }
:root .desktop-icon span {
  color: #fff;
  background: #006060;
  font-family: Tahoma, Arial, sans-serif;
  line-height: 1.2;
}
:root .desktop-icon[data-selected="true"] span,
:root .desktop-icon:focus-visible span { background: var(--title-active); }

:root .desktop ::-webkit-scrollbar { width: 16px; height: 16px; }
:root .desktop ::-webkit-scrollbar-track {
  background: repeating-conic-gradient(#c0c0c0 0% 25%, #fff 0% 50%) 0 0 / 2px 2px;
}
:root .desktop ::-webkit-scrollbar-thumb {
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
  background: var(--chrome);
  box-shadow: var(--raised);
}
:root .desktop ::-webkit-scrollbar-corner { background: var(--chrome); }

/* Desktop panel and tray use the same compact relief as the upstream XFCE panel. */
:root .taskbar { padding: 4px 5px; gap: 5px; font: 11px/1 Tahoma, Arial, sans-serif; }
:root .start-button, :root .task-button { height: 30px; padding: 3px 6px; gap: 4px; font-size: 11px; }
:root .start-button { font-size: 12px; font-weight: 700; }
:root .start-button--active, :root .start-button:active, :root .task-button--active { padding: 4px 5px 2px 7px; }
:root .taskbar__divider { width: 5px; height: 28px; border: 0; background: repeating-linear-gradient(to right, #fff 0 1px, #808080 1px 2px, transparent 2px 3px); }
:root .taskbar__apps { gap: 3px; }
:root .task-button { width: min(160px, 25vw); }
:root .system-tray { height: 30px; min-width: 0; padding: 2px 4px; gap: 1px; font: 11px/1 Tahoma, Arial, sans-serif; }
:root .system-tray__button:hover, :root .system-tray__clock:hover,
:root .system-tray__button:focus-visible, :root .system-tray__clock:focus-visible { border-color: #fff #808080 #808080 #fff; background: var(--chrome); }
:root .system-tray__button:active, :root .system-tray__button--active { border-color: #808080 #fff #fff #808080; background: var(--chrome); }
:root .system-tray__alert, :root .system-tray__badge { border-radius: 0; background: #800000; }
:root .start-menu .menu-slot > button { padding: 4px 8px; gap: 8px; }
:root .start-menu__hello { color: #fff; background: var(--title-active); }
:root .start-menu__hello .pixel-kicker { color: #fff; }
:root .about-view__credits { margin-top: 28px; font-size: 12px; line-height: 1.6; }
:root .about-view__credits h3 { margin: 0 0 6px; font-size: 14px; }
:root .about-view__credits ul { margin: 0 0 8px; padding-left: 18px; }

@media (max-width: 720px) {
  :root .start-menu .menu-slot > button { min-height: 44px; }
  :root .task-button { width: 38px; }
  :root .taskbar__divider { width: 2px; }
  :root .window__titlebar { height: 32px; }
  :root .window__controls button,
  :root .dialog__titlebar button { width: 27px; height: 25px; }
}

@media (prefers-contrast: more) {
  :root .window,
  :root .dialog,
  :root .start-menu,
  :root .context-menu { border-width: 4px; }
  :root .window__titlebar { color: #000; background: #fff; }
  :root .window--active .window__titlebar,
  :root .dialog__titlebar { color: #fff; background: #000; }
  :root .tag-chip { border-width: 3px; }
  :root .tag-chip--on { color: #fff; background: #000; }
}

@media (forced-colors: active) {
  :root .window__titlebar,
  :root .window--active .window__titlebar,
  :root .dialog__titlebar { color: HighlightText; background: Highlight; }
  :root .desktop-icon span { color: CanvasText; background: Canvas; }
  :root .desktop-icon[data-selected="true"] span,
  :root .desktop-icon:focus-visible span { color: HighlightText; background: Highlight; }
}

:root .dialog--world { width: min(460px, 100%); max-height: calc(100dvh - 32px); overflow: auto; }
:root .dialog__world { padding: 12px; }
:root .dialog__world-date { margin: 10px 0 0; text-align: center; font-size: 11px; }
:root .pixel-globe canvas { display: block; width: min(288px, 100%); aspect-ratio: 1; margin: 0 auto 10px; image-rendering: pixelated; touch-action: none; cursor: crosshair; border: 2px inset #fff; }
:root .pixel-globe canvas:focus-visible { outline: 2px dotted #000; outline-offset: 2px; }
:root .pixel-globe__controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
:root .pixel-globe__controls button { min-height: 32px; padding: 3px 8px; color: #000; background: var(--chrome); border: 1px solid; border-color: #fff #000 #000 #fff; box-shadow: var(--raised); font: 12px Tahoma, Arial, sans-serif; }
:root .pixel-globe__controls button:active { box-shadow: var(--sunken); }
:root .pixel-globe__location { margin-top: 10px; padding: 6px; border: 1px solid; border-color: #808080 #fff #fff #808080; font: 12px/1.6 Tahoma, Arial, sans-serif; text-align: center; }

/* Keep upstream icons at native sizes inside the existing controls. */
:root .hobby-sheet__icon {
  background: transparent;
  border: 0;
}
:root .hobby-sheet__icon svg { width: 16px; height: 16px; }
:root .dialog__glyph {
  width: 32px;
  height: 32px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  clip-path: none;
}
:root .explorer__menubar > button:last-child { display: flex; align-items: center; gap: 3px; }
:root .tool-button svg { flex-shrink: 0; }

:root .explorer__address label { display: flex; align-items: center; gap: 3px; }
:root .explorer__export-menu button { grid-template-columns: 16px 1fr; column-gap: 8px; }
:root .explorer__export-menu button > svg { grid-row: 1 / 3; align-self: center; }
:root .explorer__export-menu button > strong,
:root .explorer__export-menu button > small { grid-column: 2; }