/*!theme
id: olive
name: Olive
mode: dark
accent: #c4b550
accentLight: #000080
barsLight: #c0c0c0, 1.0, #c0c0c0
barsDark: #4d5844, 1.0, #2f362a
description: Steam 2003 — оливковые окна с выпуклыми фасками, вдавленные поля, Tahoma, жёлтые подписи, блочный прогресс; светлый — Windows 95/98: серая плашка с двойной фаской, белые поля, заголовок окна градиентом из акцента
*/

/* Dark Olive is the default look of the site — every token already lives in tokens.css.
   Only two things are added here: a viewer-chosen accent, and the light (Windows 98) mode. */

/* Custom accent picked in the theme switcher */
:root[data-skin="olive"][data-accent] {
  --c-accent: var(--tint);
  --c-select: var(--tint-press);
  --c-chart-seq: var(--tint);
}

/* ======================================================================
   Olive, light — Windows 95/98: grey #c0c0c0 with a double bevel (white and light grey
   top-left, black and grey bottom-right), white sunken fields, window title as a gradient
   of the accent (navy by default).
   ====================================================================== */
:root[data-skin="olive"]:not(.theme--dark) {
  color-scheme: light;
  --font: Tahoma, "MS Sans Serif", "Segoe UI", Arial, sans-serif;
  --w98-title: linear-gradient(90deg, color-mix(in srgb, var(--tint) 60%, #000000), color-mix(in srgb, var(--tint) 80%, #ffffff));

  --c-bg: #c0c0c0;
  --c-bg-sunken: #ffffff;
  --c-bg-deep: #ffffff;
  --c-bg-darker: #c0c0c0;
  --c-bg-hover: #c0c0c0;
  --c-bg-row: #00000008;
  --c-light: #ffffff;
  --c-dark: #808080;
  --c-shade: rgba(0, 0, 0, 0.35);
  --c-text: #000000;
  --c-text-dim: #303030;
  --c-text-faint: #5a5a5a;
  --c-accent: var(--tint);
  --c-select: var(--tint);
  --c-select-text: #ffffff;
  --c-ok: #007a00;
  --c-warn: #806000;
  --c-error: #c00000;
  --c-info: var(--tint);
  --c-series-1: #2a78d6;
  --c-series-2: #eb6834;
  --c-series-3: #1baf7a;
  --c-series-4: #eda100;
  --c-series-5: #e87ba4;
  --c-series-6: #008300;
  --c-chart-grid: #c8c8c8;
  --c-chart-seq: var(--tint);

  --bevel-raised: #ffffff #000000 #000000 #ffffff;
  --bevel-sunken: #808080 #ffffff #ffffff #808080;
  --img-filter: none;
  --logo-filter: none;
  --focus-ring: 1px dotted #000000;

  --sh-window: inset -1px -1px #808080, inset 1px 1px #dfdfdf;
  --c-title: #ffffff;
  --title-bg: var(--w98-title);
  --title-tracking: 0;
  --etch: 1px 1px 0 #ffffff, inset 1px 1px 0 #ffffff;
  --c-heading: #000000;

  --sh-btn: inset -1px -1px #808080, inset 1px 1px #dfdfdf;
  --c-btn-hover: #c0c0c0;
  --c-btn-pressed: #c0c0c0;
  --bevel-btn-pressed: #000000 #ffffff #ffffff #000000;
  --sh-btn-pressed: inset 1px 1px #808080, inset -1px -1px #dfdfdf;
  --c-primary-text: #000000;
  --primary-outline: 1px solid #000000;
  --c-btn-disabled: #808080;
  --btn-disabled-shadow: 1px 1px 0 #ffffff;

  --c-input-bg: #ffffff;
  --c-input-focus: #ffffff;
  --sh-input: inset 1px 1px #000000, inset -1px -1px #dfdfdf;
  --select-arrow-bg: #c0c0c0;
  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath fill='%23000000' d='M0 0h8L4 5z'/%3E%3C/svg%3E");
  --c-check-on: #ffffff;
  --c-check-mark: #000000;

  --sh-card: inset -1px -1px #808080, inset 1px 1px #dfdfdf;
  --c-card-hover: #c8c8c8;

  --c-bar-bg: var(--w98-title);
  --c-bar-text: #ffffff;
  --c-bar-subtitle: rgba(255, 255, 255, 0.75);
  --c-bar-link: #ffffff;
  --c-bar-line: #000000;
  --bar-shadow: none;

  --c-nav-text: #000000;
  --bevel-nav-hover: #ffffff #000000 #000000 #ffffff;
  --c-nav-active-bg: var(--tint);
  --c-nav-active-text: #ffffff;
  --bevel-nav-active: var(--tint) var(--tint) var(--tint) var(--tint);
  --c-admin-nav-bg: #c0c0c0;

  --c-tab-bg: #c0c0c0;
  --c-tab-text: #000000;
  --bevel-tab: #ffffff #000000 transparent #ffffff;
  --c-tab-active-bg: #c0c0c0;
  --c-tab-active-text: #000000;
  --c-tabs-line: #ffffff;

  --c-seg-bg: #c0c0c0;
  --c-seg-text: #000000;
  /* toggled buttons in Win98 have a dithered face */
  --c-seg-on-bg: repeating-conic-gradient(#c0c0c0 0 25%, #ffffff 0 50%) 0 0 / 2px 2px;
  --c-seg-on-text: #000000;
  --bevel-seg-on: #000000 #ffffff #ffffff #000000;

  --c-toast-bg: #ffffe1;
  --c-toast-text: #000000;
  --progress-fill: repeating-linear-gradient(90deg, var(--tint) 0 8px, transparent 8px 10px);
  --c-scroll-thumb: #c0c0c0;
  --c-scroll-track: #dfdfdf;
}

/* The window title bar sits inside the double frame */
:root[data-skin="olive"]:not(.theme--dark) .window__title {
  margin: 2px 2px 0;
  min-height: 24px;
}

/* On the title-bar gradient the active link is a sunken grey button */
:root[data-skin="olive"]:not(.theme--dark) .header__link--active,
:root[data-skin="olive"]:not(.theme--dark) .header__link--active:hover {
  border-color: #000000 #ffffff #ffffff #000000;
  background: #c0c0c0;
  color: #000000;
}

:root[data-skin="olive"]:not(.theme--dark) .header__link:hover {
  border-color: rgba(255, 255, 255, 0.7) rgba(0, 0, 0, 0.6) rgba(0, 0, 0, 0.6) rgba(255, 255, 255, 0.7);
}

/* Footer = taskbar */
:root[data-skin="olive"]:not(.theme--dark) .page__footer {
  border-top: 1px solid #c0c0c0;
  background: #c0c0c0;
  box-shadow: inset 0 1px #ffffff, inset 0 2px #dfdfdf;
  color: #303030;
}

:root[data-skin="olive"]:not(.theme--dark) .page__footer a {
  color: #000080;
}

/* Window frame of the admin menu: selected item is the classic navy highlight */
:root[data-skin="olive"]:not(.theme--dark) .admin__link:hover {
  background: #c0c0c0;
}