# 
# ***** BEGIN LICENSE BLOCK *****
# Zimbra Collaboration Suite Web Client
# Copyright (C) 2010, 2011, 2012, 2013, 2014, 2016 Synacor, Inc.
#
# This program is free software: you can redistribute it and/or modify it under
# the terms of the GNU General Public License as published by the Free Software Foundation,
# version 2 of the License.
#
# This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY;
# without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
# See the GNU General Public License for more details.
# You should have received a copy of the GNU General Public License along with this program.
# If not, see <https://www.gnu.org/licenses/>.
# ***** END LICENSE BLOCK *****
# 
##########################################################################
#                            Skin Substitutions                          #
#------------------------------------------------------------------------#
#
#  Add or change entries below to customize this skin.  
#     See:  http://wiki.zimbra.com/?title=Themes
#
#  NOTE: Substitutions that begin and end with "_" (eg: "AppC") 
#  should only be used within this file -- never in a CSS or HTML file
#
#========================================================================#


SkinName		= serenity
SkinVersion		= 1.0.0

#########################################################################
#						Logo Licensing Rules							#
#-----------------------------------------------------------------------#
#
#  If you are using the Zimbra Collaboration Suite (ZCS) under the 
#  open source license, and you have not modifed the software, 
#  then you are required to use the Zimbra logo (the default). 
#
#	LogoImgDir		= /zimbra/skins/_base/logos
#	LogoURL			= https://www.zimbra.com
#
#-------------------------------------------------------------------------
#  If you are using ZCS under the open source license, 
#  and you have modified the software, 
#  then you are required to use the Zimbra Inside logo. 
#
#	LogoImgDir		= /zimbra/skins/_base/logos/ZimbraInside
#	LogoURL			= https://www.zimbra.com
#
#-------------------------------------------------------------------------
#  If you are using ZCS under the network (commercial) license, 
#  then you are welcome to use your own logo in place of the Zimbra logo,
#  or to retain the original Zimbra logo. 
#
#	LogoImgDir		= /zimbra/skins/@SkinName@/logos
#	LogoURL			= http://www.yourcompany.com
#
#========================================================================#

LogoImgDir					= @AppContextPath@/skins/serenity/logos
LogoURL						= https://www.zimbra.com

SkinImgDir					= @AppContextPath@/skins/@SkinName@/img
SkinAnimatedImgDir			= @AppContextPath@/img/animated
ImgDir						= @AppContextPath@/img
DwtImgDir					= @AppContextPath@/img/dwt

AppBannerImg				= @LogoImgDir@/AppBannerWhite.png
AppBannerWidth				= 300px
AppBannerHeight				= 35px
AppBanner					= @img(, AppBannerImg, 300px, 35px)@; background-position:center left;

AppTabRoundCorners			= @roundCorners(3px 3px 0 0)@
SkinBorderAppToolbar		= @ToolbarContainer@ border-color:@darken(AppC,55)@; border-width:1px 0 0 1px;
AppTabBorder-selected		= @MediumOutsetBorder@ @AppTabBottomBorder@ background-color:@lighten(AppC, 27)@;

##########################################################################
#                               Skin Colors                              #
#------------------------------------------------------------------------#
#
AppC						= #CECECE
AltC						= #DDD
SelC						= #C1DFFE
TxtC						= #333

PanelColor					= white
bgC							= transparent
viewC						= #FCFCFC

SerenityAppC				= #EEEEEE
SerenityAltC				= #0095D3

#========================================================================#


#####################
# Login & Splash
#####################

LoginColor					= @darken(AppC,55)@
SplashColor					= @darken(AppC,55)@
MastheadColor				= @darken(AppC,55)@
AppBg						= background-color:#E7E9EE;

DecorOpacity 				= @opacity(30)@
DecorImg					= @SkinImgDir@/Decoration.png
Decor1						= @DecorOpacity@ @img(, DecorImg, 500px, 100px)@

LoginContentC1				= @SerenityAltC@
LoginContentC2				= @darken(SerenityAltC,33)@
LoginContentGrad			= @grad(LoginContentC1,LoginContentC2,linear-vertical)@
LoginContentBox				= @LoginContentGrad@ background-color:@LoginContentC2@; padding-top:10px;
LoginH1						= margin:0 30px 30px; overflow:hidden;
LoginAppName				= display:none;
LoginLabelColor				= white
LoginBannerImg				= @LogoImgDir@/LoginBanner.png
LoginBanner					= @img(, LoginBannerImg, 440px, 60px)@

