// Theme Conditionals
// ==================

@mixin on-theme($theme) {
	@at-root {

		@if $theme == light {
			.light & {
				@content;
			}
		}

		@if $theme == dark {
			.dark & {
				@content;
			}
		}

		@if $theme == light-n-dark {
			.light &,
			.dark & {
				@content;
			}
		}

		@if $theme == light-iOS7 {
			.light.ios7 & {
				@content;
			}
		}

		@if $theme == not-iOS7 {
			:not(.ios7) & {
				@content;
			}
		}
	}
}

// Based on the themes from _theme-switcher.js

// light
// =====

$light-text-color:    #444;
$light-active-item:   #4889ea;
$light-bg-color-1:    #e9e9ea;
$light-bg-color-2:    darken($light-bg-color-1, 10%);
$light-bars-bg-color: $light-bg-color-1;
$light-bar-color:     #f8f8f8;

// dark
// ====

$dark-bg-color-1:     #22242b;
$dark-bg-color-2:     #292c33;
$dark-bg-color-3:     darken($dark-bg-color-1, 5%);
$dark-line-color-1:   $dark-bg-color-1;
$dark-line-color-2:   darken($dark-line-color-1, 5%);
$dark-text-color-1:   #95a1bc;
$dark-text-color-2:   #5e6b86;
$dark-active-color-1: #0084ff;
$dark-active-color-2: #404654;
$dark-label-color-1:  #b37bcf;
$dark-label-color-2:  #c16d7b;
$dark-label-color-3:  #86b476;
$dark-button-bg:      #3f4551;
$dark-button-text:    #a4acba;
