/* ===========================================
   INSTAPANEL — Design Tokens
   Variables CSS globales du design system
   =========================================== */

/* Font faces - reference fonts from parent site */
@font-face {
  font-family: 'All Round Gothic';
  src: url('/ressources/fonts/all-round-gothic-xlig.otf') format('opentype');
  font-weight: 200;
}

@font-face {
  font-family: 'All Round Gothic';
  src: url('/ressources/fonts/all-round-gothic-book.otf') format('opentype');
  font-weight: 400;
}

@font-face {
  font-family: 'All Round Gothic';
  src: url('/ressources/fonts/all-round-gothic-medium.otf') format('opentype');
  font-weight: 500;
}

@font-face {
  font-family: 'All Round Gothic';
  src: url('/ressources/fonts/all-round-gothic-demi.otf') format('opentype');
  font-weight: 600;
}

@font-face {
  font-family: 'All Round Gothic';
  src: url('/ressources/fonts/all-round-gothic-bold.otf') format('opentype');
  font-weight: 700;
}

:root {
  /* --- Colors --- */
  --primary: #333233;
  --primary-light: #4d4c4d;
  --primary-dark: #222122;
  --white: #ffffff;
  --accent: #F5B0CC;
  --accent-light: #FBDBE9;
  --accent-dark: #E89AB5;

  /* --- Text --- */
  --text: #333233;
  --text-light: #6B6A6B;
  --text-muted: #999899;

  /* --- Backgrounds --- */
  --bg: #F9F9F9;
  --bg-white: #ffffff;

  /* --- Borders --- */
  --border: #E8E8E8;
  --border-light: #F0F0F0;

  /* --- Semantic colors --- */
  --success: #27AE60;
  --warning: #F39C12;
  --danger: #E74C3C;
  --info: #3498DB;

  /* --- Typography --- */
  --font-family: 'All Round Gothic', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* --- Border radius --- */
  --radius-pill: 50px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 10px;
  --radius-xs: 6px;

  /* --- Shadows --- */
  --shadow-sm: 0 2px 8px rgba(51, 50, 51, 0.06);
  --shadow-md: 0 8px 24px rgba(51, 50, 51, 0.08);
  --shadow-lg: 0 16px 48px rgba(51, 50, 51, 0.1);
  --shadow-accent: 0 8px 24px rgba(245, 176, 204, 0.3);

  /* --- Transitions --- */
  --transition-fast: 0.2s ease;
  --transition-base: 0.3s ease;

  /* --- Layout --- */
  --sidebar-width: 250px;
  --topbar-height: 60px;
}