tdesktop/Telegram/Resources/basic.style

/*
This file is part of Telegram Desktop,
the official desktop version of Telegram messaging app, see https://telegram.org

Telegram Desktop 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, either version 3 of the License, or
(at your option) any later version.

It 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.

In addition, as a special exception, the copyright holders give permission
to link the code of portions of this program with the OpenSSL library.

Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE
Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
*/
using "colors.palette";

using "basic_types.style";

semibold: "Open Sans Semibold";

fsize: 13px;
normalFont: font(fsize);
semiboldFont: font(fsize semibold);

emojiImgSize: 18px; // exceptional value for retina
emojiSize: 18px;
emojiPadding: 0px;

lineWidth: 1px;

labelDefFlat: flatLabel {
	font: font(fsize);
	width: 0px;
	maxHeight: 0px;
	align: align(left);
	textFg: windowTextFg;
}

boxVerticalMargin: 10px;
boxWidth: 320px;
boxWideWidth: 364px;
boxPadding: margins(26px, 30px, 34px, 8px);
boxMaxListHeight: 600px;
boxFontSize: 14px;
boxTextFont: font(boxFontSize);
boxLittleSkip: 10px;
boxMediumSkip: 20px;

boxTitleFont: font(boxFontSize bold);
boxTitlePosition: point(26px, 28px);
boxTitleHeight: 54px;

boxButtonFont: font(boxFontSize semibold);
defaultBoxButton: RoundButton {
	textFg: #2f9fea;
	textFgOver: #2f9fea;
	secondaryTextFg: #2f9fea;
	secondaryTextFgOver: #2f9fea;
	textBg: boxBg;
	textBgOver: lightButtonBgOver;

	width: -24px;
	height: 36px;
	padding: margins(0px, 0px, 0px, 0px);

	textTop: 8px;
	downTextTop: 9px;

	font: boxButtonFont;
}
cancelBoxButton: RoundButton(defaultBoxButton) {
	textFg: #aeaeae;
}
attentionBoxButton: RoundButton(defaultBoxButton) {
	textFg: #ea4b2f;
	textFgOver: #ea4b2f;
	textBgOver: #fff0ed;
}
boxButtonPadding: margins(12px, 16px, 22px, 16px);
defaultBoxLinkButton: linkButton {
	color: #0080c0;
	overColor: #0080c0;
	downColor: #0073ad;
	font: boxTextFont;
	overFont: font(boxFontSize underline);
}
redBoxLinkButton: linkButton(defaultBoxLinkButton) {
	color: #d15948;
	overColor: #d15948;
	downColor: #db6352;
}
boxLabel: flatLabel(labelDefFlat) {
	font: font(boxFontSize);
	align: align(topleft);
}

defaultLeftOutlineButton: OutlineButton {
	outlineWidth: 3px;
	outlineFg: windowBg;
	outlineFgOver: windowActiveBg;

	textBg: windowBg;
	textBgOver: #f2f7fa;

	textFg: windowActiveTextFg;
	textFgOver: windowActiveTextFg;

	font: normalFont;
	padding: margins(11px, 5px, 11px, 5px);
}
attentionLeftOutlineButton: OutlineButton(defaultLeftOutlineButton) {
	outlineFgOver: #e43f3f;

	textBgOver: #faf2f2;

	textFg: #d15948;
	textFgOver: #d15948;
}

