/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 *= stub application.tailwind.css
 *= require actiontext
 */

/* Animations personnalisées */
@keyframes spin-slow {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.animate-spin-slow {
  animation: spin-slow 3s linear infinite;
}


/* Expandable text styles */
.expanded {
  position: relative;
  z-index: 10;
  white-space: normal;
  overflow: visible;
  cursor: zoom-out;
  max-width: none !important;
}

.expandable-text {
  cursor: zoom-in;
}

:root {
  --color-background-dp00: #FFFFFF;
  --color-background-dp01: #FFFFFF;
  --color-background-dp02: #F5F5F5;
  --color-background-dp03: #ECECEC;
  --color-background-dp04: #E0E0E0;
  --color-primary-50: #eef2ff;
  --color-primary-100: #e0e7ff;
  --color-primary-200: #c7d2fe;
  --color-primary-300: #a5b4fc;
  --color-primary-400: #818cf8;
  --color-primary-500: #6366f1;
  --color-primary-600: #4f46e5;
  --color-primary-700: #4338ca;
  --color-primary-800: #3730a3;
  --color-primary-900: #312e81; 
  --color-secondary-50: #ecfdf5;
  --color-secondary-100: #d1fae5;
  --color-secondary-200: #a7f3d0;
  --color-secondary-300: #6ee7b7;
  --color-secondary-400: #34d399;
  --color-secondary-500: #10b981;
  --color-secondary-600: #059669;
  --color-secondary-700: #047857;
  --color-secondary-800: #065f46;
  --color-secondary-900: #064e3b; 
  --color-neutral-50: #f9f9f9;
  --color-neutral-100: #f5f5f5;
  --color-neutral-200: #eeeeee;
  --color-neutral-300: #e0e0e0;
  --color-neutral-400: #bdbdbd;
  --color-neutral-500: #9e9e9e;
  --color-neutral-600: #757575;
  --color-neutral-700: #616161;
  --color-neutral-800: #424242;
  --color-neutral-900: #212121;
  --shade-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shade-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --shade-lg: 0 10px 15px rgba(0, 0, 0, 0.15);
  --shade-xl: 0 20px 25px rgba(0, 0, 0, 0.2);
}

.dark {
  --color-background-dp00: #202124;
  --color-background-dp01: #2C2D32;
  --color-background-dp02: #2F3035;
  --color-background-dp03: #323438;
  --color-background-dp04: #393C41;
  --color-primary-50: #1a1c2e;
  --color-primary-100: #232546;
  --color-primary-200: #2d3166;
  --color-primary-300: #41498c;
  --color-primary-400: #5a64b3;
  --color-primary-500: #7c89db;
  --color-primary-600: #9daaff;
  --color-primary-700: #b4c2ff;
  --color-primary-800: #d0d7ff;
  --color-primary-900: #e5e8ff;
  --color-secondary-50: #0d1f18;
  --color-secondary-100: #113026;
  --color-secondary-200: #16503a;
  --color-secondary-300: #1f7a55;
  --color-secondary-400: #28a374;
  --color-secondary-500: #3ac08a;
  --color-secondary-600: #57d8a2;
  --color-secondary-700: #75e5b7;
  --color-secondary-800: #a2f5d4;
  --color-secondary-900: #d1fae5;
  --color-neutral-50: #121212;
  --color-neutral-100: #181818;
  --color-neutral-200: #1e1e1e;
  --color-neutral-300: #242424;
  --color-neutral-400: #616161;
  --color-neutral-500: #909090;
  --color-neutral-600: #bdbdbd;
  --color-neutral-700: #d6d6d6; 
  --color-neutral-800: #eaeaea;  
  --color-neutral-900: #f2f2f2; 
  --shade-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shade-md: 0 4px 6px rgba(0, 0, 0, 0.08);
  --shade-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
  --shade-xl: 0 20px 25px rgba(0, 0, 0, 0.15);
}