LoginBkgdC1					= @lighten(SerenityAppC,55)@
LoginBkgdC2					= @darken(SerenityAppC,7)@
LoginBkgdGrad				= @grad(LoginBkgdC1,LoginBkgdC2,linear-vertical)@
LoginScreen					= @LoginBkgdGrad@ background-color:@LoginBkgdC2@; 

ButtonColorTop				= @lighten(SerenityAppC,75)@
ButtonColorBottom			= @lighten(SerenityAppC,10)@
LoginButtonBkgd				= @grad(ButtonColorTop,ButtonColorBottom,linear-vertical)@
LoginButtonShadow			= @cssShadow@:0px 1px 3px rgba(50, 50, 50, 0.75);
LoginButtonRounding			= @roundCorners(3px)@
LoginButton					= @LoginButtonBkgd@ @LoginButtonShadow@ @LoginButtonRounding@ border:1px solid @ButtonBorderColor@; border-collapse:separate;
LoginFooterColor			= color:@darken(SerenityAppC,55)@;
LoginErrorPanel				= background-color:#FF9; padding:5px; @roundCorners(8px)@


################
#    ABOUT
################
AboutBannerImg				= @LogoImgDir@/AboutBanner.png
AboutBanner					= @img(, AboutBannerImg, 400px, 30px)@

################
#    TOASTER
################
ToastText					= font-size:13px; font-weight:bold; text-align:center; color:@darken(AltC,90)@; margin-top:-1px; padding-left:21px;
ToastColor					= #FFF6BF
ToastOpacity				= @opacity(95)@
ToastRadius					= @tlRadius@:5px; @trRadius@:5px; @brRadius@:5px; @blRadius@:5px;
ToastBorder					= box-shadow:0px 0px 10px @ToastColor@; @cssShadow@:0 0 10px @ToastColor@;
ToastBackground				= background-color:@ToastColor@;
ToastContainer				= @ToastRadius@ @ToastBorder@ @ToastBackground@ @ToastOpacity@ margin-top:6px;
ToastContent				= padding:0.25em .75em;


#####################
#	Fonts
#####################

FontFamily-default			= font-family:Arial;
FontFamily-fixed			= font-family:Arial;
FontFamily-html				= font-family:Arial;

FontSize-normal				= font-size:12px;

VertSeparator				= width:1px; background-color:white; @opacity(50)@

################
#    TEXT
################
SkinElementAlign			= align:center; vertical-align:top; valign:top;
SkinTextUsername			= color:white; text-align:center; overflow:hidden;
SkinTextHelp				= color:white; text-align:center; overflow:hidden;


#####################
# Logical zones in the skin
#####################

ChromeBg					= background-color:@bgC@;

##########################################################################
#                            Skin Panel Sizing                           #
#------------------------------------------------------------------------#
#
TopHeight					= 42px
AppTopHeight				= 27px
AppFooterHeight				= 24px
TreeStartWidth				= 220px
ToolStartWidth				= 20px
ToolMaxWidth                = 220px
ToolMinWidth				= 20px
#========================================================================#


AppPanelBorderC				= #AAA

######################
# App Panel Tops
######################
AppTopBorder				= border:1px solid @AppPanelBorderC@;
AppTopBg					= @grad(#ECECEC,#C1C1C1)@
AppTopRound					= @roundCorners(5px 5px 0 0)@
AppTop						= @AppTopBorder@ @AppTopBg@ @AppTopRound@ height:@AppTopHeight@;

######################
# App Panel Middles
######################
AppMiddleBorder				= border:solid @AppPanelBorderC@; border-width:0 1px;
AppMiddleBg					= background-color:white;
AppMiddleSize				= height:100%; width:100%;
AppMiddle  					= @AppMiddleBorder@ @AppMiddleBg@ @AppMiddleSize@

######################
# App Panel Footers
######################
AppFooterBorder				= border:1px solid @AppPanelBorderC@;
AppFooterBg					= background-color:#E7E7E7;
AppFooterRound				= @roundCorners(0 0 5px 5px)@
AppFooter 					= height:@AppFooterHeight@; @AppFooterBorder@ @AppFooterBg@ @AppFooterRound@ 

#####################
#	Normal button, like in a dialog
#####################
ButtonBorderColor			= white