defaultInputArea: InputArea {
	textBg: windowBg;
	textFg: windowTextFg;
	textMargins: margins(5px, 6px, 5px, 4px);

	placeholderFg: #999999;
	placeholderFgActive: #aaaaaa;
	placeholderMargins: margins(2px, 0px, 2px, 0px);
	placeholderAlign: align(topleft);
	placeholderShift: 50px;
	duration: 120;

	borderFg: #e0e0e0;
	borderFgActive: #62c0f7;
	borderFgError: #e48383;

	border: 1px;
	borderActive: 2px;
	borderError: 2px;

	font: boxTextFont;

	heightMin: 32px;
	heightMax: 128px;
}
defaultInputField: InputField {
	textBg: windowBg;
	textFg: windowTextFg;
	textMargins: margins(0px, 6px, 0px, 4px);
	textAlign: align(topleft);

	placeholderFg: #999999;
	placeholderFgActive: #aaaaaa;
	placeholderMargins: margins(2px, 0px, 2px, 0px);
	placeholderAlign: align(topleft);
	placeholderShift: 50px;
	duration: 120;

	borderFg: #e0e0e0;
	borderFgActive: #62c0f7;
	borderFgError: #e48383;

	border: 1px;
	borderActive: 2px;
	borderError: 2px;

	font: boxTextFont;

	height: 32px;
}
defaultCheckboxIcon: icon {{ "default_checkbox_check", windowActiveFg, point(4px, 7px) }};
defaultCheckbox: Checkbox {
	textFg: windowTextFg;
	textBg: windowBg;

	checkBg: #ffffff;
	checkFg: #b3b3b3;
	checkFgOver: #b3b3b3;
	checkFgActive: windowActiveBg;

	width: -44px;
	height: 22px;

	textPosition: point(32px, 2px);
	diameter: 22px;
	thickness: 2px;
	checkIcon: defaultCheckboxIcon;

	font: normalFont;
	duration: 120;
}
defaultBoxCheckbox: Checkbox(defaultCheckbox) {
	width: -46px;
	textPosition: point(34px, 1px);
	font: boxTextFont;
}
defaultRadiobutton: Radiobutton {
	textFg: windowTextFg;
	textBg: windowBg;

	checkBg: #ffffff;
	checkFg: #b3b3b3;
	checkFgOver: #bfbfbf;
	checkFgActive: #4eb3ee;

	width: -46px;
	height: 22px;

	textPosition: point(34px, 0px);
	diameter: 22px;
	thickness: 2px;
	checkSkip: 65px; // * 0.1

	font: boxTextFont;
	duration: 120;
}
solidScroll: flatScroll {
	barColor: #3f729734;
	bgColor: #214f751a;
	barOverColor: #3f729734;
	bgOverColor: #214f751a;

	minHeight: 20px;

	round: 2px;
	deltax: 5px;
	width: 14px;
	deltat: 6px;
	deltab: 6px;

	topsh: 0px;
	bottomsh: 0px;
	shColor: #00000012;

	duration: 150;
	hiding: 0;
}
defaultDropdownDuration: 150;
defaultDropdownPadding: margins(10px, 10px, 10px, 10px);
defaultDropdownShadow: icon {{ "dropdown_shadow", windowShadowFg }};
defaultDropdownShadowShift: 1px;

defaultTooltip: Tooltip {
	textBg: #eef2f5;
	textFg: #5d6c80;
	textFont: normalFont;
	textBorder: #c9d1db;
	textPadding: margins(5px, 2px, 5px, 2px);

	shift: point(-20px, 20px);
	skip: 10px;

	widthMax: 800px;
	linesMax: 12;
}

boxScroll: flatScroll(solidScroll) {
	round: 3px;
	width: 18px;
	deltax: 6px;
}
boxScrollSkip: 6px;
boxScrollShadowBg: #00000012;

statusFont: font(fsize);
statusFg: #999999;
statusFgActive: #0080c0;
statusFgTyping: statusFgActive;

versionColor: #777777;

shadowColor: #00000018;
shadowToggleDuration: 200;

slideDuration: 240;
slideShift: 100px;
slideFadeOutBg: #0000003c;
slideShadow: icon {{ "slide_shadow", windowShadowFg }};

btnYesColor: #0080c0;
btnYesHover: #0073ad;
btnNoColor: #8b8b8b;
btnNoHover: #777777;

linkCropLimit: 360px;
linkFont: normalFont;
linkOverFont: font(fsize underline);
btnDefLink: linkButton {
	color: btnYesColor;
	overColor: btnYesColor;
	downColor: btnYesHover;
	font: linkFont;
	overFont: linkOverFont;
}

inpDefFont: font(17px);
inpDefFlat: flatInput {
	textColor: #000000;
	bgColor: #ffffff;
	bgActive: #ffffff;
	width: 210px;
	height: 40px;
	align: align(left);
	textMrg: margins(5px, 5px, 5px, 5px);
	font: inpDefFont;
	cursor: cursor(text);

	borderWidth: 0px;
	borderColor: transparent;
	borderActive: transparent;
	borderError: transparent;

	phColor: #949494;
	phFocusColor: #aaaaaa;
	phAlign: align(left);
	phPos: point(2px, 0px);
	phShift: 50px;
	phDuration: 100;
}

