/* Event theme overrides.
   style.css が既定値とエイリアスを持ち、このファイルはイベント単位の上書きを担当します。 */

:root {
  /* Theme primitives */
  --theme-bg: #f8f9fa;
  --theme-surface: #ffffff;
  --theme-text: #2d3436;
  --theme-text-light: #555555;
  --theme-text-muted: #666666;
  --theme-primary: #0984e3;
  --theme-secondary: #00b894;
  --theme-accent: #fd79a8;
  --theme-danger: #ff0000;
  --theme-border: #eeeeee;

  /* Brand-specific accents */
  --color-beginner-image-end: #55efc4;
  --color-pro-image-start: #111;
  --color-pro-image-end: #333;

  /* Ribbon colors
     class mapping:
     - .point-o  -> --color-ribbon-point-o
     - .point-k  -> --color-ribbon-point-k
     - .point-sp -> --color-ribbon-point-sp
     - .point-none は display:none のため色指定なし */
  --color-ribbon-tail-default: #d63031;
  --color-ribbon-point-o: var(--theme-secondary);
  --color-ribbon-point-k: var(--theme-primary);
  --color-ribbon-point-sp: var(--theme-accent);

  /* Series point ranking colors */
  --color-sp-row-1-bg: color-mix(in srgb, #f0b429 6%, transparent);
  --color-sp-row-2-bg: color-mix(in srgb, #a8b4c0 5%, transparent);
  --color-sp-row-3-bg: color-mix(in srgb, #cd7f32 5%, transparent);
  --color-sp-rank-text: #ffffff;
  --color-sp-rank-1-start: #f5c842;
  --color-sp-rank-1-end: #e09820;
  --color-sp-rank-2-start: #c0c8d4;
  --color-sp-rank-2-end: #8e9aaa;
  --color-sp-rank-3-start: #d4894a;
  --color-sp-rank-3-end: #a86428;
  --shadow-sp-rank-1: 0 2px 8px rgba(240, 180, 41, 0.4);
  --shadow-sp-rank-2: 0 2px 8px rgba(160, 175, 192, 0.35);
  --shadow-sp-rank-3: 0 2px 8px rgba(205, 127, 50, 0.35);

  /* Loader colors */
  --color-loader-bg: #060a0d;
  --bg-loader-glow: radial-gradient(
    ellipse 70% 50% at 50% 50%,
    color-mix(in srgb, var(--theme-primary) 10%, transparent) 0%,
    transparent 70%
  );
  --color-loader-brand: #ffffff;
  --shadow-loader-brand: 0 0 80px rgba(255, 255, 255, 0.1);
  --color-loader-track: rgba(255, 255, 255, 0.12);
  --color-loader-bike: #ffffff;

  /* Optional background image */
  --image-hero: url('./hero-bg.png');

  /* Optional overlays and shadows */
  --overlay-header-bg: rgba(255, 255, 255, 0.9);
  --overlay-header-border: rgba(0, 0, 0, 0.05);
  --overlay-mobile-menu-bg: rgba(255, 255, 255, 0.98);
  --overlay-hero-panel-bg: rgba(255, 255, 255, 0.7);
  --overlay-hero-panel-border: rgba(255, 255, 255, 0.6);
  --overlay-modal-bg: rgba(0, 0, 0, 0.5);
  --bg-primary-tint-gradient: linear-gradient(90deg, color-mix(in srgb, var(--theme-primary) 5%, transparent) 0%, transparent 100%);
  --shadow-primary-soft: 0 4px 6px color-mix(in srgb, var(--theme-primary) 20%, transparent);
  --shadow-primary-strong: 0 4px 15px color-mix(in srgb, var(--theme-primary) 30%, transparent);
  --shadow-elevation-soft: 0 4px 6px rgba(0, 0, 0, 0.02);
  --shadow-elevation-1: 0 4px 15px rgba(0, 0, 0, 0.05);
  --shadow-elevation-2: 0 4px 10px rgba(0, 0, 0, 0.1);
  --shadow-elevation-3: 0 10px 20px rgba(0, 0, 0, 0.1);
  --shadow-header: 0 2px 10px rgba(0, 0, 0, 0.05);
  --shadow-hero-panel: 0 8px 32px rgba(0, 0, 0, 0.1);
  --shadow-modal: 0 15px 30px rgba(0, 0, 0, 0.2);
  --shadow-ribbon: 0 4px 6px rgba(0, 0, 0, 0.2);
  --color-modal-close: #aaa;
  --color-map-placeholder-bg: #e9ecef;
  --color-map-placeholder-text: #a4b0be;
  --color-map-placeholder-border: #ced4da;

}