/* ========================================================================== 
   T happy Theme for Kreezalid — BRAND COLORS
   ========================================================================== 

   Palette T happy et correspondances avec les variables historiques du thème
   Good Karma. Les noms --gk-* sont volontairement conservés pour que le reste
   du thème continue de fonctionner sans aucune autre modification.
   ========================================================================== */

:root {

  /* ---------- 1. Palette officielle T happy ----------------------------- */

  --thappy-turquoise:     #22A7AB;
  --thappy-green:         #3F9A49;
  --thappy-lime:          #A6CE70;
  --thappy-yellow:        #E7D567;
  --thappy-orange:        #ECB33E;
  --thappy-coral:         #F6B491;
  --thappy-pink:          #E6B4C8;
  --thappy-purple:        #B8A3CB;
  --thappy-blue:          #7896C3;

  /* Variantes techniques du turquoise principal */
  --thappy-turquoise-rgb: 34 167 171;
  --thappy-turquoise-60:  rgb(var(--thappy-turquoise-rgb) / 61%);
  --thappy-turquoise-tint:#E9F7F7;

  /* ---------- 2. Compatibilité avec le thème Good Karma ---------------- */

  --gk-orange:            var(--thappy-turquoise);      /* CTA, liens actifs, hover */
  --gk-orange-60:         var(--thappy-turquoise-60);   /* hover menu de la homepage */
  --gk-orange-tint:       var(--thappy-turquoise-tint); /* sélections et fonds doux */
  --gk-coral:             var(--thappy-coral);          /* attributs sélectionnés */
  --gk-coral-strong:      var(--thappy-orange);         /* notation et accent chaud */
  --gk-teal:              var(--thappy-turquoise);      /* titres principaux */
  --gk-yellow:            var(--thappy-yellow);         /* dégradé : départ */
  --gk-pink:              var(--thappy-pink);           /* dégradé : arrivée */
  --gk-red:               var(--thappy-coral);          /* fond de secours add-cat */

  /* Étoiles de notation */
  --gk-star-rgb:          236 179 62;  /* --thappy-orange */
  --gk-star-empty-rgb:    229 231 235;

  /* ---------- 3. Blanc / noir ------------------------------------------- */

  --gk-white:             #FFFFFF;
  --gk-white-80:          #FFFFFFCC;
  --gk-white-33:          #FFFFFF54;
  --gk-black:             #000000;

  /* ---------- 4. Échelle de gris ---------------------------------------- */

  --gk-grey-900:          #222222;
  --gk-grey-800:          #2D2D2D;
  --gk-grey-700:          #333333;
  --gk-grey-600:          #474D50;
  --gk-grey-500:          #696C74;
  --gk-grey-400:          #878B8F;
  --gk-grey-300:          #A9A9A9;
  --gk-grey-250:          #B9B7B7;
  --gk-grey-200:          #D3D2D3;
  --gk-grey-150:          #DFDFDF;
  --gk-grey-100:          #ECECEC;
  --gk-grey-75:           #EEEEEE;
  --gk-grey-50:           #F2F3F5;
  --gk-grey-25:           #F5F5F5;

  --gk-slate-600:         #4C5867;
  --gk-slate-150:         #DFE2E7;

  /* Fonds de confirmation légèrement teintés avec la marque */
  --gk-mint-200:          #CDE9DA;
  --gk-mint-50:           #F4FBF7;

  /* ---------- 5. Voiles et dégradés ------------------------------------- */

  --gk-overlay-black-25:  #00000040;
  --gk-overlay-black-50:  #00000080;
  --gk-overlay-black-57:  #00000091;
  --gk-overlay-dark-36:   #2C2C2C5C;

  /* ---------- 6. Ombres ------------------------------------------------- */

  --gk-shadow-black-15:   rgb(0 0 0 / 15%);
  --gk-shadow-black-16:   rgb(0 0 0 / 16%);
  --gk-shadow-black-22:   rgb(0 0 0 / 22%);
  --gk-shadow-black-23:   rgb(0 0 0 / 23%);
  --gk-shadow-black-25:   rgb(0 0 0 / 25%);
  --gk-shadow-black-30:   rgb(0 0 0 / 30%);
  --gk-shadow-black-50:   rgb(0 0 0 / 50%);
  --gk-shadow-slate-10:   rgb(57 73 76 / 10%);
  --gk-shadow-green-15:   rgb(63 154 73 / 15%);
  --gk-shadow-green-7:    rgb(63 154 73 / 7%);
  --gk-shadow-grey-30:    rgb(172 171 171 / 30%);

  /* ---------- 7. Neutres de l'interface --------------------------------- */

  /* Encre */
  --gk-ink-900:           #172033;
  --gk-ink-700:           #3D4653;
  --gk-ink-600:           #556072;
  --gk-ink-500:           #667085;
  --gk-ink-400:           #98A2B3;
  --gk-ink-300:           #D0D5DD;

  /* Filets et bordures */
  --gk-line-100:          #F1F4F8;
  --gk-line-200:          #EEF1F6;
  --gk-line-250:          #EDF0F5;
  --gk-line-300:          #EAEEF4;
  --gk-line-350:          #E6EBF4;
  --gk-line-400:          #E3E8F2;
  --gk-line-450:          #E2E6EE;

  /* Surfaces claires, très légèrement teintées de turquoise */
  --gk-surface-50:        #FBFEFE;
  --gk-surface-100:       #F3FAFA;
  --gk-surface-200:       #E3EEEE;

  /* Blocs sombres — conservés pour assurer un contraste accessible */
  --gk-navy-900:          #0C1116;
  --gk-navy-800:          #141C2B;
  --gk-navy-700:          #161E28;
  --gk-navy-600:          #1C2530;
  --gk-navy-500:          #20293A;
  --gk-navy-text:         #CBD2DC;
  --gk-navy-muted:        #8A94A3;

  /* Accents fonctionnels */
  --gk-amber:             var(--thappy-orange);
  --gk-green:             var(--thappy-lime);
  --gk-green-dark:        var(--thappy-green);

  /* Ombres et voiles bleutés */
  --gk-shadow-navy-7:     rgb(16 24 40 / 7%);
  --gk-shadow-navy-5:     rgb(16 24 40 / 5%);
  --gk-overlay-navy-5:    rgb(12 17 22 / 5%);
  --gk-overlay-navy-84:   rgb(12 17 22 / 84%);
  --gk-overlay-navy-35:   rgb(12 17 22 / 35%);
  --gk-white-94:          rgb(255 255 255 / 94%);
  --gk-white-90:          rgb(255 255 255 / 90%);
  --gk-white-78:          rgb(255 255 255 / 78%);
  --gk-white-60:          rgb(255 255 255 / 60%);
  --gk-white-30:          rgb(255 255 255 / 30%);
  --gk-white-22:          rgb(255 255 255 / 22%);
  --gk-white-12:          rgb(255 255 255 / 12%);
  --gk-white-8:           rgb(255 255 255 / 8%);

  /* Marques tierces — couleurs officielles à ne pas rebrander */
  --gk-brand-whatsapp:    #25D366;
  --gk-brand-facebook:    #1877F2;
  --gk-brand-messenger:   #0084FF;
}