inpDefGray: flatInput(inpDefFlat) {
	bgColor: #f2f2f2;
	borderWidth: 2px;
	borderColor: #f2f2f2;
	borderActive: #54c3f3;
	borderError: #ed8080;
	phColor: #808080;
}

scrollDef: flatScroll {
	barColor: #00000053;
	bgColor: #0000001a;
	barOverColor: #0000007a;
	bgOverColor: #0000002c;

	round: 2px;

	width: 10px;
	minHeight: 20px;
	deltax: 3px;
	deltat: 3px;
	deltab: 3px;

	topsh: 2px;
	bottomsh: 2px;
	shColor: #00000012;

	duration: 150;
	hiding: 1000;
}

dateRadius: 10px;
buttonRadius: 3px;

scrollCountries: flatScroll(scrollDef) {
	topsh: 0px;
	bottomsh: -2px;
}

lnkText: #0f7dc7;

boxShadow: icon {{ "box_shadow", windowShadowFg }};
boxShadowShift: 2px;

btnSelectSep: #e0e0e0;
btnRedLink: linkButton(btnDefLink) {
	color: #d15948;
	overColor: #d15948;
	downColor: #db6352;
}

countryRowHeight: 36px;
countryRowNameFont: semiboldFont;
countryRowNameFg: boxTextFg;
countryRowPadding: margins(22px, 9px, 8px, 0px);
countryRowCodeFont: font(fsize);
countryRowBg: windowBg;
countryRowBgOver: windowOverBg;
countryRowCodeFg: windowSubTextFg;
countryRowCodeFgOver: windowSubTextFgOver;
countriesSkip: 12px;
countriesScroll: flatScroll(boxScroll) {
	deltat: 9px;
	deltab: 3px;
}

setLittleSkip: 9px;
setScroll: flatScroll(scrollDef) {
	bottomsh: 0px;
	topsh: 0px;
}

noContactsHeight: 100px;
noContactsFont: font(fsize);
noContactsColor: #777777;

