/*
	Default colour scheme
 */
:root,
:root.light {
	/* --- BRAND COLOURS --- */
	--dark-green                     : #718B4B;
	--dark-purple                    : #6E6290;
	--light-green                    : #AFD080;
	--light-purple                   : #9A90B8;
	--lightest-purple                : #E0D4FF;
	--lightest-green                 : #E2EF9E;
	--lightest-yellow                : #9E9C69;


	/* --- BASE PALETTE --- */
	--main-background                : #ECECE2;
	--main-text                      : #655C53;
	--main-border                    : #718B4B;
	--main-shadow                    : #756C63;
	--main-headline                  : var(--dark-purple);
	--receipt-headline               : var(--dark-purple);

	--link-text                      : var(--dark-purple);
	--link-hover                     : #6E6290;
	--highlight-link-text            : #009AD6;
	--highlight-link-hover           : #009AD6;
	--highlight-background           : yellow;

	--alt-background                 : white;
	--selection-background           : var(--dark-purple);
	--selection-text                 : white;

	--messagebox-text                : var(--main-text);
	--messagebox-background          : var(--header-background);
	--messagebox-title               : var(--main-text);
	--messagebox-border              : var(--main-border);
	--messagebox-shadow              : var(--main-shadow);

	--contrast-main                  : var(--dark-purple);
	--contrast-light                 : #FFC66D;
	--contrast-low                   : #565A5D;
	--contrast-opposite              : #629755;

	--warning                        : #CC0000;
	--warning-background             : white;
	--notification                   : var(--dark-green);
	--notification-background        : var(--header-background);
	--required                       : var(--dark-purple);
	--error                          : #990000;
	--disabled                       : var(--main-text);

	--dark-border                    : #4A4A4A;
	--dark-shadow                    : #333333;
	--dark-background                : #2B2B2B;
	--dark-text                      : #2B2B2B;

	--table-border                   : #AAAAAA;
	--table-background               : white;
	--table-header-background        : #DDDDDD;
	--table-cell-label               : #EEEEEE;
	--table-cell-value               : white;
	--table-hover                    : #DADEDF;
	--table-highlight                : #F1F1F1;

	/* --- FORM ELEMENTS --- */
	--input-placeholder              : #6A6A6A;
	--input-background               : white;
	--input-highlight                : #718B4B;

	--button-text                    : white;
	--button-background              : #6E6290;
	--button-hover-text              : white;
	--button-hover-background        : #718B4B;
	--button-okay                    : #007B47;
	--button-cancel                  : #CC0000;
	--button-disabled                : #ECECE2;

	/* --- CHROME ELEMENTS --- */
	--header-background              : white;
	--header-text                    : var(--main-text);
	--footer-background              : white;
	--footer-text                    : var(--main-text);

	/* --- IMAGE VIEWER --- */
	--image-viewer-border            : #CCCCCC;
	--image-viewer-background        : #AAAAAA;

	--detail-summary-text            : #6E6290;
	--detail-button-text             : white;
	--detail-button-background       : var(--dark-purple);
	--detail-button-hover-text       : white;
	--detail-button-hover-background : var(--light-purple);

	/* --- BASKET DISPLAY --- */
	--basket-header-background       : #AAAAAA;
	--basket-header-text             : #333333;
	--basket-border                  : var(--dark-green);

	/* --- VOUCHER OFFER DISPLAY --- */
	--offer-border                   : var(--main-border);
	--offer-background               : #AAAAAA;
	--offer-headline                 : white;
	--offer-text                     : white;

	/* --- THEME SWITCH ICONS --- */
	--theme-dark-icon                : url('/images/lightbulb.png');
	--theme-light-icon               : url('/images/lightbulb_off.png');

	/* --- SEARCH ICON --- */
	--search-icon                    : url('/images/search_icon.png');
	--search-icon-hover              : url('/images/search_icon_hover.png');
	--simple-search-label            : black;
	--simple-search-label-background : white;

	/* --- MODAL DIALOGS --- */
	--modal-close-button-color       : white;
	--modal-background               : black;
	--bounceEasing                   : cubic-bezier(0.51, 0.92, 0.24, 1.15);

	/* --- FOCUS STYLES --- */
	--focus-text                     : white;
	--focus-background               : var(--dark-purple);


	/* --- BANNERS --- */
	--banner-border                  : var(--dark-green);
	--banner-background              : var(--header-background);
}

/*
	Default dark colour scheme
 */
