::-webkit-scrollbar { width: 8px; }
    ::-webkit-scrollbar-track { background: #f1f6f2; }
    .dark ::-webkit-scrollbar-track { background: #0a1f0f; }
    ::-webkit-scrollbar-thumb { background: #1e6b37; border-radius: 4px; }
    ::-webkit-scrollbar-thumb:hover { background: #4ade80; }

    .bg-contours {
      background-image: 
        radial-gradient(ellipse at 85% 15%, rgba(46, 125, 50, 0.08) 0%, transparent 60%),
        radial-gradient(ellipse at 15% 85%, rgba(30, 107, 55, 0.07) 0%, transparent 50%),
        repeating-linear-gradient(45deg, rgba(21, 67, 31, 0.015) 0px, rgba(21, 67, 31, 0.015) 2px, transparent 2px, transparent 28px);
    }
    .dark .bg-contours {
      background-image: 
        radial-gradient(ellipse at 85% 15%, rgba(74, 222, 128, 0.05) 0%, transparent 60%),
        radial-gradient(ellipse at 15% 85%, rgba(46, 125, 50, 0.05) 0%, transparent 50%),
        repeating-linear-gradient(45deg, rgba(74, 222, 128, 0.01) 0px, rgba(74, 222, 128, 0.01) 2px, transparent 2px, transparent 28px);
    }

    .service-card { transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.28s ease, background-color 0.28s ease, box-shadow 0.28s ease; }
    .service-card.selected {
      border-color: #1e6b37; background-color: #f0fdf4;
      box-shadow: 0 14px 30px -6px rgba(30, 107, 55, 0.22);
      transform: translateY(-3px);
    }
    .dark .service-card.selected {
      border-color: #4ade80; background-color: #113619;
      box-shadow: 0 14px 30px -6px rgba(0, 0, 0, 0.5);
    }
    .service-card.selected .check-indicator { background-color: #1e6b37; border-color: #1e6b37; color: white; }
    .dark .service-card.selected .check-indicator { background-color: #4ade80; border-color: #4ade80; color: #0d2813; }

    #ambientCanvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }

    .ba-slider { position: relative; overflow: hidden; user-select: none; touch-action: pan-y; }
    .ba-slider .resize-layer { position: absolute; top: 0; left: 0; height: 100%; width: 50%; overflow: hidden; z-index: 10; border-right: 3px solid white; }
    .ba-slider .resize-layer-inner { position: absolute; top: 0; left: 0; height: 100%; display: flex; align-items: center; justify-content: center; }
    .ba-slider .handle {
      position: absolute; top: 0; bottom: 0; left: 50%; width: 0; 
      cursor: ew-resize; z-index: 20; transform: translateX(-50%);
    }
    .ba-slider .handle-btn {
      position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
      width: 44px; height: 44px; border-radius: 50%; background: #1e6b37;
      border: 3px solid white; box-shadow: 0 0 15px rgba(0,0,0,0.4);
      display: flex; align-items: center; justify-content: center; color: white;
    }

    #mapPicker { height: 300px; width: 100%; z-index: 5; border-radius: 1rem; }
    
    /* KAARDI TUME REŽIIM */
    .dark .leaflet-layer,
    .dark .leaflet-control-zoom-in,
    .dark .leaflet-control-zoom-out,
    .dark .leaflet-control-attribution {
      filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%);
    }

    .upload-zone { border: 2px dashed rgba(255, 255, 255, 0.35); transition: all 0.2s ease; }
    .upload-zone.dragover { border-color: #4ade80; background-color: rgba(74, 222, 128, 0.15); }
    .honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
    
    .ba-tab { transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; }
    .ba-tab.active { background-color: #15431f; color: #ffffff; border-color: #15431f; }
    .dark .ba-tab.active { background-color: #4ade80; color: #0d2813; border-color: #4ade80; }

    /* Rakendatakse ainult teema vahetamise hetkeks, et kogu leht liiguks ühtses tempos. */
    html.theme-transition,
    html.theme-transition *,
    html.theme-transition *::before,
    html.theme-transition *::after {
      transition-property: background-color, border-color, color, fill, stroke, box-shadow, opacity !important;
      transition-duration: 250ms !important;
      transition-timing-function: ease-in-out !important;
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      .animate-ping,
      .animate-sway-slow,
      .animate-bounce { animation: none !important; }
      html.theme-transition,
      html.theme-transition *,
      html.theme-transition *::before,
      html.theme-transition *::after { transition-duration: 0ms !important; }
    }