﻿/*
・通信中の覆い。
・メッセージ欄。

2018/11/28-02 mod  Y.Watanabe	__fixViewportの差し戻し。
2018/11/19-02 mod  Y.Watanabe	__fixViewport
2018/09/21-02 mod  Y.Watanabe	growl周り。
2018/09/18-02 mod  Y.Watanabe	block周り。
2018/03/22-02 変更 Y.Watanabe
2018/02/09-01 変更 Y.Watanabe	dialog API。
2018/02/05-01 変更 Y.Watanabe	状態アイコン。
2018/01/17    変更 Y.Watanabe	xw-growl-spread再度抑制。
2018/01/05-01 変更 Y.Watanabe	xw-growl-spread復活。
2017/10/26-01 変更 Y.Watanabe	メッセージ欄見直し。
2017/10/02    変更 Y.Watanabe	.xw-overlay-center .ui-front。
2017/09/27    変更 Y.Watanabe	複数通信待機。home/xmenu/growl.css
2017/01/23    変更 Y.Watanabe
2015/11/30-01 追加 Y.Watanabe	XWE1.0

※backgroundはcolorだけでなくimageも上書き。
*/

/***** 待機中
.xw-overlay			画面の覆い
.xw-overlay-center	中央のバー
	.ui-front		文言
*****/
@keyframes xw-overlay-slow {
	0% { opacity: 0; }
	50% { opacity: 0.2; }
	100% { opacity: 0.5; }
}
.xw-overlay-static {
	animation-duration: 0s !important;
}

.xw-overlay,
.xw-overlay-center {
	z-index: 190;
}
.ui-tabs-panel .xw-overlay,
.ui-tabs-panel .xw-overlay-center {
	z-index: 170;
}
.xw-overlay-dup {
	opacity: 0;
}

#XW_DIALOG_HELPER {
	position: absolute;
	z-index: 180;
	top: 0;
	left: 0;
	width: 0;
}

/* [s]2018/02/09-01 ADD */
.xw-dialog-content {
	white-space: pre-line;
/*[s]2018/03/22-02 MOD*/
	word-wrap: break-word;
	overflow-wrap: break-word;
/*[e]2018/03/22-02 MOD*/
}
/* [e]2018/02/09-01 ADD */

.xw-overlay {
	animation: xw-overlay-slow 3s;
}

/*[s]2018/09/18-02 mod*/
.xw-overlay-center {
	animation: xw-overlay-slow 6s;
	position: absolute;
	top: 50%;
	bottom: auto;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	margin: 0 auto;
	width: 50%;
	height: auto;
}
.xw-overlay-center .ui-front {
	top: 0;
	margin: 0;
	border: none;
	background: none;
	font-weight: bold;
}
.xw-overlay-center div.ui-front {
	padding: 0.5em;
	position: relative;
	box-sizing: border-box;
	width: 100%;
	text-align: center;
	white-space: pre-wrap;
	word-break: break-word;
}
.xw-overlay-center i.ui-front {
	padding: 0 0.3em;
	position: absolute;
	right: 0;
}
.xw-overlay-center .ui-progressbar-value {
	position: absolute;
	top: 0;
}
/*[e]2018/09/18-02 mod*/

/***** メッセージ欄
div#XW_GROWL_RIPPLE.xw-growl-front(.xw-growl-spread)
div#XW_GROWL_OVERLAY.xw-growl-front.ui-widget-overlay
ul#XW_GROWL_WRAPPER.xw-growl-front
	li.xw-growl-item(.xw-growl-active)
		div.xw-growl-header
			i.xw-growl-status
			i.xw-growl-delete
			span.xw-growl-time
			strong.xw-growl-caption
		div.xw-growl-content
*****/
.xw-growl-front {

/*[s]2018/11/28-02 mod*/
	position: absolute;
/*[e]2018/11/28-02 mod*/
	z-index: 200;
/* jQuery/UI/Dialog/ui-frontの代わり */
}

#XW_GROWL_RIPPLE {
	pointer-events: none;
	opacity: 0;
}
.xw-growl-spread {
	display: none;
/*
	animation: xw-growl-keyframes 0.3s ease-out 0s forwards;
*/
}
@keyframes xw-growl-keyframes {
	0% {
		opacity: 0.4;
	}
	99% {
		opacity: 0;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	100% {
		right: 100%;
		bottom: 100%;
	}
}

#XW_GROWL_OVERLAY {
	opacity: 0;
	display: none;
}