:root.dark {
	/* --- BRAND COLOURS --- */
	--dark-green                     : #718B4B;
	--dark-purple                    : #6E6290;
	--light-green                    : #AFD080;
	--light-purple                   : #9A90B8;
	--lightest-purple                : #E0D4FF;
	--lightest-green                 : #E2EF9E;

	/* --- BASE PALETTE --- */
	--main-background                : #3C3F41;
	--main-text                      : #A9B7C6;
	--main-border                    : #718B4B;
	--main-shadow                    : #756C63;
	--main-headline                  : var(--lightest-purple);
	--receipt-headline               : var(--dark-purple);

	--link-text                      : #FFC66D;
	--link-hover                     : #FFC66D;
	--highlight-link-text            : red;
	--highlight-link-hover           : red;
	--highlight-text                 : var(--main-background);
	--highlight-background           : yellow;

	--alt-background                 : var(--input-background);
	--selection-background           : var(--dark-purple);
	--selection-text                 : white;

	--messagebox-text                : var(--main-text);
	--messagebox-background          : var(--header-background);
	--messagebox-title               : var(--main-text);
	--messagebox-border              : var(--main-border);
	--messagebox-shadow              : var(--header-background);

	--contrast-main                  : var(--lightest-purple);
	--contrast-light                 : #FFC66D;
	--contrast-low                   : #565A5D;
	--contrast-opposite              : #629755;

	--warning                        : #FF8E8E;
	--warning-background             : var(--header-background);
	--notification                   : var(--dark-green);
	--notification-background        : var(--header-background);
	--required                       : var(--lightest-green);
	--error                          : #990000;
	--disabled                       : var(--main-text);

	--dark-border                    : #4A4A4A;
	--dark-shadow                    : #333333;
	--dark-background                : #2B2B2B;
	--dark-text                      : #2B2B2B;

	--table-border                   : #AAAAAA;
	--table-background               : var(--header-background);
	--table-header-background        : var(--main-background);
	--table-header-text              : var(--main-text);
	--table-cell-label               : var(--header-background);
	--table-cell-value               : var(--main-background);
	--table-hover                    : #444444;
	--table-highlight                : #F1F1F1;

	/* --- FORM ELEMENTS --- */
	--input-placeholder              : #6A6A6A;
	--input-background               : #222222;
	--input-background-focus         : #222222;
	--input-text                     : var(--main-text);
	--input-text-focus               : var(--main-text);
	--input-border                   : #EEEEEE;
	--input-highlight                : var(--link-text);

	--button-text                    : white;
	--button-background              : var(--dark-purple);
	--button-hover-text              : white;
	--button-hover-background        : var(--light-purple);
	--button-okay                    : #007B47;
	--button-cancel                  : #CC0000;
	--button-disabled-background     : transparent;

	/* ---CHROME ELEMENTS --- */
	--header-background              : var(--input-background);
	--header-text                    : var(--main-text);
	--footer-background              : var(--input-background);
	--footer-text                    : white;

	/* --- IMAGE VIEWER --- */
	--image-viewer-border            : var(--main-border);
	--image-viewer-background        : var(--alt-background);

	--detail-summary-text            : #6E6290;
	--detail-button-text             : white;
	--detail-button-background       : var(--dark-purple);
	--detail-button-hover-text       : white;
	--detail-button-hover-background : var(--light-purple);

	/* --- BASKET DISPLAY --- */
	--basket-header-background       : #AAAAAA;
	--basket-header-text             : #333333;
	--basket-border                  : var(--main-border);

	/* --- VOUCHER OFFER DISPLAY --- */
	--offer-border                   : var(--main-border);
	--offer-background               : #AAAAAA;
	--offer-headline                 : white;
	--offer-text                     : white;

	/* --- THEME SWITCH ICONS --- */
	--theme-dark-icon                : url('/images/lightbulb.png');
	--theme-light-icon               : url('/images/lightbulb_off.png');

	/* --- SEARCH ICON --- */
	--search-icon                    : url('/images/search_icon_dark.png');
	--search-icon-hover              : url('/images/search_icon_dark_hover.png');
	--simple-search-label            : white;
	--simple-search-label-background : black;

	/* --- MODAL DIALOGS --- */
	--modal-close-button-color       : white;
	--modal-background               : black;
	--bounceEasing                   : cubic-bezier(0.51, 0.92, 0.24, 1.15);

	/* --- FOCUS STYLES --- */
	--focus-text                     : black;
	--focus-background               : white;

	/* --- BANNERS --- */
	--banner-border                  : var(--dark-green);
	--banner-background              : var(--header-background);
}
