/*
 * Mac OS 9 Platinum Theme Tokens
 * These CSS custom properties define the visual characteristics of the Platinum theme.
 * They are designed to be overridable for future Kaleidoscope theme support.
 */

:root {
  /* ========================================
     CORE COLORS
     ======================================== */
  
  /* Desktop & Background - Mac OS 9 default purple/blue pattern */
  --desktop-bg: #6666aa;
  --desktop-pattern: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 2px,
    rgba(255, 255, 255, 0.05) 2px,
    rgba(255, 255, 255, 0.05) 4px
  );
  --desktop-pattern-image: var(--desktop-pattern);
  --desktop-pattern-image-size: 4px 4px;
  --desktop-icon-text: #ffffff;
  --desktop-icon-text-shadow: #000000;
  
  /* Window Colors */
  --window-bg: #dddddd;
  --window-content-bg: #ffffff;
  --window-border-outer-light: #ffffff;
  --window-border-outer-dark: #555555;
  --window-border-inner-light: #eeeeee;
  --window-border-inner-dark: #888888;
  
  /* Title Bar - Active */
  --titlebar-active-start: #cccccc;
  --titlebar-active-end: #999999;
  --titlebar-active-stripe: #666666;
  --titlebar-text-active: #000000;
  
  /* Title Bar - Inactive */
  --titlebar-inactive-bg: #cccccc;
  --titlebar-text-inactive: #666666;
  
  /* Menu Bar */
  --menubar-bg: #cccccc;
  --menubar-pattern-image: none;
  --menubar-pattern-image-size: auto 100%;
  --menubar-border: #999999;
  --menubar-text: #000000;
  --menubar-text-disabled: #888888;
  
  /* Menu */
  --menu-bg: #ffffff;
  --menu-pattern-image: none;
  --menu-pattern-image-size: auto;
  --menu-border: #000000;
  --menu-shadow: rgba(0, 0, 0, 0.3);
  --menu-item-hover: #3366cc;
  --menu-item-hover-text: #ffffff;
  --menu-divider: #cccccc;
  --menu-text: #000000;
  --menu-text-disabled: #888888;
  --menu-title-normal-image: none;
  --menu-title-pressed-image: none;
  --menu-free-bg-image: none;
  --menu-free-pressed-image: none;
  --menu-free-divider-image: none;
  
  /* Scrollbar */
  --scrollbar-track: #dddddd;
  --scrollbar-track-border: #888888;
  --scrollbar-thumb: #cccccc;
  --scrollbar-thumb-border-light: #ffffff;
  --scrollbar-thumb-border-dark: #666666;
  --scrollbar-arrow-bg: #cccccc;
  --scrollbar-arrow: #000000;
  
  /* Buttons */
  --button-bg: #dddddd;
  --button-border-light: #ffffff;
  --button-border-dark: #555555;
  --button-text: #000000;
  --button-pressed-bg: #bbbbbb;
  --button-default-ring: #000000;
  --button-disabled-text: #888888;
  
  /* Checkbox & Radio */
  --checkbox-bg: #ffffff;
  --checkbox-border: #666666;
  --checkbox-check: #000000;
  --radio-dot: #000000;
  
  /* Text Fields */
  --input-bg: #ffffff;
  --input-border: #888888;
  --input-border-focus: #3366cc;
  --input-text: #000000;
  --input-placeholder: #888888;
  
  /* Selection */
  --selection-bg: #3366cc;
  --selection-text: #ffffff;
  
  /* Progress Bar */
  --progress-track: #dddddd;
  --progress-fill: #3366cc;
  --progress-border: #888888;
  
  /* Slider */
  --slider-track: #dddddd;
  --slider-track-border: #888888;
  --slider-thumb: #cccccc;
  --slider-thumb-border-light: #ffffff;
  --slider-thumb-border-dark: #666666;
  --slider-tick: #888888;
  
  /* Tabs */
  --tab-bg: #cccccc;
  --tab-active-bg: #dddddd;
  --tab-border-light: #ffffff;
  --tab-border-dark: #666666;
  --tab-text: #000000;
  
  /* List View */
  --list-header-bg: #dddddd;
  --list-header-border: #888888;
  --list-row-even: #ffffff;
  --list-row-odd: #f0f0f0;
  --list-row-selected: #3366cc;
  --list-text: #000000;
  --list-text-selected: #ffffff;
  
  /* Group Box */
  --groupbox-border: #888888;
  --groupbox-label-bg: #dddddd;
  
  /* Icon */
  --icon-text: #000000;
  --icon-text-shadow: #ffffff;
  --icon-selected-bg: #3366cc;
  --icon-selected-text: #ffffff;
  --finder-list-bg: #ffffff;
  --finder-list-text: #000000;
  
  /* Tooltip */
  --tooltip-bg: #ffffcc;
  --tooltip-border: #000000;
  --tooltip-text: #000000;
  
  /* ========================================
     TYPOGRAPHY
     ======================================== */
  
  --font-system: "Chicago", "Charcoal", "Geneva", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-size-base: 12px;
  --font-size-small: 10px;
  --font-size-menu: 12px;
  --font-size-title: 12px;
  --font-size-icon: 10px;
  --font-weight-normal: 400;
  --font-weight-bold: 700;
  
  /* ========================================
     SPACING & SIZING
     ======================================== */
  
  /* Window */
  --window-border-width: 1px;
  --window-title-height: 19px;
  --window-padding: 0px;
  --window-corner-radius: 0px;
  
  /* Window Widgets */
  --widget-size: 13px;
  --widget-spacing: 3px;
  --widget-margin: 3px;
  
  /* Menu Bar */
  --menubar-height: 20px;
  --menubar-padding-h: 10px;
  --menu-item-padding: 4px 18px;
  
  /* Scrollbar */
  --scrollbar-width: 16px;
  --scrollbar-arrow-height: 16px;
  
  /* Button */
  --button-height: 20px;
  --button-padding: 4px 12px;
  --button-border-width: 2px;
  
  /* Checkbox & Radio */
  --checkbox-size: 12px;
  --radio-size: 12px;
  
  /* Input */
  --input-height: 22px;
  --input-padding: 2px 4px;
  
  /* Tab */
  --tab-height: 21px;
  --tab-padding: 4px 12px;
  
  /* Icon Grid */
  --icon-size: 32px;
  --icon-grid-gap: 16px;
  --icon-label-width: 72px;
  
  /* Finder Header */
  --finder-header-height: 20px;
  
  /* ========================================
     SHADOWS & EFFECTS
     ======================================== */
  
  --window-shadow: 
    1px 1px 0 var(--window-border-outer-dark),
    2px 2px 0 rgba(0, 0, 0, 0.15);
  
  --menu-shadow-offset: 2px;
  
  --button-inset:
    inset 1px 1px 0 var(--button-border-light),
    inset -1px -1px 0 var(--button-border-dark);
  
  --button-pressed-inset:
    inset 1px 1px 0 var(--button-border-dark),
    inset -1px -1px 0 var(--button-border-light);
  
  /* ========================================
     Z-INDEX LAYERS
     ======================================== */
  
  --z-desktop: 0;
  --z-desktop-icons: 10;
  --z-window-base: 100;
  --z-window-active: 200;
  --z-menubar: 1000;
  --z-menu: 1100;
  --z-modal: 2000;
  --z-tooltip: 3000;
  --z-drag: 4000;
}
