:root {
  --color-primary: #fece05;
  --primary-hover: #fece05;
  --color-bg: #0b0b0e;
  --color-surface: #121218;
  --color-text: #f5f6f7;
  --color-muted: #a1a6ae;
  --color-accent: #22d3ee;
}

/* Thème clair */
/* :root.light-theme {
  --color-primary: #fece05;
  --primary-hover: #fece05;
  --color-bg: #f5f5f7;
  --color-surface: #ffffff;
  --color-text: #0b0b0e;
  --color-muted: #555;
  --color-accent: #22d3ee;
}

html, body {
  background-color: var(--color-bg);
  color: var(--color-text);
  transition: background-color 0.4s ease, color 0.4s ease;
}
 */
body {
    cursor: url("images/cursor.png") 0 0, auto;
}

::selection {
    background-color: var(--color-primary);
    color: var(--color-text);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--color-surface);
}

::-webkit-scrollbar-thumb {
    background: var(--color-text);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-primary);
}


/* Scrollbar fine et élégante juste pour le planning */
#scroll-container::-webkit-scrollbar {
  height: 8px;
}

#scroll-container::-webkit-scrollbar-track {
  background: var(--color-surface);
  border-radius: 10px;
}

#scroll-container::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 10px;
  transition: background-color 0.3s ease;
}

#scroll-container::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary); 
  cursor: none;
}

/* Compatibilité Firefox */
#scroll-container {
  scrollbar-width: thin;
  scrollbar-color: var(--color-text) var(--color-surface);
}


/* Scrollbar pour la galerie */
#scroll-container-galerie::-webkit-scrollbar {
  height: 8px;
}

#scroll-container-galerie::-webkit-scrollbar-track {
  background: var(--color-surface);
  border-radius: 10px;
}

#scroll-container-galerie::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 10px;
  transition: background-color 0.3s ease;
}

#scroll-container-galerie::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary); 
  cursor: none;
}

/* Compatibilité Firefox */
#scroll-container-galerie {
  scrollbar-width: thin;
  scrollbar-color: var(--color-text) var(--color-surface);
}

@media (max-width: 640px) {
    #scroll-container-galerie {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    #scroll-container-galerie::-webkit-scrollbar {
        display: none;
    }
}

#fullscreenImage {
    cursor: grab;
    user-select: none;
}

#fullscreenImage:active {
    cursor: grabbing;
}
.bg-primary {
    background-color: var(--color-primary);
}
.bg-primary-hover:hover {
    background-color: var(--primary-hover);
}
.text-primary {
    color: var(--color-primary);
}

.border-primary {
    border-color: var(--color-primary);
}

.bg-surface {
    background-color: var(--color-surface);
}

.bg-app {
    background-color: var(--color-bg);
}

.text-app {
    color: var(--color-text);
}

.text-muted {
    color: var(--color-muted);
}

.ring-primary {
    --tw-ring-color: var(--color-primary);
}

html {
    scroll-behavior: smooth;
}


/* style.css */
.bg-primary-alpha-20 {
  background-color: rgba(254, 206, 5, 0.2);
}