:root {
--client-name: 'Lake Country Youth Soccer Association';
--client-image: url("https://prod-assets.demosphere.com/17spezbyeieu3/brand/66f48808274b2b9fbe3f1dae.1729634273133.png?versionId=eosNPHp7221yeRRA8b_2Kp_GjviJf9Aw") no-repeat;
--client-avatar: url("https://prod-assets.demosphere.com/17spezbyeieu3/brand/client.logo.66f48808274b2b9fbe3f1dae.1729634219024.png?versionId=sWDgK.DR.gp9bC9WxZZNdM7vHWuZq1aZ") no-repeat;
--client-primary: #d64e0e;
--client-secondary: #ffffff;
--client-primary-darken: rgb(200, 73, 13);
--client-primary-lighten: rgb(240, 93, 24);
--client-sign-in-primary: #144781;
--client-sign-in-secondary: #0d2f55;
}
:root {
  --color-client-25: #fbf7f6;
  --color-client-50: #fbf3f1;
  --color-client-100: #f3e4df;
  --color-client-200: #f3cabb;
  --color-client-300: #e6a690;
  --color-client-400: #d07250;
  --color-client-500: #d64e0e;
  --color-client-600: #b62f00;
  --color-client-700: #911700;
  --color-client-800: #6a0600;
  --color-client-900: #4f0500;
  --color-client-950: #2f0000;
  --color-client-header: #d64e0e;
  --color-client-selected: #fa6f3a;
  --color-client-hover: #f27648;
  --color-client-text: #fff1de;
  --color-client-footer: #a53e12;

  /* OKLCH values for modern browsers */
  --color-client-25-oklch: oklch(0.98 0.004385678342889105 40.16419939158743);
  --color-client-50-oklch: oklch(0.97 0.00877135668577821 40.16419939158743);
  --color-client-100-oklch: oklch(0.93 0.01754271337155642 40.16419939158743);
  --color-client-200-oklch: oklch(0.87 0.05116624733370623 40.16419939158743);
  --color-client-300-oklch: oklch(0.78 0.08223146892917071 40.16419939158743);
  --color-client-400-oklch: oklch(0.65 0.12791561833426554 40.16419939158743);
  --color-client-500-oklch: oklch(0.6019818139012353 0.18273659762037936 40.16419939158743);
  --color-client-600-oklch: oklch(0.5116845418160499 0.18273659762037936 40.16419939158743);
  --color-client-700-oklch: oklch(0.42138726973086466 0.16446293785834143 40.16419939158743);
  --color-client-800-oklch: oklch(0.3310899976456794 0.1370524482152845 40.16419939158743);
  --color-client-900-oklch: oklch(0.27089181625555586 0.10964195857222761 40.16419939158743);
  --color-client-950-oklch: oklch(0.18059454417037057 0.09136829881018968 40.16419939158743);
  --color-client-header-oklch: oklch(0.6019818139012353 0.18273659762037936 40.16419939158743);
  --color-client-selected-oklch: oklch(0.7019818139012353 0.18273659762037936 40.16419939158743);
  --color-client-hover-oklch: oklch(0.7019818139012353 0.16446293785834143 40.16419939158743);
  --color-client-text-oklch: oklch(1 0.06578517514333657 40.16419939158743);
  --color-client-footer-oklch: oklch(0.5019818139012353 0.1461892780963035 40.16419939158743);
}

