'use strict';

var index = {
  colorScheme: {
    light: {
      nav: {
        background: '{surface.0}',
        borderColor: '{surface.200}'
      },
      header: {
        borderColor: '{surface.200}',
        activeBorderColor: '{primary.color}',
        color: '{surface.500}',
        hoverColor: '{surface.700}',
        activeColor: '{primary.color}'
      },
      navigatorIcon: {
        background: '{surface.0}',
        color: '{surface.500}',
        hoverColor: '{surface.700}',
        boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)'
      },
      content: {
        background: '{surface.0}',
        color: '{surface.700}'
      }
    },
    dark: {
      nav: {
        background: '{surface.900}',
        borderColor: '{surface.700}'
      },
      header: {
        borderColor: '{surface.700}',
        activeBorderColor: '{primary.color}',
        color: '{surface.400}',
        hoverColor: '{surface.0}',
        activeColor: '{primary.color}'
      },
      navigatorIcon: {
        background: '{surface.900}',
        color: '{surface.400}',
        hoverColor: '{surface.0}',
        boxShadow: '0px 0px 10px 50px color-mix(in srgb, {surface.900}, transparent 50%)'
      },
      content: {
        background: '{surface.900}',
        color: '{surface.0}'
      }
    }
  }
};

module.exports = index;
