/*
 *
 *  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.
 *
 */

@namespace "library://ns.adobe.com/flex/spark";

/*
Default Mobile Flex skins and styles. Defaults sizes are based on
application-dpi=240.
*/

ActionBar
{
    chromeColor: #484848;
    defaultButtonAppearance: normal;
    skinClass: ClassReference("spark.skins.mobile.ActionBarSkin");
    textShadowAlpha: .65;
    textShadowColor: #000000;
    paddingBottom: 1;
    paddingLeft: 0;
    paddingRight: 0;
    paddingTop: 1;
}

ActionBar.beveled
{
    paddingLeft: 7;
    paddingRight: 7;
    titleAlign: center;
}

ActionBar #titleDisplay
{
    color: #FFFFFF;
    fontSize: 28;
    fontWeight: bold;
}

ActionBar ButtonBase
{
    color: #FFFFFF;
}

ActionBar Group#navigationGroup Button
{
    skinClass: ClassReference("spark.skins.mobile.TransparentNavigationButtonSkin");
}

ActionBar Group#navigationGroup Button.emphasized
{
    skinClass: ClassReference("spark.skins.mobile.DefaultTransparentNavigationButtonSkin");
}

ActionBar.beveled Group#navigationGroup Button
{
    fontSize: 18;
    skinClass: ClassReference("spark.skins.mobile.BeveledBackButtonSkin");
}

ActionBar.beveled Group#navigationGroup Button.emphasized
{
    skinClass: ClassReference("spark.skins.mobile.DefaultBeveledBackButtonSkin");
}

ActionBar Group#actionGroup Button
{
    skinClass: ClassReference("spark.skins.mobile.TransparentActionButtonSkin");
}

ActionBar Group#actionGroup Button.emphasized
{
    skinClass: ClassReference("spark.skins.mobile.DefaultTransparentActionButtonSkin");
}

ActionBar.beveled Group#actionGroup Button
{
    fontSize: 18;
    skinClass: ClassReference("spark.skins.mobile.BeveledActionButtonSkin");
}

ActionBar.beveled Group#actionGroup Button.emphasized
{
    skinClass: ClassReference("spark.skins.mobile.DefaultBeveledActionButtonSkin");
}

BusyIndicator
{
    rotationInterval: 50;
}

Button
{
    fontWeight: "bold";
    skinClass: ClassReference("spark.skins.mobile.ButtonSkin");
}

Button.emphasized
{
    skinClass: ClassReference("spark.skins.mobile.DefaultButtonSkin");
}

ButtonBar
{
    fontWeight: "bold";
    skinClass: ClassReference("spark.skins.mobile.ButtonBarSkin");
}

ButtonBase
{
    iconPlacement: "left";
}

Callout
{
    backgroundColor: #484848;
    contentBackgroundAppearance: inset;
    contentBackgroundColor: #FFFFFF;
    gap: 12;
    skinClass: ClassReference("spark.skins.mobile.CalloutSkin");
}

Callout ViewNavigator
{
    skinClass: ClassReference("spark.skins.mobile.CalloutViewNavigatorSkin");
}

Callout ViewNavigator ActionBar
{
    skinClass: ClassReference("spark.skins.mobile.CalloutActionBarSkin");
    defaultButtonAppearance: beveled;
    paddingLeft: 0;
    paddingRight: 0;
}

Callout ViewNavigator ActionBar.beveled
{
    paddingLeft: 0;
    paddingRight: 0;
}

Callout ViewNavigator ActionBar.beveled Group#navigationGroup Button
{
    skinClass: ClassReference("spark.skins.mobile.BeveledActionButtonSkin");
}

Callout ViewNavigator ActionBar.beveled Group#navigationGroup Button.emphasized
{
    skinClass: ClassReference("spark.skins.mobile.DefaultBeveledActionButtonSkin");
}

Callout#viewNavigatorPopUp
{
    contentBackgroundAppearance: none;
}

CheckBox
{
    skinClass: ClassReference("spark.skins.mobile.CheckBoxSkin");
}

DateSpinner
{
	skinClass: ClassReference("spark.skins.mobile.DateSpinnerSkin");    
}

HScrollBar
{
    skinClass: ClassReference("spark.skins.mobile.HScrollBarSkin");
}

HSlider
{
    skinClass: ClassReference("spark.skins.mobile.HSliderSkin");
}

IconItemRenderer
{
    paddingBottom: 12;
    paddingTop: 12;
    horizontalGap: 10;
    verticalGap: 9;
    iconDelay: 500;
    messageStyleName: "iconItemRendererMessageStyle";
}

.iconItemRendererMessageStyle
{
    fontSize: 20;
    color: #333333;
}