@supports (color: oklch(0 0 0)) {
  :root {
    --color-client-25: var(--color-client-25-oklch);
    --color-client-50: var(--color-client-50-oklch);
    --color-client-100: var(--color-client-100-oklch);
    --color-client-200: var(--color-client-200-oklch);
    --color-client-300: var(--color-client-300-oklch);
    --color-client-400: var(--color-client-400-oklch);
    --color-client-500: var(--color-client-500-oklch);
    --color-client-600: var(--color-client-600-oklch);
    --color-client-700: var(--color-client-700-oklch);
    --color-client-800: var(--color-client-800-oklch);
    --color-client-900: var(--color-client-900-oklch);
    --color-client-950: var(--color-client-950-oklch);
    --color-client-header: var(--color-client-header-oklch);
    --color-client-selected: var(--color-client-selected-oklch);
    --color-client-hover: var(--color-client-hover-oklch);
    --color-client-text: var(--color-client-text-oklch);
    --color-client-footer: var(--color-client-footer-oklch);
  }
}
:root {
  --color-client-secondary-25: #f8f8f8;
  --color-client-secondary-50: #f5f5f5;
  --color-client-secondary-100: #e8e8e8;
  --color-client-secondary-200: #d4d4d4;
  --color-client-secondary-300: #b7b7b7;
  --color-client-secondary-400: #8f8f8f;
  --color-client-secondary-500: #ffffff;
  --color-client-secondary-600: #cecece;
  --color-client-secondary-700: #9e9e9e;
  --color-client-secondary-800: #717171;
  --color-client-secondary-900: #555555;
  --color-client-secondary-950: #2e2e2e;
  --color-client-secondary-header: #ffffff;
  --color-client-secondary-selected: #ffffff;
  --color-client-secondary-hover: #ffffff;
  --color-client-secondary-text: #ffffff;
  --color-client-secondary-footer: #dedede;

  /* OKLCH values for modern browsers */
  --color-client-secondary-25-oklch: oklch(0.98 0 0);
  --color-client-secondary-50-oklch: oklch(0.97 0 0);
  --color-client-secondary-100-oklch: oklch(0.93 0 0);
  --color-client-secondary-200-oklch: oklch(0.87 0 0);
  --color-client-secondary-300-oklch: oklch(0.78 0 0);
  --color-client-secondary-400-oklch: oklch(0.65 0 0);
  --color-client-secondary-500-oklch: oklch(1.0000000000000002 0 0);
  --color-client-secondary-600-oklch: oklch(0.8500000000000002 0 0);
  --color-client-secondary-700-oklch: oklch(0.7000000000000001 0 0);
  --color-client-secondary-800-oklch: oklch(0.5500000000000002 0 0);
  --color-client-secondary-900-oklch: oklch(0.4500000000000001 0 0);
  --color-client-secondary-950-oklch: oklch(0.30000000000000004 0 0);
  --color-client-secondary-header-oklch: oklch(1.0000000000000002 0 0);
  --color-client-secondary-selected-oklch: oklch(1 0 0);
  --color-client-secondary-hover-oklch: oklch(1 0 0);
  --color-client-secondary-text-oklch: oklch(1 0 0);
  --color-client-secondary-footer-oklch: oklch(0.9000000000000002 0 0);
}

@supports (color: oklch(0 0 0)) {
  :root {
    --color-client-secondary-25: var(--color-client-secondary-25-oklch);
    --color-client-secondary-50: var(--color-client-secondary-50-oklch);
    --color-client-secondary-100: var(--color-client-secondary-100-oklch);
    --color-client-secondary-200: var(--color-client-secondary-200-oklch);
    --color-client-secondary-300: var(--color-client-secondary-300-oklch);
    --color-client-secondary-400: var(--color-client-secondary-400-oklch);
    --color-client-secondary-500: var(--color-client-secondary-500-oklch);
    --color-client-secondary-600: var(--color-client-secondary-600-oklch);
    --color-client-secondary-700: var(--color-client-secondary-700-oklch);
    --color-client-secondary-800: var(--color-client-secondary-800-oklch);
    --color-client-secondary-900: var(--color-client-secondary-900-oklch);
    --color-client-secondary-950: var(--color-client-secondary-950-oklch);
    --color-client-secondary-header: var(--color-client-secondary-header-oklch);
    --color-client-secondary-selected: var(--color-client-secondary-selected-oklch);
    --color-client-secondary-hover: var(--color-client-secondary-hover-oklch);
    --color-client-secondary-text: var(--color-client-secondary-text-oklch);
    --color-client-secondary-footer: var(--color-client-secondary-footer-oklch);
  }
}