/*
 * Fichier de surcharge des variables GUI — Kazamea (bénéficiaire)
 * Palette source : kazamea-beneficiaire/src/assets/gui/global.css
 * Les variables définies ici surchargeront celles définies dans global.css embarqué.
 */

:root {
  /* MAIN COLORS */
  --gui-rgb-color-primary: 91, 63, 255;
  --gui-color-primary: rgb(var(--gui-rgb-color-primary));
  --gui-rgb-color-primary-high: 70, 45, 220;
  --gui-color-primary-high: rgb(var(--gui-rgb-color-primary-high));
  --gui-rgb-color-primary-low: 235, 230, 255;
  --gui-color-primary-low: rgb(var(--gui-rgb-color-primary-low));
  --gui-rgb-color-primary-active: 110, 85, 255;
  --gui-color-primary-active: rgb(var(--gui-rgb-color-primary-active));

  --gui-rgb-color-secondary: 134, 252, 183;
  --gui-color-secondary: rgb(var(--gui-rgb-color-secondary));
  --gui-rgb-color-secondary-high: 100, 220, 150;
  --gui-color-secondary-high: rgb(var(--gui-rgb-color-secondary-high));
  --gui-rgb-color-secondary-low: 225, 252, 240;
  --gui-color-secondary-low: rgb(var(--gui-rgb-color-secondary-low));
  --gui-rgb-color-secondary-active: 160, 252, 200;
  --gui-color-secondary-active: rgb(var(--gui-rgb-color-secondary-active));

  --gui-rgb-color-tertiary: 45, 32, 128;
  --gui-color-tertiary: rgb(var(--gui-rgb-color-tertiary));
  --gui-rgb-color-tertiary-high: 35, 25, 100;
  --gui-color-tertiary-high: rgb(var(--gui-rgb-color-tertiary-high));
  --gui-rgb-color-tertiary-low: 197, 201, 209;
  --gui-color-tertiary-low: rgb(var(--gui-rgb-color-tertiary-low));
  --gui-rgb-color-tertiary-active: 55, 40, 140;
  --gui-color-tertiary-active: rgb(var(--gui-rgb-color-tertiary-active));

  /* STATE COLORS */
  --gui-rgb-color-success: 110, 226, 157;
  --gui-color-success: rgb(var(--gui-rgb-color-success));
  --gui-rgb-color-success-high: 49, 192, 116;
  --gui-color-success-high: rgb(var(--gui-rgb-color-success-high));
  --gui-rgb-color-success-low: 214, 248, 228;
  --gui-color-success-low: rgb(var(--gui-rgb-color-success-low));
  --gui-rgb-color-success-active: 110, 226, 157;
  --gui-color-success-active: rgb(var(--gui-rgb-color-success-active));

  --gui-rgb-color-info: 107, 126, 255;
  --gui-color-info: rgb(var(--gui-rgb-color-info));
  --gui-rgb-color-info-high: 56, 31, 204;
  --gui-color-info-high: rgb(var(--gui-rgb-color-info-high));
  --gui-rgb-color-info-low: 244, 242, 255;
  --gui-color-info-low: rgb(var(--gui-rgb-color-info-low));
  --gui-rgb-color-info-active: 107, 126, 255;
  --gui-color-info-active: rgb(var(--gui-rgb-color-info-active));

  --gui-rgb-color-warning: 251, 179, 78;
  --gui-color-warning: rgb(var(--gui-rgb-color-warning));
  --gui-rgb-color-warning-high: 229, 128, 17;
  --gui-color-warning-high: rgb(var(--gui-rgb-color-warning-high));
  --gui-rgb-color-warning-low: 255, 224, 181;
  --gui-color-warning-low: rgb(var(--gui-rgb-color-warning-low));
  --gui-rgb-color-warning-active: 251, 179, 78;
  --gui-color-warning-active: rgb(var(--gui-rgb-color-warning-active));

  --gui-rgb-color-danger: 226, 35, 91;
  --gui-color-danger: rgb(var(--gui-rgb-color-danger));
  --gui-rgb-color-danger-high: 163, 18, 61;
  --gui-color-danger-high: rgb(var(--gui-rgb-color-danger-high));
  --gui-rgb-color-danger-low: 255, 215, 226;
  --gui-color-danger-low: rgb(var(--gui-rgb-color-danger-low));
  --gui-rgb-color-danger-active: 226, 35, 91;
  --gui-color-danger-active: rgb(var(--gui-rgb-color-danger-active));

  /* GRAY / BLACK / WHITE */
  --gui-rgb-color-white: 255, 255, 255;
  --gui-color-white: rgb(var(--gui-rgb-color-white));
  --gui-rgb-color-black: 28, 26, 52;
  --gui-color-black: rgb(var(--gui-rgb-color-black));

  /* NEUTRALS */
  --gui-rgb-color-neutral-7: 95, 92, 130;
  --gui-color-neutral-7: rgb(var(--gui-rgb-color-neutral-7));
  --gui-rgb-color-neutral-9: 145, 142, 175;
  --gui-color-neutral-9: rgb(var(--gui-rgb-color-neutral-9));
  --gui-rgb-color-neutral-10: 185, 182, 205;
  --gui-color-neutral-10: rgb(var(--gui-rgb-color-neutral-10));
  --gui-rgb-color-neutral-11: 218, 216, 230;
  --gui-color-neutral-11: rgb(var(--gui-rgb-color-neutral-11));

  /* BACKGROUND COLORS */
  --gui-rgb-color-background-default: 185, 255, 218;
  --gui-color-background-default: rgb(var(--gui-rgb-color-background-default));
  --gui-rgb-color-background-default-high: 155, 235, 195;
  --gui-color-background-default-high: rgb(var(--gui-rgb-color-background-default-high));
  --gui-rgb-color-background-default-low: 230, 255, 245;
  --gui-color-background-default-low: rgb(var(--gui-rgb-color-background-default-low));
  --gui-rgb-color-background-default-active: 205, 255, 225;
  --gui-color-background-default-active: rgb(var(--gui-rgb-color-background-default-active));

  /* COMPLEMENTARY COLORS */
  --gui-rgb-color-complementary-1: 255, 236, 139;
  --gui-rgb-color-complementary-2: 255, 182, 22;
  --gui-rgb-color-complementary-3: 245, 153, 201;
  --gui-rgb-color-complementary-4: 227, 48, 141;
  --gui-rgb-color-complementary-5: 208, 233, 255;
  --gui-rgb-color-complementary-6: 108, 184, 255;
  --gui-rgb-color-complementary-7: 210, 142, 255;
  --gui-rgb-color-complementary-8: 153, 52, 220;
  --gui-rgb-color-complementary-9: 244, 228, 255;
  --gui-rgb-color-complementary-10: 255, 244, 185;

  --gui-color-gradient-1: linear-gradient(90deg, var(--gui-color-tertiary-low) 0%, var(--gui-color-success-low) 100%);

  /* SHADOWS */
  --gui-rgba-color-shadow-small: 25, 22, 45, 0.06;
  --gui-rgba-color-shadow-medium: 25, 22, 45, 0.1;
  --gui-rgba-color-shadow-large: 25, 22, 45, 0.16;

  /* BORDER RADIUS */
  --gui-border-radius-extra-small: 4px;
  --gui-border-radius-small: 8px;
  --gui-border-radius-medium: 16px;
  --gui-border-radius-large: 24px;

  /* TYPOGRAPHY */
  --gui-text-font-size-extra-small: 11px;

  --gui-font-family-default: "Inter", sans-serif;
  --gui-font-family-heading: "Inter", sans-serif;
  --gui-heading-font-weight: var(--gui-text-font-weight-bold);
  --gui-heading-font-weight-mobile: var(--gui-text-font-weight-bold);

  --gui-text-font-weight: var(--gui-text-font-weight-regular);

  --gui-h1-font-size: 46px;
  --gui-h1-font-size-mobile: 32px;
  --gui-h2-font-size: 34px;
  --gui-h2-font-size-mobile: 26px;
  --gui-h3-font-size: 26px;
  --gui-h3-font-size-mobile: 21px;
  --gui-h4-font-size: 21px;
  --gui-h4-font-size-mobile: 18px;
  --gui-h5-font-size: 16px;
  --gui-h5-font-size-mobile: 14px;
  --gui-h6-font-size: 14px;
  --gui-h6-font-size-mobile: 12px;

  --gui-header-height: 64px;
  --gui-header-mobile-height: 46px;

  /* TEXT COLORS */
  --gui-text-color: var(--gui-color-black);
  --gui-text-color-low: var(--gui-color-neutral-7);
  --gui-heading-color: var(--gui-color-black);
  --gui-placeholder-color: var(--gui-color-neutral-7);
  --gui-label-color: var(--gui-color-black);

  --gui-label-font-size: var(--gui-text-font-size-medium);
  --gui-label-font-weight: var(--gui-text-font-weight-semi-bold);
  --gui-label-font-family: var(--gui-font-family-default);

  /* LINKS */
  --gui-link-color: var(--gui-color-primary);
  --gui-link-hover-color: var(--gui-color-primary-active);
  --gui-link-text-decoration: none;
  --gui-link-font-size: var(--gui-text-font-size-medium);

  /* LINE HEIGHT */
  --gui-text-line-height-extra-small: 16px;
  --gui-text-line-height-small: 18px;
  --gui-text-line-height-medium: 22px;
  --gui-text-line-height-large: 24px;
  --gui-text-line-height-extra-large: 28px;

  --gui-h1-line-height: 56px;
  --gui-h1-line-height-mobile: 40px;
  --gui-h2-line-height: 42px;
  --gui-h2-line-height-mobile: 32px;
  --gui-h3-line-height: 32px;
  --gui-h3-line-height-mobile: 26px;
  --gui-h4-line-height: 26px;
  --gui-h4-line-height-mobile: 22px;
  --gui-h5-line-height: 20px;
  --gui-h5-line-height-mobile: 18px;
  --gui-h6-line-height: 18px;
  --gui-h6-line-height-mobile: 16px;

  --gui-modal-backdrop-color: rgba(var(--gui-rgb-color-secondary), 0.8);
}

body {
  font-family: var(--gui-font-family-default);
  background-color: var(--gui-color-background-default-high);
}

wc-button[color=secondary] {
  --wc-button-color: var(--gui-text-color);
}