Image
{
    skinClass: ClassReference("spark.skins.mobile.ImageSkin");
    enableLoadingState: false;
    showErrorSkin : false;
    smoothingQuality: "default";
}

LabelItemRenderer
{
    paddingBottom: 24;
    paddingLeft: 15;
    paddingRight: 15;
    paddingTop: 24;
    verticalAlign: "middle";
}

List
{
    skinClass: ClassReference("spark.skins.mobile.ListSkin");
    borderColor: #000000;
    borderAlpha: 1;
    verticalScrollPolicy: on;
    borderVisible: false;
}

RadioButton
{
    skinClass: ClassReference("spark.skins.mobile.RadioButtonSkin");
}

Scroller
{
    touchDelay: 100;
}

SkinnableContainer
{
    backgroundColor: #FFFFFF;
    skinClass: ClassReference("spark.skins.mobile.SkinnableContainerSkin");
}

SkinnableTextBase:normalWithPrompt 
{
    fontStyle: normal;
}

SkinnableTextBase:disabledWithPrompt 
{
    fontStyle: normal;
}

SpinnerList
{
	skinClass: ClassReference("spark.skins.mobile.SpinnerListSkin");
}

SpinnerListContainer
{
	skinClass: ClassReference("spark.skins.mobile.SpinnerListContainerSkin");    
}

SpinnerListItemRenderer
{
	paddingTop : 18;
	paddingBottom : 18;
	paddingLeft : 16;
	paddingRight : 16;
}

SplitViewNavigator
{
	skinClass: ClassReference("spark.skins.mobile.SplitViewNavigatorSkin");
    backgroundColor: #000000;
}

TabbedViewNavigatorApplication
{
    backgroundColor: #FFFFFF;
    skinClass: ClassReference("spark.skins.mobile.TabbedViewNavigatorApplicationSkin");
}

TabbedViewNavigator
{
    skinClass: ClassReference("spark.skins.mobile.TabbedViewNavigatorSkin");
}

TabbedViewNavigator #tabBar
{
    chromeColor: #484848;
    color: #FFFFFF;
    fontSize: 20;
    fontWeight: normal;
    iconPlacement: top;
    interactionMode: mouse;
    skinClass: ClassReference("spark.skins.mobile.TabbedViewNavigatorTabBarSkin");
    textShadowAlpha: .65;
    textShadowColor: #000000;
}

TextArea
{
    paddingBottom: 9;
    paddingLeft: 9;
    paddingRight: 9;
    paddingTop: 9;
    showPromptWhenFocused: true;
    skinClass: ClassReference("spark.skins.mobile.StageTextAreaSkin");
}

TextArea VScrollBar
{
    skinClass: ClassReference("spark.skins.mobile.TextAreaVScrollBarSkin");
}

TextArea HScrollBar
{
    skinClass: ClassReference("spark.skins.mobile.TextAreaHScrollBarSkin");
}

TextInput
{
    paddingBottom: 9;
    paddingLeft: 9;
    paddingRight: 9;
    paddingTop: 9;
    showPromptWhenFocused: true;
    skinClass: ClassReference("spark.skins.mobile.StageTextInputSkin");
}

ToggleSwitch
{
    accentColor: #3F7FBA;
    color: #FFFFFF;
    fontSize: 27;
    skinClass: ClassReference("spark.skins.mobile.ToggleSwitchSkin");
    slideDuration: 125;
    textShadowAlpha: .65;
    textShadowColor: #000000;
}

View
{
    backgroundColor: #FFFFFF;
    skinClass: ClassReference("spark.skins.mobile.SkinnableContainerSkin");
}

ViewMenu
{
    skinClass: ClassReference("spark.skins.mobile.ViewMenuSkin");
}

ViewMenuItem
{ 
    iconPlacement : "top";
    chromeColor : #FFFFFF;
    paddingBottom: 8;
    paddingLeft: 8;
    paddingRight: 8;
    paddingTop: 8;
    skinClass : ClassReference("spark.skins.mobile.ViewMenuItemSkin");
}

ViewNavigator
{
    skinClass: ClassReference("spark.skins.mobile.ViewNavigatorSkin");
}

ViewNavigatorApplication
{
    backgroundColor: #FFFFFF;
    skinClass: ClassReference("spark.skins.mobile.ViewNavigatorApplicationSkin");
}

VScrollBar
{
    skinClass: ClassReference("spark.skins.mobile.VScrollBarSkin");
}

