:root {
  /* Core backgrounds */
  --background-gradient:              linear-gradient(180deg, #171c30 0%, #16254c 100%);

  /* Icon theming */
  --icon-colour:                      #f37100; 
  --icon-stroke-width:                3;
  --icon-fill-colour:                 transparent;
  --icon-background-colour:           transparent; 
  --icon-border-colour:               #ffffff; 

  /* Text */
  --header-text-colour:               #ffffff;
  --default-text-colour:              #ffffff; 
  --sub-text-colour:                  #ffffff; 
  --text-accent-colour:               #f37100; 
  --faq-paragraph-text-colour:        #00c0ff;  

  /* Cards */
  --card-background-colour:           #16254c; 
  --card-border-colour:               #1f7694; 
  --faq-divider-colour:               #1f7694; 

  /* Rules card */
  --rules-card-background-colour:     #16254c; 
  --rules-card-text-colour:           #ffffff; 
  --rules-card-icon-colour:           #f37100; 

  /* Terms & Conditions */
  --tcs-background-colour:            #16254c; 
  --tcs-border-colour:                #1f7694; 
  --tcs-text-colour:                  #ffffff; 
  --tcs-icon-colour:                  #f37100; 
  --tcs-disabled-button-colour:       #16254c; 
  --tcs-button-colour:                #1f7694; 
  --tcs-button-text-colour:           #ffffff;
  --tcs-checkbox-bg-colour:           #1f7694; 
  --tcs-checkbox-text-colour:         #ffffff;
  --tcs-checkbox-border-colour:       #1f7694; 
  --tcs-checkbox-focus-ring-colour:   #f37100; 
  --tcs-checkbox-accent-colour:       #1f7694; 
  --tcs-checkbox-focus-accent-colour: #00c0ff; 
  --tcs-section-colour:               #16254c;
  --tcs-section-header-colour:        #ffffff;
  --tcs-section-text-colour:          #ffffff;
  --tcs-section-divider-colour:       #f37100;


    /* Micros Menu*/
  --menu-card-gradient-start:        #f37100; 
  --menu-card-gradient-end:          #512cd4; 
  --menu-card-background-colour:      #16254c; 
  --menu-card-border-colour:          #1f7694; 
  --menu-accent-colour-start:         #f37100; 
  --menu-accent-colour-end:           #512cd4; 
  --menu-button-gradient-text-colour: #ffffff;
  --menu-button-gradient-start:       #f37100; 
  --menu-button-gradient-end:         #512cd4; 
  --menu-button-animated-border:      #f37100;
        /* menu states */
       --menu-entries-available-text-colour:     #ffffff;
       --menu-entries-available-background-colour:#1f7694; 
       --menu-entries-unavailable-text-colour:     #ffffff;
       --menu-entries-unavailable-background-colour:#f37100; 
       --menu-can-claim-background-colour:#f37100; 
       --menu-can-not-claim-background-colour:#f32400; 
       --menu-reference-text-colour:    #ffffff; 
       --menu-reference-background-colour:#16254c;  

  /* E-Draw*/
  --draw-card-gradient-start:        #f37100; 
  --draw-card-gradient-end:          #512cd4; 
  --draw-card-background-colour:      #16254c; 
  --draw-card-border-colour:          #1f7694; 
  --draw-accent-colour-start:         #f37100; 
  --draw-accent-colour-end:           #512cd4; 
  --draw-button-gradient-text-colour: #ffffff;
  --draw-button-gradient-start:       #f37100; 
  --draw-button-gradient-end:         #512cd4; 
  --draw-button-animated-border:      #f37100;
        /* Edraw states */
       --draw-entries-available-text-colour:     #ffffff;
       --draw-entries-available-background-colour:#1f7694; 
       --draw-entries-unavailable-text-colour:     #ffffff;
       --draw-entries-unavailable-background-colour:#f37100; 
       --draw-can-claim-background-colour:#f37100; 
       --draw-can-not-claim-background-colour:#f32400; 
       --draw-reference-text-colour:    #ffffff; 
       --draw-reference-background-colour:#16254c;  


  /* Vouchers */
    /* Voucher cards */
    --voucher-card-gradient-start:        #f37100; 
    --voucher-card-gradient-end:          #512cd4; 
    --voucher-card-background-colour:   #16254c; 
    --voucher-card-border-colour:       #1f7694; 
    --voucher-accent-colour-start:      #f37100; 
    --voucher-accent-colour-end:        #512cd4; 
    --voucher-button-gradient-text-colour:#ffffff;
    --voucher-button-gradient-start:    #f37100; 
    --voucher-button-gradient-end:      #512cd4; 
    --voucher-button-animated-border:   #512cd4;
      /* Voucher states */
       --voucher-redeemed-text-colour:     #ffffff;
       --voucher-redeemed-background-colour:#1f7694; 
       --voucher-not-used-text-colour:     #ffffff;
       --voucher-not-used-background-colour:#f37100; 
       --voucher-can-claim-background-colour:#f37100; 
       --voucher-can-not-claim-background-colour:#f32400; 
       --voucher-reference-text-colour:    #ffffff; 
       --voucher-reference-background-colour:#16254c;  


    /* Free Drink(s) Crads */
  --free-drink-card-gradient-start: #b01917;
  --free-drink-card-gradient-end:   #5a0c0a;
  --free-drink-card-background-colour: #e5c15b10;
  --free-drink-card-border-colour: #ff3c2f;
  --free-drink-accent-colour-start: #ffcf4a;
  --free-drink-accent-colour-end:   #f5a623;
  --free-drink-button-gradient-text-colour: #ffffff;
  --free-drink-button-gradient-start: #ffd24d;
  --free-drink-button-gradient-end:   #a87818;
  --free-drink-button-animated-border: #ffea7a;
  --free-drink-button-disabled-start: #6b7280;
  --free-drink-button-disabled-end:   #4b5563; 
  --free-drink-button-disabled-text:  #d1d5db;
  --free-drink-button-redeem-start: #f37100;
  --free-drink-button-redeem-end:   #512cd4; 
  --free-drink-button-redeem-text:  #ffffff; 

        /* Free Drink(s) states */
       --free-drink-entries-available-text-colour:     #ffffff;
       --free-drink-entries-available-background-colour:#1f7694; 
       --free-drink-entries-unavailable-text-colour:     #ffffff;
       --free-drink-entries-unavailable-background-colour:#f37100; 
       --free-drink-can-play-background-colour:#f37100; 
       --free-drink-can-not-play-background-colour:#f32400; 
       --free-drink-reference-text-colour:    #ffffff; 
       --free-drink-reference-background-colour:#16254c;
       --free-drink-redeemed-text-colour:     #ffffff;
       --free-drink-redeemed-background-colour:#1f7694; 
       --free-drink-not-used-text-colour:     #ffffff;
       --free-drink-not-used-background-colour:#f37100; 


           /* Service(s) Crads */
  --services-card-gradient-start: #b01917;
  --services-card-gradient-end:   #5a0c0a;
  --services-card-background-colour: #e5c15b10;
  --services-card-border-colour: #ff3c2f;
  --services-accent-colour-start: #ffcf4a;
  --services-accent-colour-end:   #f5a623;
  --services-button-gradient-text-colour: #ffffff;
  --services-button-gradient-start: #ffd24d;
  --services-button-gradient-end:   #a87818;
  --services-button-animated-border: #ffea7a;
  --services-button-disabled-start: #6b7280;
  --services-button-disabled-end:   #4b5563; 
  --services-button-disabled-text:  #d1d5db;
  --services-button-redeem-start: #f37100;
  --services-button-redeem-end:   #512cd4; 
  --services-button-redeem-text:  #ffffff; 

        /* Service(s) states */
       --services-entries-available-text-colour:     #ffffff;
       --services-entries-available-background-colour:#1f7694; 
       --services-entries-unavailable-text-colour:     #ffffff;
       --services-entries-unavailable-background-colour:#f37100; 
       --services-can-play-background-colour:#f37100; 
       --services-can-not-play-background-colour:#f32400; 
       --services-reference-text-colour:    #ffffff; 
       --services-reference-background-colour:#16254c;
       --services-redeemed-text-colour:     #ffffff;
       --services-redeemed-background-colour:#1f7694; 
       --services-not-used-text-colour:     #ffffff;
       --services-not-used-background-colour:#f37100; 

  /* Buttons */
  --button-gradient-text-colour:      #ffffff;
  --button-gradient-start:            #f37100; 
  --button-gradient-end:              #512cd4; 
  --button-animated-border:           #f37100; 

    /* Refresh button */
  --refresh-button-gradient-text-colour:      #ffffff;
  --refresh-button-gradient-start:            #512cd4; 
  --refresh-button-gradient-end:              #171c30; 

  /* FAQ Menu button */
  --faq-button-gradient-text-colour:  #ffffff;
  --faq-button-gradient-start:        #f37100; 
  --faq-button-gradient-end:          #512cd4; 
  --faq-button-animated-border:       #f37100; 

  /* Loader */
  --loader-text-colour:               #ffffff; 
  --loader-border-colour:             #1f7694; 
  --loader-spin-colour:               #f37100; 
}
