////////////////////////////////////////////////////////////////////////////////
//
//  Licensed to the Apache Software Foundation (ASF) under one or more
//  contributor license agreements.  See the NOTICE file distributed with
//  this work for additional information regarding copyright ownership.
//  The ASF licenses this file to You under the Apache License, Version 2.0
//  (the "License"); you may not use this file except in compliance with
//  the License.  You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
//  Unless required by applicable law or agreed to in writing, software
//  distributed under the License is distributed on an "AS IS" BASIS,
//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//  See the License for the specific language governing permissions and
//  limitations under the License.
//
////////////////////////////////////////////////////////////////////////////////

=jewel-bg-border($state, $bg-color, $outlined: false, $unboxed: false, $bg-border-radius: 0px)
	@if ($state == "normal")
		@if $outlined
			background: rgba($bg-color, 0.05)
			border: 1px solid darken($bg-color, 10%)
			box-shadow: none
		@else if $unboxed
			background: rgba($bg-color, 0)
			border: 1px solid transparent
			box-shadow: none
		@else
			@if $flat
				background: $bg-color
				border: 1px solid darken($bg-color, 8%)
				box-shadow: none
			@else
				background: linear-gradient(lighten($bg-color, 5%), darken($bg-color, 5%))
				border: 1px solid darken($bg-color, 15%)
				box-shadow: inset 0 1px 0 lighten($bg-color, 20%)
			border-radius: $bg-border-radius
	
	@else if ($state == "hover")
		@if $outlined
			background: rgba($bg-color, .15)
			border: 1px solid darken($bg-color, 15%)
		@else if $unboxed
			background: rgba($bg-color, .15)
			border: 1px solid transparent
		@else
			@if $flat
				background: darken($bg-color, 5%)
				border: 1px solid darken($bg-color, 8%)
			@else
				background: linear-gradient($bg-color, darken($bg-color, 10%))
				border: 1px solid darken($bg-color, 20%)
	
	@else if ($state == "active") or ($state == "selected")
		@if $outlined
			background: rgba($bg-color, .25)
			border: 1px solid darken($bg-color, 18%)
			box-shadow: none
		@else if $unboxed
			background: rgba($bg-color, .25)
			border: 1px solid transparent
			box-shadow: none
		@else
			@if $flat
				background: darken($bg-color, 15%)
				border: 1px solid darken($bg-color, 8%)
				box-shadow: none
			@else
				background: linear-gradient(darken($bg-color, 10%), darken($bg-color, 20%))
				border: 1px solid darken($bg-color, 30%) 
				box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5)

	@else if ($state == "focus")
		@if $outlined
			border: 1px solid darken($bg-color, 20%)
			box-shadow: none
		@else if $unboxed
			background: rgba($bg-color, .15)
			border: 1px solid transparent
			box-shadow: none
		@else
			@if $flat
				background: lighten($bg-color, 5%)
				border: 1px solid darken($bg-color, 8%)
				box-shadow: none
			@else
				border: 1px solid darken($bg-color, 15%)
				box-shadow: inset 0px 0px 0px 1px rgba(lighten($bg-color, 50%), .5), inset 0 1px 0 rgba(lighten($bg-color, 55%), .6)
	
	@else if ($state == "disabled")
		@if $outlined
			background: rgba($disabled-color, 0.1) !important
			border: 1px solid $disabled-border-color !important
		@else if $unboxed
			background: rgba($disabled-color, 0) !important
			border: 1px solid transparent !important
		@else
			@if $flat
				background: $disabled-color !important
				border: 1px solid $disabled-border-color !important
			@else
				background: $disabled-color !important
				border: 1px solid $disabled-border-color !important
			box-shadow: none !important


=button-theme($button-color, $text-color, $outlined: false, $unboxed: false)
	
	+jewel-bg-border("normal", $button-color, $outlined, $unboxed, $button-border-radius)
	
	@if $outlined or $unboxed
		color: darken($button-color, 15%)
	@else
		color: $text-color
	
	@if not $outlined and not $unboxed and not $flat and $text-color == $font-theme-color
		text-shadow: 0 -1px 0 rgba(darken($button-color, 30%), .7)
	@else
		text-shadow: none
	
	&:hover, &:hover:focus
		+jewel-bg-border("hover", $button-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($button-color, 25%)
		@else
			color: $text-color
	
	&:active, &:active:focus
		+jewel-bg-border("active", $button-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($button-color, 25%)
		@else
			color: $text-color
	
	&:focus
		+jewel-bg-border("focus", $button-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($button-color, 25%)
		@else
			color: $text-color
	
	&[disabled]
		+jewel-bg-border("disabled", $button-color, $outlined, $unboxed)
		color: $disabled-font-color
		text-shadow: unset

		&:hover, &:hover:focus
			color: $disabled-font-color


=togglebutton-theme($togglebutton-color, $text-color, $outlined: false, $unboxed: false)
	
	+jewel-bg-border("normal", $togglebutton-color, $outlined, $unboxed, $togglebutton-border-radius)
	
	@if $outlined or $unboxed
		color: darken($togglebutton-color, 15%)
	@else
		color: $text-color
	
	@if not $outlined and not $unboxed and not $flat and $text-color == $font-theme-color
		text-shadow: 0 -1px 0 rgba(darken($togglebutton-color, 30%), .7)
	@else
		text-shadow: none

	&:hover, &:hover:focus
		+jewel-bg-border("hover", $togglebutton-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($togglebutton-color, 25%)
		@else
			color: $text-color
	&:active, &:active:focus
		+jewel-bg-border("active", $togglebutton-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($togglebutton-color, 25%)
		@else
			color: $text-color

	&:focus
		+jewel-bg-border("focus", $togglebutton-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($togglebutton-color, 25%)
		@else
			color: $text-color
		
	&[disabled]
		+jewel-bg-border("disabled", $togglebutton-color, $outlined, $unboxed)
		color: $disabled-font-color
		text-shadow: unset
	
	&.selected
		+jewel-bg-border("selected", $togglebutton-color, $outlined, $unboxed)
		@if $outlined or $unboxed
			color: darken($togglebutton-color, 25%)
		@else
			color: $text-color