topBarHeight: 54px;
topBarDuration: 200;
topBarBackward: icon {{ "title_back", #a3a3a3 }};
topBarForwardAlpha: 0.6;
topBarBack: icon {{ "title_back", #259fd8 }};
topBarBackAlpha: 0.8;
topBarBackColor: #005faf;
topBarBackFont: font(16px);
topBarArrowPadding: margins(39px, 8px, 17px, 8px);
topBarMinPadding: 5px;
topBarButton: RoundButton {
	textFg: btnYesColor;
	textFgOver: btnYesColor;
	secondaryTextFg: btnYesColor;
	secondaryTextFgOver: btnYesColor;
	textBg: windowBg;
	textBgOver: #edf4f7;

	width: -22px;
	height: 28px;
	padding: margins(0px, 14px, 12px, 12px);

	textTop: 6px;
	downTextTop: 7px;

	font: font(fsize);
}
defaultActiveButton: RoundButton {
	textFg: activeButtonFg;
	textFgOver: activeButtonFgOver;
	secondaryTextFg: activeButtonSecondaryFg;
	secondaryTextFgOver: activeButtonSecondaryFgOver;
	textBg: activeButtonBg;
	textBgOver: activeButtonBgOver;

	secondarySkip: 7px;

	width: -34px;
	height: 34px;
	padding: margins(0px, 0px, 0px, 0px);

	textTop: 8px;
	downTextTop: 9px;

	font: semiboldFont;
}
defaultLightButton: RoundButton(defaultActiveButton) {
	textFg: lightButtonFg;
	textFgOver: lightButtonFgOver;
	textBg: lightButtonBg;
	textBgOver: lightButtonBgOver;
}
topBarClearButton: RoundButton(defaultLightButton) {
	width: -18px;
}
topBarActionSkip: 10px;

activeFadeInDuration: 500;
activeFadeOutDuration: 3000;

msgMaxWidth: 430px;
msgFont: font(fsize);
msgNameFont: semiboldFont;
msgServiceFont: semiboldFont;
msgServiceNameFont: semiboldFont;
msgServicePhotoWidth: 100px;
msgDateFont: font(13px);
msgMinWidth: 190px;
msgPhotoSize: 33px;
msgPhotoSkip: 40px;
msgPadding: margins(13px, 7px, 13px, 8px);
msgMargin: margins(13px, 10px, 53px, 2px);
msgMarginTopAttached: 3px;
msgLnkPadding: 2px; // for media open / save links
msgBorder: #f0f0f0;
msgInBg: #ffffff;
msgInBgSelected: #c2dcf2; // #358cd4 with 30% opacity
msgOutBg: #effdde;
msgOutBgSelected: #b7dbdb;
msgSelectOverlay: #358cd44c;
msgStickerOverlay: #358cd47f;
msgInServiceFg: #0e7acd;
msgInServiceFgSelected: #0e7acd;
msgOutServiceFg: #3a8e26;
msgOutServiceFgSelected: #367570;
msgShadow: 2px;
msgInShadow: #748ea229;
msgInShadowSelected: #548dbb29;
msgOutShadow: #3ac34740;
msgOutShadowSelected: #37a78e40;
msgInDateFg: #a0acb6;
msgInDateFgSelected: #6a9cc5;
msgOutDateFg: #6cc264;
msgOutDateFgSelected: #50a79c;

msgReplyPadding: margins(6px, 6px, 11px, 6px);
msgReplyBarPos: point(1px, 0px);
msgReplyBarSize: size(2px, 36px);
msgReplyBarSkip: 10px;
msgInReplyBarColor: #2fa9e2;
msgInReplyBarSelColor: #2fa9e2;
msgOutReplyBarColor: historyOutIconFg;
msgOutReplyBarSelColor: historyOutIconFgSelected;
msgImgReplyBarColor: #ffffff;

msgBotKbDuration: 200;
msgBotKbFont: semiboldFont;
msgBotKbOverBg: #ffffff1a;
msgBotKbIconPadding: 2px;
msgBotKbUrlIcon: icon {{ "inline_button_url", #ffffff }};
msgBotKbSwitchPmIcon: icon {{ "inline_button_switch", #ffffff }};
msgBotKbButton: botKeyboardButton {
	margin: 5px;
	padding: 10px;
	height: 36px;
	textTop: 8px;
	downTextTop: 9px;
}

msgServiceBg: #89a0b47f;
msgServiceSelectBg: #bbc8d4a2;
msgServiceColor: #ffffff;
msgServicePadding: margins(12px, 3px, 12px, 4px);
msgServiceMargin: margins(10px, 10px, 80px, 2px);

msgColor: #000000;
msgDateColor: #000000;
msgLinkColor: #2a6dc2;
msgPressedLinkColor: #004bad;
msgSkip: 40px;
msgPtr: 8px;

msgDateSpace: 12px;
msgDateDelta: point(2px, 5px);

msgDateImgDelta: 4px;
msgDateImgColor: #ffffff;
msgDateImgBg: #00000054;
msgDateImgBgOver: #00000074;
msgDateImgBgSelected: #1c4a7187;
msgDateImgPadding: point(8px, 2px);
msgDateImgCheckSpace: 4px;

defaultTextStyle: textStyle {
	linkFlags: font(fsize);
	linkFlagsOver: font(fsize underline);
	linkFg: btnYesColor;
	linkFgDown: btnYesHover;
	monoFg: #777777;
	selectBg: msgInBgSelected;
	selectOverlay: msgSelectOverlay;
	lineHeight: 0px;
}
boxTextStyle: textStyle(defaultTextStyle) {
	lineHeight: 22px;
}
serviceTextStyle: textStyle(defaultTextStyle) {
	linkFlags: msgServiceFont;
	linkFlagsOver: font(fsize semibold underline);
	linkFg: msgServiceColor;
	linkFgDown: msgServiceColor;
	monoFg: msgServiceColor;
	selectBg: msgServiceSelectBg;
	selectOverlay: msgServiceSelectBg;
}
inTextStyle: textStyle(defaultTextStyle) {
	monoFg: #4e7391;
	selectBg: msgInBgSelected;
	selectOverlay: msgSelectOverlay;
}
outTextStyle: textStyle(defaultTextStyle) {
	monoFg: #469165;
	selectBg: msgOutBgSelected;
	selectOverlay: msgSelectOverlay;
}
inFwdTextStyle: textStyle(defaultTextStyle) {
	linkFlags: semiboldFont;
	linkFlagsOver: semiboldFont;
	linkFg: msgInServiceFg;
	linkFgDown: msgInServiceFg;
}
outFwdTextStyle: textStyle(inFwdTextStyle) {
	linkFg: msgOutServiceFg;
	linkFgDown: msgOutServiceFg;
}
inFwdTextStyleSelected: textStyle(inFwdTextStyle) {
	linkFg: msgInServiceFgSelected;
	linkFgDown: msgInServiceFgSelected;
}
outFwdTextStyleSelected: textStyle(inFwdTextStyle) {
	linkFg: msgOutServiceFgSelected;
	linkFgDown: msgOutServiceFgSelected;
}
medviewSaveAsTextStyle: textStyle(defaultTextStyle) {
	linkFg: #91d9ff;
	linkFgDown: #91d9ff;
}

mediaPadding: margins(0px, 0px, 0px, 0px);//1px, 1px, 1px, 1px);//2px, 2px, 2px, 2px);
mediaCaptionSkip: 5px;
mediaInBubbleSkip: 5px;
mediaThumbSize: 48px;
mediaNameTop: 3px;
mediaDetailsShift: 3px;
mediaInFg: msgInDateFg;
mediaInFgSelected: msgInDateFgSelected;
mediaOutFg: msgOutDateFg;
mediaOutFgSelected: msgOutDateFgSelected;
mediaInUnreadFg: #999999;
mediaInUnreadFgSelected: #7b95aa;
mediaOutUnreadFg: #6aad60;
mediaOutUnreadFgSelected: #5aa382;
mediaUnreadSize: 7px;
mediaUnreadSkip: 5px;
mediaUnreadTop: 6px;

mediaInStyle: textStyle(defaultTextStyle) {
	linkFg: mediaInFg;
	linkFgDown: mediaInFg;
}
mediaInStyleSelected: textStyle(defaultTextStyle) {
	linkFg: mediaInFgSelected;
	linkFgDown: mediaInFgSelected;
}

msgFileRedColor: #e47272;
msgFileYellowColor: #efc274;
msgFileGreenColor: #61b96e;
msgFileBlueColor: #72b1df;
msgFileRedDark: #cd5b5e;
msgFileYellowDark: #e6a561;
msgFileGreenDark: #4da859;
msgFileBlueDark: #5c9ece;
msgFileRedOver: #c35154;
msgFileYellowOver: #dc9c5a;
msgFileGreenOver: #44a050;
msgFileBlueOver: #5294c4;
msgFileRedSelected: #9f6a82;
msgFileYellowSelected: #b19d84;
msgFileGreenSelected: #46a07e;
msgFileBlueSelected: #5099d0;

msgFileMenuSize: size(36px, 36px);
msgFileSize: 44px;
msgFilePadding: margins(14px, 12px, 11px, 12px);
msgFileThumbSize: 72px;
msgFileThumbPadding: margins(10px, 10px, 14px, 10px);
msgFileThumbNameTop: 12px;
msgFileThumbStatusTop: 32px;
msgFileThumbLinkTop: 60px;
msgFileThumbLinkInFg: lightButtonFg;
msgFileThumbLinkInFgSelected: lightButtonFgOver;
msgFileThumbLinkOutFg: #5eba5b;
msgFileThumbLinkOutFgSelected: #31a298;
msgFileNameTop: 16px;
msgFileStatusTop: 37px;
msgFileMinWidth: 294px;
msgFileInBg: windowActiveBg;
msgFileInBgOver: #4eade3;
msgFileInBgSelected: #51a3d3;
msgFileOutBg: #78c67f;
msgFileOutBgOver: #6bc272;
msgFileOutBgSelected: #5fb389;

msgFileOverDuration: 200;
msgFileRadialLine: 3px;

msgVideoSize: size(320px, 240px);

msgWaveformBar: 2px;
msgWaveformSkip: 1px;
msgWaveformMin: 2px;
msgWaveformMax: 20px;
msgWaveformInActive: windowActiveBg;
msgWaveformInActiveSelected: #51a3d3;
msgWaveformInInactive: #d4dee6;
msgWaveformInInactiveSelected: #9cc1e1;
msgWaveformOutActive: #78c67f;
msgWaveformOutActiveSelected: #6badad;
msgWaveformOutInactive: #b3e2b4;
msgWaveformOutInactiveSelected: #91c3c3;

historyScroll: flatScroll(scrollDef) {
	barColor: #89a0b47a;
	bgColor: #89a0b44c;
	barOverColor: #89a0b4bc;
	bgOverColor: #89a0b46b;

	round: 3px;

	width: 12px;
	deltax: 3px;
	deltat: 3px;
	deltab: 3px;

	topsh: 0px;
	bottomsh: -1px;
}
textRectMargins: margins(-2px, -1px, -2px, -1px);

reportSpamHide: flatButton {
	duration: 200;
	cursor: cursor(pointer);

	color: btnYesColor;
	overColor: btnYesHover;

	bgColor: transparent;
	overBgColor: transparent;

	width: -40px;
	height: 46px;

	textTop: 15px;
	overTextTop: 15px;
	downTextTop: 16px;

	font: font(fsize);
	overFont: font(fsize underline);
}
reportSpamButton: flatButton(reportSpamHide) {
	textTop: 6px;
	overTextTop: 6px;
	downTextTop: 7px;

	width: -50px;
	height: 30px;

	bgColor: #888888;
	overBgColor: #7b7b7b;
}
reportSpamSeparator: 30px;
reportSpamBg: #fffffff0;
reportSpamFg: #000000;

newMsgSound: ":/gui/art/newmsg.wav";

unreadBarHeight: 32px;
unreadBarMargin: 8px;
unreadBarFont: semiboldFont;
unreadBarBG: #fcfbfa;
unreadBarBorder: shadowColor;
unreadBarColor: #538bb4;

searchedBarHeight: unreadBarHeight;
searchedBarFont: unreadBarFont;
searchedBarBG: #ebeef1;
searchedBarBorder: unreadBarBorder;
searchedBarColor: #a2aeb7;

layerSlideDuration: 200;
layerHideDuration: 200;
layerPadding: margins(10px, 10px, 10px, 10px);

simpleCloseIcon: icon {{ "simple_close", #c7c7c7 }};
simpleCloseIconOver: icon {{ "simple_close", #a3a3a3 }};
dialogsForwardCancelIcon: icon {{ "simple_close", dialogsForwardFg }};

boxPhotoPadding: margins(28px, 28px, 28px, 18px);
boxPhotoCompressedPadding: margins(0px, 2px, 0px, 22px);
boxPhotoTextFg: #808080;
cropPointSize: 10px;
cropSkip: 13px;
cropMinSize: 20px;
confirmCaptionArea: InputArea(defaultInputArea) {
	textMargins: margins(1px, 6px, 1px, 4px);
	heightMax: 56px;
}
confirmBg: #f2f2f2;
confirmMaxHeight: 245px;
confirmCompressedSkip: 10px;

profileMaxWidth: 410px;
profilePadding: margins(28px, 30px, 28px, 0px);

profileOnlineFg: statusFgActive;
profileOfflineFg: statusFg;

membersPadding: margins(0px, 10px, 0px, 10px);

forwardMargins: margins(30px, 10px, 30px, 10px);
forwardFont: font(16px);
forwardBg: #0000004c;
forwardFg: #ffffff;

connectionHostInputField: InputField(defaultInputField) {
	width: 160px;
}
connectionPortInputField: InputField(defaultInputField) {
	width: 55px;
}
connectionUserInputField: InputField(defaultInputField) {
	width: 95px;
}
connectionPasswordInputField: InputField(defaultInputField) {
	width: 120px;
}
connectionIPv6Skip: 11px;

aboutIcon: icon {{ "intro_logo", #008ed5 }};
aboutWidth: 390px;
aboutVersionTop: -3px;
aboutVersionLink: linkButton(btnDefLink) {
	color: #999999;
	overColor: #999999;
	downColor: #999999;
}
aboutTextTop: 34px;
aboutSkip: 14px;
aboutLabel: flatLabel(labelDefFlat) {
	font: normalFont;
	width: 330px;
	align: align(topleft);
}
aboutTextStyle: textStyle(defaultTextStyle) {
	lineHeight: 22px;
}

emojiTextFont: font(15px);
emojiReplaceWidth: 52px;
emojiReplaceHeight: 56px;
emojiReplaceInnerHeight: 42px;
emojiReplacePadding: 14px;

connectingBG: #ffffffee;
connectingColor: #777777;
connectingPadding: margins(5px, 5px, 5px, 5px);

dragBg: #ffffff;
dragFont: font(28px semibold);
dragSubfont: font(20px semibold);
dragColor: #777777;
dragDropColor: btnYesColor;

dragMargin: margins(0px, 10px, 0px, 10px);
dragPadding: margins(20px, 10px, 20px, 10px);

dragHeight: 72px;

botKbDuration: 200;
botKbBg: #edf1f5;
botKbOverBg: #d8e2ec;
botKbDownBg: #d8e2ec;
botKbColor: #4b565f;
botKbFont: font(15px semibold);
botKbButton: botKeyboardButton {
	margin: 10px;
	padding: 10px;
	height: 38px;
	textTop: 9px;
	downTextTop: 9px;
}
botKbTinyButton: botKeyboardButton {
	margin: 4px;
	padding: 3px;
	height: 25px;
	textTop: 2px;
	downTextTop: 2px;
}
botKbScroll: flatScroll(solidScroll) {
	deltax: 3px;
	width: 10px;
}
switchPmButton: RoundButton(defaultBoxButton) {
	width: 320px;
	height: 34px;
	textTop: 7px;
	downTextTop: 8px;
}

minPhotoSize: 100px;
maxMediaSize: 420px;
maxStickerSize: 256px;
maxGifSize: 320px;
maxSignatureSize: 144px;

mvThickFont: semiboldFont;
mvFont: font(fsize);

mvTextLeft: 16px;
mvTextSkip: 10px;
mvHeaderTop: 48px;
mvTextTop: 24px;
mvTextColor: #ffffff;
mvTextOpacity: 0.5;
mvTextOverOpacity: 1;

mvIconOpacity: 0.45;
mvIconOverOpacity: 1;
mvControlFg: #ffffff;
mvControlBgOpacity: 0.3;
mvControlMargin: 0px;
mvControlSize: 90px;
mvIconSize: size(60px, 56px);

mvWaitHide: 2000;
mvHideDuration: 1000;
mvShowDuration: 200;
mvFadeDuration: 150;

mvDeltaFromLastAction: 5px;
mvSwipeDistance: 80px;

mvCaptionPadding: margins(18px, 10px, 18px, 10px);
mvCaptionMargin: size(11px, 11px);
mvCaptionRadius: 2px;
mvCaptionFg: #ffffff;
mvCaptionBg: #11111180;
mvCaptionFont: font(fsize);

medviewSaveMsgCheck: icon {{ "mediaview_save_check", #ffffff }};
medviewSaveMsgFont: font(16px);
medviewSaveMsgPadding: margins(55px, 19px, 29px, 20px);
medviewSaveMsgCheckPos: point(23px, 21px);
medviewSaveMsgShowing: 200;
medviewSaveMsgShown: 2000;
medviewSaveMsgHiding: 2500;
medviewSaveMsgFg: #ffffff;
medviewSaveMsg: #000000b2;

radialSize: size(50px, 50px);
radialLine: 3px;
radialDuration: 350;
radialPeriod: 3000;
radialFg: #ffffff;
radialBg: #00000056;

downloadPathSkip: 10px;

usernamePadding: margins(23px, 22px, 21px, 12px);
usernameSkip: 49px;
usernameTextStyle: textStyle(defaultTextStyle) {
	lineHeight: 20px;
}
usernameDefaultFg: #777777;

youtubeIcon: icon {
	{ "media_youtube_play_bg", #e83131c8 },
	{ "media_youtube_play", #ffffff, point(24px, 12px) },
};
videoIcon: icon {
	{ "media_video_play_bg", #0000007f },
	{ "media_video_play", #ffffff, point(12px, 12px) },
};
locationSize: size(320px, 240px);

boxOptionListPadding: margins(2px, 20px, 2px, 2px);

langsWidth: 256px;
langsButton: Radiobutton(defaultRadiobutton) {
	width: 200px;
}

backgroundPadding: 10px;
backgroundSize: size(108px, 193px);
backgroundScroll: flatScroll(boxScroll) {
	round: 2px;
	width: 10px;
	deltax: 3px;
	deltat: 10px;
	deltab: 0px;
}

mentionHeight: 40px;
mentionScroll: flatScroll(scrollDef) {
	topsh: 0px;
	bottomsh: 0px;
}
mentionPadding: margins(8px, 5px, 8px, 5px);
mentionTop: 11px;
mentionFont: linkFont;
mentionNameFg: windowTextFg;
mentionPhotoSize: msgPhotoSize;
mentionBg: #ffffff;
mentionBgOver: #f5f5f5;
mentionFg: #777777;
mentionFgOver: #707070;
mentionFgActive: #0080c0;
mentionFgOverActive: #0077b3;

webPageLeft: 10px;
webPageBar: 2px;
webPageTitleFont: semiboldFont;
webPageTitleOutFg: historyTextOutFg;
webPageTitleInFg: historyTextInFg;
webPageDescriptionOutFg: historyTextOutFg;
webPageDescriptionInFg: historyTextInFg;
webPageDescriptionFont: normalFont;
webPagePhotoSize: 100px;
webPagePhotoDelta: 8px;

mediaPlayerSuppressDuration: 150;

botDescSkip: 8px;

suppressAll: 0.2;
suppressSong: 0.05;

inlineResultsLeft: 11px;
inlineResultsSkip: 3px;
inlineMediaHeight: 96px;
inlineThumbSize: 64px;
inlineThumbSkip: 10px;
inlineTitleFg: windowTextFg;
inlineDescriptionFg: windowSubTextFg;
inlineRowMargin: 6px;
inlineRowBorder: 1px;
inlineRowBorderFg: #eaeaea;
inlineRowFileNameTop: 2px;
inlineRowFileDescriptionTop: 23px;
inlineResultsMinWidth: 64px;
inlineDurationMargin: 3px;

editTextArea: InputArea(defaultInputArea) {
	textMargins: margins(1px, 6px, 1px, 4px);
	heightMax: 256px;
}

toastFont: normalFont;
toastMaxWidth: 480px;
toastMinMargin: 13px;
toastBg: medviewSaveMsg;
toastFg: #ffffff;
toastPadding: margins(19px, 13px, 19px, 12px);
toastFadeInDuration: 200;
toastFadeOutDuration: 1000;

infoButton: PeerAvatarButton {
	size: topBarHeight;
	photoSize: 42px;
}

// forward declaration for single "title_back" usage.
profileTopBarBackIconFg: #0290d7;
profileTopBarBackIcon: icon {{ "title_back", profileTopBarBackIconFg }};

historyReplyCancelIcon: icon {{ "box_button_close", historyReplyCancelFg }};
historyReplyCancelIconOver: icon {{ "box_button_close", historyReplyCancelFgOver }};
boxSearchCancelIcon: icon {{ "box_button_close", boxSearchCancelIconFg }};
boxSearchCancelIconOver: icon {{ "box_button_close", boxSearchCancelIconFgOver }};
boxBlockTitleCloseIcon: icon {{ "box_button_close", boxBlockTitleCloseFg }};
boxBlockTitleCloseIconOver: icon {{ "box_button_close", boxBlockTitleCloseFgOver }};

notifyFadeRight: icon {{ "fade_horizontal", notificationBg }};

stickerIconLeft: icon {{ "fade_horizontal-flip_horizontal", emojiPanCategories }};
stickerIconRight: icon {{ "fade_horizontal", emojiPanCategories }};