global
{
    /* framework styles */
    modalTransparency: 0;
    modalTransparencyBlur: 0;
    
    /* Looks */
    backgroundAlpha : 1;
    backgroundImageFillMode : "scale";
    borderVisible : true;
    borderWeight : 1;
    contentBackgroundColor: #F0F0F0;
    downColor: #E0E0E0; /* set in here and not in framework's default.css because it only is really applicable for touch interactions*/
    selectionColor: #E0E0E0;
    alternatingItemColors: #FFFFFF;
    focusThickness: 3;
    symbolColor: #000000;
    fontLookup: "embeddedCFF";
    fontFamily: "_sans";
    fontSize: 24;
    color: #000000;
    textShadowColor: #FFFFFF;
    textShadowAlpha: .55;
    
    /* Behaviors */
    autoThumbVisibility: true;
    fixedThumbSize: false;
    fullScreenHideControlsDelay: 3000;
    interactionMode: "touch";
    liveDragging: true;
    rollOverOpenDelay: 200;
    slideDuration: 300;
    smoothScrolling: true;
    touchDelay: 0; /* default to 0 here, but Scroller sets it to 100 */
}

@media (application-dpi: 160)
{
    ActionBar
    {
        paddingBottom: 1;
        paddingLeft: 0;
        paddingRight: 0;
        paddingTop: 1;
    }
    
    ActionBar.beveled
    {
        paddingLeft: 5;
        paddingRight: 5;
    }
    
    ActionBar #titleDisplay
    {
        fontSize: 18;
    }
    
    ActionBar.beveled Group#navigationGroup Button
    {
        fontSize: 12;
    }
    
    ActionBar.beveled Group#actionGroup Button
    {
        fontSize: 12;
    }
    
    Callout
    {
        gap: 8;
    }
    
    IconItemRenderer
    {
        paddingBottom: 8;
        paddingTop: 8;
        horizontalGap: 8;
        verticalGap: 6;
    }
    
    .iconItemRendererMessageStyle
    {
        fontSize: 14;
    }
    
    LabelItemRenderer
    {
        paddingBottom: 16;
        paddingLeft: 10;
        paddingRight: 10;
        paddingTop: 16;
    }
    
	SpinnerListItemRenderer
	{
		paddingTop : 12;
		paddingBottom : 12;
		paddingLeft : 8;
		paddingRight : 8;
	}
	
    TextArea
    {
        paddingBottom: 6;
        paddingLeft: 6;
        paddingRight: 6;
        paddingTop: 6;
    }
    
    TextInput
    {
        paddingBottom: 6;
        paddingLeft: 6;
        paddingRight: 6;
        paddingTop: 6;
    }
    
    TabbedViewNavigator #tabBar
    {
        fontSize: 14;
    }
    
    ToggleSwitch
    {
        fontSize: 18;
    }
    
    global
    {
        fontSize: 16;
        focusThickness: 2;
    }
}

@media (application-dpi: 320)
{
    ActionBar
    {
        paddingBottom: 2;
        paddingLeft: 0;
        paddingRight: 0;
        paddingTop: 2;
    }
    
    ActionBar.beveled
    {
        paddingLeft: 10;
        paddingRight: 10;
    }
    
    ActionBar #titleDisplay
    {
        fontSize: 36;
    }
    
    ActionBar.beveled Group#navigationGroup Button
    {
        fontSize: 24;
    }
    
    ActionBar.beveled Group#actionGroup Button
    {
        fontSize: 24;
    }
    
    Callout
    {
        gap: 16;
    }
    
    IconItemRenderer
    {
        paddingBottom: 16;
        paddingTop: 16;
        horizontalGap: 16;
        verticalGap: 12;
    }
    
    .iconItemRendererMessageStyle
    {
        fontSize: 26;
    }
    
    LabelItemRenderer
    {
        paddingBottom: 32;
        paddingLeft: 20;
        paddingRight: 20;
        paddingTop: 32;  
    }
    
	SpinnerListItemRenderer
	{
		paddingTop : 24;
		paddingBottom : 24;
		paddingLeft : 24;
		paddingRight : 24;
	}
	
    TextArea
    {
        paddingBottom: 12;
        paddingLeft: 12;
        paddingRight: 12;
        paddingTop: 12;
    }
    
    TextInput
    {
        paddingBottom: 12;
        paddingLeft: 12;
        paddingRight: 12;
        paddingTop: 12;
    }
    
    TabbedViewNavigator #tabBar
    {
        fontSize: 28;
    }
    
    ToggleSwitch
    {
        fontSize: 36;
    }
    
    global
    {
        fontSize: 32;
    }
}

@media (application-dpi: 160) AND (os-platform:"IOS")
{
    TextArea
    {
        leading: 1.5;
        paddingRight: 1.5;
    }
}

@media (application-dpi: 320) AND (os-platform:"IOS")
{
    TextArea
    {
        leading: 4.5;
        paddingRight: 3;
    }
}