/* /assets/css/schema.css */
/*
    This file holds the main variables for the light
    and dark schemes. It also holds the variables for
    Non-Scheme Specific Colours.

    There should be no need to edit these colours.
    Edit the colours in the theme files.
*/

/* ******************* Light Scheme ******************* */
:root {
    --general-background-light:          var(--color-light);
    --general-text-light:                var(--color-5);
    --general-border-light:              var(--color-5);

/* general button colours */
    --button-background-light:           var(--color-2);
    --button-text-light:                 var(--color-light);
    --button-border-light:               var(--color-8);
    --button-focus-background-light:     var(--colour-light);
    --button-focus-text-light:           var(--color-2);
    --button-focus-border-light:         var(--color-2);

/* Colours for second button in a row */
    --button2-background-light:           var(--color-2);
    --button2-text-light:                 var(--color-light);
    --button2-border-light:               var(--color-8);
    --button2-focus-background-light:     var(--color-light);
    --button2-focus-text-light:           var(--color-2);
    --button2-focus-border-light:         var(--color-2);

/* link colours */
    --general-link-text-light:             var(--color-2);
    --general-link-background-light:       transparent;
    --general-link-focus-text-light:       var(--color-2);
    --general-link-focus-background-light: transparent;
    --general-link-focus-border-light:     var(--color-7);

/* colours for menu/nav buttons/links */
    --link-menu-background-light:        var(--color-light);
    --link-menu-text-light:              var(--color-5);
    --link-menu-focus-text-light:        var(--color-3);
    --link-menu-focus-background-light:  var(--color-light);
    --link-menu-focus-border-light:      var(--color-5);

    --input-background-light:            var(--color-4);
    --input-text-light:                  var(--color-5);
    --input-placeholder-light:           var(--color-8);
    --input-border-light:                var(--color-8);
    --input-focus-background-light:      var(--color-4);
    --input-focus-text-light:            var(--color-3);
    --input-focus-border-light:          var(--color-7);

    --toggle-background-light:           var(--color-8);
    --toggle-dot-off-light:              var(--color-off);
    --toggle-dot-on-light:               var(--color-on);
    --toggle-icon-light:                 var(--color-light);
    --toggle-inner-border-light:         var(--color-light);
    --toggle-focus-border-light:         var(--colour-7);

    --checkbox-radio-background-light:   var(--color-light);
    --checkbox-radio-check-light:        var(--color-5);
    --checkbox-radio-border-light:       var(--color-5);
    --checkbox-radio-focus-border-light: var(--color-7);

    --image-link-bordered-light:         var(--color-4);
    --image-link-focus-border-light:     var(--color-5);

    --icon-button-focus-border-light:    var(--color-5);

    --card-background-light:             var(--color-4);
    --card-text-light:                   var(--color-5);
    --card-border-light:                 var(--color-5);
}

/* ******************* Dark Scheme ******************* */
:root {
    --general-background-dark:          var(--color-5);
    --general-text-dark:                var(--color-4);
    --general-border-dark:              var(--color-4);

    --button2-background-dark:           var(--color-4);
    --button2-text-dark:                 var(--color-5);
    --button2-border-dark:               var(--color-5);
    --button2-focus-background-dark:     var(--color-1);
    --button2-focus-text-dark:           var(--color-4);
    --button2-focus-border-dark:         var(--color-5);

    --button-background-dark:           var(--color-5);
    --button-text-dark:                 var(--color-4);
    --button-border-dark:               var(--color-4);
    --button-focus-background-dark:     var(--color-4);
    --button-focus-text-dark:           var(--color-5);
    --button-focus-border-dark:         var(--color-5);

    --general-link-text-dark:             var(--color-4);
    --general-link-background-dark:       transparent;
    --general-link-focus-text-dark:       var(--color-1);
    --general-link-focus-background-dark: transparent;
    --general-link-focus-border-dark:     var(--color-4);

    --link-menu-text-dark:              var(--color-4);
    --link-menu-focus-text-dark:        var(--color-4);
    --link-menu-focus-background-dark:  transparent;
    --link-menu-focus-border-dark:      var(--color-4);

    --input-background-dark:            var(--color-4);
    --input-text-dark:                  var(--color-dark);
    --input-placeholder-dark:           var(--color-8);
    --input-border-dark:                var(--color-8);
    --input-focus-background-dark:      var(--color-4);
    --input-focus-text-dark:            var(--color-dark);
    --input-focus-border-dark:          var(--color-1);

    --toggle-background-dark:           var(--color-4);
    --toggle-dot-off-dark:              var(--color-off);
    --toggle-dot-on-dark:               var(--color-on);
    --toggle-icon-dark:                 var(--color-light);
    --toggle-inner-border-dark:         var(--color-light);
    --toggle-focus-border-dark:         var(--color-light);

    --checkbox-radio-background-dark:   var(--color-light);
    --checkbox-radio-check-dark:        var(--color-dark);
    --checkbox-radio-inner-border-dark: var(--color-4);
    --checkbox-radio-focus-border-dark: var(--color-light);

    --image-link-focus-border-dark:     var(--color-light);

    --icon-button-focus-border-dark:    var(--color-light);

    --card-background-dark:             var(--color-3);
    --card-text-dark:                   var(--color-4);
    --card-border-dark:                 var(--color-4);
}

/* Non-Scheme Specific */
:root {
/* Skip Link */
    --skip-background:	        var(--color-9);
    --skip-text:		        var(--color-dark);
    --skip-border:	            var(--color-dark);

/* Warning */
    --warning-background:       var(--color-10);
    --warning-text:	            var(--color-off);
    --warning-border:		    var(--color-off);

/* New Banner */
    --news-banner-background:   var(--color-11);
    --news-banner-text:         var(--color-3);
}