/* 🌙 LensFlow Dark Mode */

/* Global */
body.darkmode {
    background: linear-gradient(160deg, #1a1a1a 0%, #111 100%);
    color: #ccc;
  }
  
  body.darkmode::before {
    background-image: url("/files/images/logo/Logo2/LF_lens_white.png");
    opacity: 0.04;
  }
  
  /* Header */
  body.darkmode header h1 {
    color: #81c5f0;
  }
  
  body.darkmode .subtitle {
    color: #aaa;
  }
  
  /* Batch Titles and Tags */
  body.darkmode .batch {
    border-left-color: rgba(129, 197, 240, 0.4);
  }
  
  body.darkmode .batch h2 {
    color: #81c5f0;
  }
  
  body.darkmode .batch-desc {
    color: #aaa;
  }
  
  body.darkmode .tag {
    background: rgba(129, 197, 240, 0.15);
    color: #81c5f0;
  }
  
  /* Footer */
  body.darkmode footer {
    background: #111;
    color: #888;
    border-top-color: #333;
  }
  
  /* Floating Buttons */
  body.darkmode .floating-buttons button {
    background: #222;
    color: #81c5f0;
  }
  
  body.darkmode .floating-buttons button:hover {
    background: #2a2a2a;
  }
  
  /* Lightbox Overlay */
  body.darkmode .lightbox {
    background: rgba(0, 0, 0, 0.9);
  }
  
  body.darkmode .lightbox-content figcaption {
    color: #aaa;
  }
  
  body.darkmode .lightbox #close,
  body.darkmode .lightbox-arrow {
    color: #ccc;
  }
  
  body.darkmode .exif-overlay {
    background: rgba(255, 255, 255, 0.06);
    color: #ddd;
  }
  
  /* Nav Panel */
  body.darkmode .series-nav {
    background: rgba(0, 0, 0, 0.6);
    box-shadow: 0 4px 16px rgba(255,255,255,0.04);
  }
  
  body.darkmode .nav-tag {
    background: rgba(129, 197, 240, 0.2);
    color: #fff;
  }
  
  /* Gear Section */
  body.darkmode .gear-title {
    color: #81c5f0;
  }
  
  body.darkmode .gear-subtitle {
    color: #aaa;
  }
  
  body.darkmode .gear-item {
    color: #ccc;
  }
  
  /* Carousel */
  body.darkmode .carousel-button {
    background: rgba(129, 197, 240, 0.1);
    color: #81c5f0;
  }
  
  body.darkmode .carousel-button:hover {
    background: rgba(129, 197, 240, 0.3);
  }
  
  /* Spoiler Warning */
  body.darkmode .spider-spoiler {
    background: linear-gradient(145deg, #222, #333);
  }
  
  body.darkmode .spider-spoiler:hover {
    background: linear-gradient(145deg, #333, #444);
  }
  
  /* Navigation Ring */
  body.darkmode .radial-button {
    background: #444;
    color: #eee;
  }
  
  /* Loading Overlay */
  body.darkmode #loading-overlay {
    background: rgba(0, 0, 0, 0.75);
    color: #81c5f0;
  }
  
  body.darkmode .exif-pill {
  background: rgba(255, 255, 255, 0.75);
  color: #000000;
}

  body.darkmode .exif-pill.aperture {
  background: rgba(125, 190, 255, 0.75);
}

  body.darkmode .exif-pill.shutter {
  background: rgba(255, 210, 130, 0.75);
}

  body.darkmode .exif-pill.iso {
  background: rgba(250, 130, 140, 0.75);
}

  body.darkmode .exif-pill.focal {
  background: rgba(160, 230, 160, 0.75);
}

  body.darkmode .exif-pill.manual {
  background: rgba(200, 160, 255, 0.75);
}

  body.darkmode .exif-pill.fallback {
  background: rgba(255, 255, 255, 0.75);
}

  body.darkmode .exif-pill.camera {
  background: rgba(255, 255, 255, 0.75);
}

body.darkmode .expand-button {
  background: #333;
  color: #81c5f0;
  border: 1px solid #444;
}

body.darkmode .expand-button:hover {
  background: #444;
}