/**
 * Easybet.no Widget Theme
 * 
 * Blue-based color scheme used by the Easybet.no widget application.
 * This file provides both light and dark variants for development testing.
 */

.saas-theme--easybet-light {
  /* Easybet specific overrides */
  --SaasGoodBetGreen: #22ff0080;
  --SaasGoodBetText: #000;
  --SaasGoodPredictionGreen: #21703a;
  --SaasMatchLineBg: #c8dcf0;
  --SaasTournamentLineBg: #aacdec;
  --SaasTournamentText: #002060;
  --SaasTournamentTableBG: #dceaf7;

  /* Accent colors - keeping consistent with main app */
  --SaasAccentBlue: #1677ad;
  --SaasAccentDarkGreen: #21703a;
  --SaasAccentGreen: #21703a;
  --SaasAccentLightGreen: #21703a;
  --SaasAccentMidDarkGreen: #0a7d1d;
  --SaasAccentRed: #db0000;
  --SaasAccentDarkRed: #d93333;
  --SaasAccentYellow: #eedc06;
  --SaasAccentDarkYellow: #eedb06cb;
  --SaasAccentDarkestYellow: #8b5a2b;

  /* Easybet blue-based element colors */
  --SaasElement01: #aacdec;
  --SaasElement02: #aacdec;
  --SaasElement03: #aacdec;
  --SaasElement03WithOpacity: #aacdec50;
  --SaasElement04: #dceaf7;
  --SaasElement05: #dceaf7;
  --SaasElement06: #dceaf7;
  --SaasElement07: #f0faff;
  --SaasElement08: #f0faff;
  --SaasElement09: #f0faff;
  --SaasElement10: #f0faff;
  --SaasElementDropdown: #002060;
  --SaasElementOdd: #f0faff;

  /* Easybet gradients */
  --SaasGradientBackground01: linear-gradient(180deg, #aacdec, #dceaf7);
  --SaasGradientBackground02: linear-gradient(180deg, #dceaf7, #f0faff);
  --SaasGradientBackground03: linear-gradient(
    270deg,
    rgba(0, 32, 96, 0) 0%,
    rgba(0, 32, 96, 0.1) 50%,
    rgba(0, 32, 96, 0) 100%
  );
  --SaasGradientBackground04: linear-gradient(
    90.06deg,
    #aacdec -3.49%,
    #dceaf7 49.21%,
    #aacdec 103.49%
  );
  --SaasGradientBackground05: linear-gradient(
    270deg,
    rgba(170, 205, 236, 0) 0%,
    #dceaf7 50%,
    rgba(170, 205, 236, 0) 100%
  );

  /* Easybet text colors */
  --SaasText01: #002060;
  --SaasText02: #5e6775;
  --SaasText03: #002060;
  --SaasText04: #002060;
  --SaasTextBlack: #000;
  --SaasTextWhite: #fff;
  --SaasIconFilter: grayscale(100%);
  --SaasIconOdds: white;
  --SaasShadow:
    0px 8px 22px -6px rgba(0, 32, 96, 0.12),
    0px 14px 64px -4px rgba(0, 32, 96, 0.12);
  --SaasLive01: #002060;
  --SaasLive02: #aacdec;
  --SaasLive03: #002060;
  --SaasLive04: #dceaf7;

  /* Radix/shadcn compatibility */
  --foreground: #002060;
  --background: #aacdec;
  --popover: #dceaf7;
  --accent: #f0faff;
  --border: #dceaf7;
  --muted: #aacdec;
  --input: #dceaf7;
}

.saas-theme--easybet-dark {
  /* Easybet specific overrides */
  --SaasGoodBetGreen: #0e6b45;
  --SaasGoodBetText: #fff;
  --SaasGoodPredictionGreen: #3fcb66;
  --SaasMatchLineBg: #083da7;
  --SaasTournamentLineBg: #002060;
  --SaasTournamentText: #dceaf7;
  --SaasTournamentTableBG: #002878;

  /* Accent colors - keeping consistent with main app */
  --SaasAccentBlue: #32b5ff;
  --SaasAccentDarkGreen: #21703a;
  --SaasAccentGreen: #3fcb66;
  --SaasAccentLightGreen: #24ff00;
  --SaasAccentMidDarkGreen: #0a7d1d;
  --SaasAccentRed: #db0000;
  --SaasAccentDarkRed: #d93333;
  --SaasAccentYellow: #eedc06;
  --SaasAccentDarkYellow: #eedb06cb;
  --SaasAccentDarkestYellow: #eedc06;

  /* Easybet blue-based element colors (dark) */
  --SaasElement01: #0f144b;
  --SaasElement02: #0f144b;
  --SaasElement03: #0f144b;
  --SaasElement03WithOpacity: #0f144b50;
  --SaasElement04: #002878;
  --SaasElement05: #002878;
  --SaasElement06: #002878;
  --SaasElement07: #0070c0;
  --SaasElement08: #0070c0;
  --SaasElement09: #0070c0;
  --SaasElement10: #0070c0;
  --SaasElementDropdown: #0f144b;
  --SaasElementOdd: #fff;

  /* Easybet gradients (dark) */
  --SaasGradientBackground01: linear-gradient(180deg, #002060, #002878);
  --SaasGradientBackground02: linear-gradient(180deg, #002878, #0070c0);
  --SaasGradientBackground03: linear-gradient(
    270deg,
    rgba(0, 32, 96, 0) 0%,
    rgba(0, 32, 96, 0.5) 50%,
    rgba(0, 32, 96, 0) 100%
  );
  --SaasGradientBackground04: linear-gradient(
    90.06deg,
    rgba(0, 32, 96, 0.1) 0.05%,
    rgba(0, 112, 192, 0.1) 25.02%,
    rgba(220, 234, 247, 0.1) 52.08%,
    rgba(0, 112, 192, 0.1) 77.58%,
    rgba(0, 32, 96, 0.1) 99.95%
  );
  --SaasGradientBackground05: linear-gradient(
    270deg,
    rgba(0, 40, 120, 0) 0%,
    #002878 50%,
    rgba(0, 40, 120, 0) 100%
  );

  /* Easybet text colors (dark) */
  --SaasText01: #dceaf7;
  --SaasText02: #97a19e;
  --SaasText03: #dceaf7;
  --SaasText04: #dceaf7;
  --SaasTextBlack: #000;
  --SaasTextWhite: #ffffff;
  --SaasIconFilter: invert(1) grayscale(100%) contrast(1) brightness(3);
  --SaasIconOdds: black;
  --SaasShadow:
    0px 8px 22px -6px rgba(0, 32, 96, 0.45),
    0px 14px 64px -4px rgba(0, 32, 96, 0.35);
  --SaasLive01: #0070c0;
  --SaasLive02: #002878;
  --SaasLive03: #dceaf7;
  --SaasLive04: #002878;

  /* Radix/shadcn compatibility */
  --foreground: #dceaf7;
  --background: #0f144b;
  --popover: #002878;
  --accent: #0070c0;
  --border: #002878;
  --muted: #002060;
  --input: #002878;
}
