/*DARK mode (default)*/
:root,
[data-theme="dark"] {
  --bg:           #111318;
  --surface:      #1a1d26;
  --surface-2:    #212532;
  --border:       #353a4d;
  --text-primary: #eef0f8;
  --text-secondary: #9aa4c4;
  --text-muted:   #7a86a8;
  --text-mono:    #7eb3ff;

  --occupied-bg:      #1e2540;
  --occupied-border:  #3d517a;
  --occupied-label:   #91b0e8;
  --occupied-hover-bg:#283050;

  --empty-bg:     #0d2318;
  --empty-border: #1e7a44;
  --empty-label:  #4dd882;
  --empty-glow:   rgba(77, 216, 130, 0.14);
  --empty-hover-bg: #122e1f;

      --accent:       #5b8df5;
      --accent-soft:  rgba(91, 141, 245, 0.18);
      --accent-hover: #7aa3f8;
      --section-label:#b0bede;

      --input-bg:     #1e2233;
      --input-border: #3d517a;
      --input-focus:  #5b8df5;
      --success-bg:   rgba(40,168,88,0.12);
      --success-border:rgba(40,168,88,0.4);
      --success-text: #4dd882;
      --error-bg:     rgba(220,60,60,0.12);
      --error-border: rgba(220,60,60,0.45);
      --error-text:   #f08080;
      --danger:       #e05555;
      --danger-hover: #f07070;
      --warn-bg:      rgba(220,160,40,0.12);
      --warn-border:  rgba(220,160,40,0.4);
      --warn-text:    #f0c060;

  --popup-bg:     #1e2233;
  --popup-border: #3d517a;
  --popup-shadow: 0 20px 60px rgba(0,0,0,0.75), 0 0 0 1px rgba(91,141,245,0.3);

  --toggle-bg:    #2e3448;
  --toggle-knob:  #5b8df5;

  /* search */
  --search-bg:        #1e2233;
  --search-border:    #3d517a;
  --search-focus:     #5b8df5;
  --search-results-bg:#1a1d2e;
  --search-item-hover:#252a40;
  --search-highlight: #5b8df5;
  --search-tag-bg:    rgba(91,141,245,0.15);
  --search-tag-border:rgba(91,141,245,0.4);
  --search-tag-text:  #91b0e8;
  --dimmed-opacity:   0.18;

  --disabled-bg:      #2a1c1c;
  --disabled-border:  #6a3838;
  --disabled-label:   #c08080;
  --disabled-hover-bg:#352020;
  --featured-bg:      #3a2c0e;
  --featured-border:  #c79f3c;
  --featured-label:   #f3cd6c;
  --featured-hover-bg:#4a3812;
  --notepad-bg:       #2f1f16;
  --notepad-border:   #c96e2b;
  --notepad-label:    #f09a57;

  color-scheme: dark;
}

/* LIGHT mode tokens */
[data-theme="light"] {
  --bg:           #f0f2f7;
  --surface:      #ffffff;
  --surface-2:    #e8ecf5;
  --border:       #d0d6e8;
  --text-primary: #1a1f2e;
  --text-secondary:#4a5270;
  --text-muted:   #8a93b0;
  --text-mono:    #3050a0;

  --occupied-bg:      #e8ecf8;
  --occupied-border:  #a0b0d8;
  --occupied-label:   #3050a0;
  --occupied-hover-bg:#dce3f4;

  --empty-bg:     #e0f5eb;
  --empty-border: #70c898;
  --empty-label:  #1a7840;
  --empty-glow:   rgba(26, 120, 64, 0.12);
  --empty-hover-bg: #cff0de;

      --accent:       #2a5cd0;
      --accent-soft:  rgba(42, 92, 208, 0.12);
      --accent-hover: #1a4ab8;
      --section-label:#2a3660;

      --input-bg:     #ffffff;
      --input-border: #a0b0d8;
      --input-focus:  #2a5cd0;
      --success-bg:   rgba(20,140,60,0.1);
      --success-border:rgba(20,140,60,0.35);
      --success-text: #1a7840;
      --error-bg:     rgba(200,40,40,0.08);
      --error-border: rgba(200,40,40,0.35);
      --error-text:   #c02020;
      --danger:       #c02020;
      --danger-hover: #e03030;
      --warn-bg:      rgba(180,120,20,0.1);
      --warn-border:  rgba(180,120,20,0.35);
      --warn-text:    #8a5a00;

  --popup-bg:     #ffffff;
  --popup-border: #a0b0d8;
  --popup-shadow: 0 12px 40px rgba(0,0,0,0.15), 0 0 0 1px rgba(42,92,208,0.2);

  --toggle-bg:    #d0d6e8;
  --toggle-knob:  #2a5cd0;

  /* search */
  --search-bg:        #ffffff;
  --search-border:    #a0b0d8;
  --search-focus:     #2a5cd0;
  --search-results-bg:#ffffff;
  --search-item-hover:#f0f4ff;
  --search-highlight: #2a5cd0;
  --search-tag-bg:    rgba(42,92,208,0.1);
  --search-tag-border:rgba(42,92,208,0.35);
  --search-tag-text:  #2a5cd0;
  --dimmed-opacity:   0.25;

  --disabled-bg:      #f5e8e8;
  --disabled-border:  #c89090;
  --disabled-label:   #8a3030;
  --disabled-hover-bg:#edd8d8;
  --featured-bg:      #fff0c9;
  --featured-border:  #d0a23a;
  --featured-label:   #8a6100;
  --featured-hover-bg:#ffe6ad;
  --notepad-bg:       #fff1e6;
  --notepad-border:   #cf7a3c;
  --notepad-label:    #9b4f19;

  color-scheme: light;
}