#XW_GROWL_WRAPPER {
	width: 20em;
	font-size: smaller;
	text-align: left; /*ログイン画面用*/
/*[s]2018/09/21-02 add*/
	user-select: text;
/*[e]2018/09/21-02 add*/
}

#XW_GROWL_WRAPPER .ui-resizable-handle {
/*ドラッグ可能範囲の誤判定避け。*/
	right: 0 !important;
/*縦スクロールバーとの干渉避け。*/
	font-size: 100%;
/*[s]2018/09/21-02 mod*/
	height: 1em;
	top: auto;
	bottom: 0;
	border-top: none;
	border-left: none;
	background: none;
/*[e]2018/09/21-02 mod*/
}

.xw-growl-item {
	margin-top: 0.15em;
}
.xw-growl-item:first-child {
	margin-top: 0;
}

/*[s]2018/09/21-02 add*/
.xw-growl-compress .ui-state-highlight:not(.xw-growl-active) {
	display: none;
}
/*[e]2018/09/21-02 add*/

.xw-growl-header {
	cursor: move;
/*[s]2018/03/22-02 MOD*/
	word-wrap: break-word;
	overflow-wrap: break-word;
/*[e]2018/03/22-02 MOD*/
}

.xw-growl-header .xw-icon-only {
	cursor: pointer;
	padding: 0 0.3em;
}
/*[s]2018/09/21-02 add*/
.ui-widget-header .xw-growl-status {
	cursor: inherit;
}
/*[e]2018/09/21-02 add*/
.xw-growl-delete {
	float: right;
	position: relative;
/*[s]2018/09/21-02 del*/
/*	z-index: 200;*/
/*[e]2018/09/21-02 del*/
}
/*[s]2018/09/21-02 add*/
#XW_GROWL_WRAPPER .ui-widget-header .xw-growl-delete::before {
	content: "\f066";	/*fa-compress*/
}
#XW_GROWL_WRAPPER.xw-growl-compress .ui-widget-header .xw-growl-delete::before {
	content: "\f065";	/*fa-expand*/
}
/*[e]2018/09/21-02 add*/

.xw-growl-status::before {
	content: "\f10c";	/*fa-circle-o*/
}
.xw-growl-active .xw-growl-status::before {
	content: "\f192";	/*fa-dot-circle-o*/
}
/*[s]2018/09/21-02 add*/
#XW_GROWL_WRAPPER .ui-widget-header .xw-growl-status::before {
	content: "\f086";	/*fa-comments*/
}
#XW_GROWL_WRAPPER[data-xw-count="0"] .ui-widget-header .xw-growl-status::before {
	content: "\f0e5";	/*fa-comment-o*/
}
#XW_GROWL_WRAPPER[data-xw-count="1"] .ui-widget-header .xw-growl-status::before {
	content: "\f075";	/*fa-comment*/
}
/*[e]2018/09/21-02 add*/

.xw-growl-time {
	margin: 0 0.3em;
}

.xw-growl-content {
	max-height: 0;
	transition: max-height 0.3s 0s ease;
	white-space: pre-wrap;
/*[s]2018/03/22-02 MOD*/
	word-wrap: break-word;
	overflow-wrap: break-word;
/*[e]2018/03/22-02 MOD*/
	overflow: auto;
}
.xw-growl-active .xw-growl-content {
	max-height: 10em;
	padding-bottom: 0.5em; /* line-height関連。余分な縦scroll避け。 */
}

/* [s]2018/02/05-01 ADD */
.xw-growl-header .xw-status {
	float: right;
	width: 1em;
	text-align: center;
}

.xw-state-busy::before {
	content: "\f110";	/* spinner */
}
.xw-state-busy {
	animation: fa-spin 1.5s infinite steps(8);
}

.xw-state-wait::before,
.xw-state-info::before {
	content: "\f06a";	/* exclamation */

}
.xw-state-wait {
	animation: xw-blink 1.5s ease infinite;
}
@keyframes xw-blink {
    0%,100% {
        opacity: 0.9
    }
    50% {
        opacity: 0.1
    }
}

.xw-state-idle::before {
	content: "";
}
/* [e]2018/02/05-01 ADD */