.profile-page {
	width: 100%;
	float: right;
	margin: 60px 0 0 0;
}
.profile-page .box4 {
	background-color: var(--color-bg);
	border: var(--color-border);
	padding: 20px;
	border-radius: 20px;
	position: relative;
}
.profile-page .menu-box {
	width: 100%;
	float: right;
	position: relative;
	text-align: right;
	margin: 0 0 20px 0;
}
.profile-page .menu-box .text {
	width: 100%;
	float: right;
	font-weight: 600;
	font-size: 14px;
	margin: 0 0 5px 0;
}
.profile-page .menu-box .text.url {
	color: var(--color-font-eggplant);
	font-weight: 500;
	font-size: 12px;
	margin: 0 0 0 0;
}
.profile-page .menu-box .text.small {
	color: var(--color-font-low);
	font-weight: 500;
	font-size: 12px;
}
.profile-page .menu-box .text span.right {
	float: right;
}
.profile-page .menu-box .text.url svg.arrow {
	width: 15px;
	height: 15px;
	float: right;
	filter: var(--color-svg-eggplant);
	margin: 5px 0 0 0;
}
.profile-page .menu-box .fix-box {
	position: absolute;
	top: 0;
	left: 0;
}
.profile-page .menu-box .fix-box span.sptext {
	float: left;
	font-weight: 600;
	font-size: 18px;
	margin: -2px 0 0 10px;
}
.profile-page .menu-box .fix-box svg {
	width: 30px;
	height: 30px;
	float: right;
	filter: var(--color-svg-eggplant);
	margin: 5px 0 0 0;
}
.profile-page .menu-box .fix-box .toman {
	width: 20px;
	float: left;
}
.profile-page .menu-box .fix-box .toman span.sptext {
	text-align: left;
	line-height: 100%;
	font-weight: 500;
	font-size: 12px;
	margin: 0 0 0 0;
}
.profile-page .menu-box .fix-box .toman {
	width: 20px;
	float: left;
	text-align: left;
	line-height: 100%;
}
.profile-page ul.profile-menu {
	width: 100%;
	float: right;
}
.profile-page ul.profile-menu li {
	width: 100%;
	float: right;
	border-bottom: var(--color-border);
	position: relative;
}
.profile-page ul.profile-menu li a {
	width: 100%;
	float: right;
	padding: 10px 0;
	font-size: 13px;
	color: var(--color-font-black);
}
.profile-page ul.profile-menu li a:hover { background-color: var(--color-bg-btn); }
.profile-page ul.profile-menu li.active {
	font-weight: 600;
}
.profile-page ul.profile-menu li:last-child {
	border-bottom: none;
}
.profile-page ul.profile-menu li:hover:after,
.profile-page ul.profile-menu li.active:after {
	content: '';
	width: 5px;
	height: 35px;
	position: absolute;
	top: 5px;
	right: -21px;
	background-color: var(--color-bg-eggplant);
	border-radius: 5px 0 0 5px;
}
.profile-page ul.profile-menu li a svg {
	width: 25px;
	height: 25px;
	float: right;
	margin: 0 0 0 5px;
	filter: var(--color-svg-black);
}
.profile-page ul.profile-menu li .count {
	width: 25px;
	height: 25px;
	position: absolute;
	top: 10px;
	left: 10px;
	background-color: var(--color-bg-eggplant);
	color: var(--color-font-white);
	text-align: center;
	font-size: 13px;
	border-radius: 5px;
	line-height: 200%;
}
.profile-page .box-left-profile {
	background-color: var(--color-bg);
	border: var(--color-border);
	padding: 20px;
	border-radius: 20px;
	position: relative;
	margin: 0 0 20px 0;
}

/* Title */
.profile-page .box-left-profile .title {
	width: 100%;
	float: right;
	margin: 0 0 30px 0;
}
.profile-page .box-left-profile .title .text {
	width: 150px;
	float: right;
	position: relative;
}
.profile-page .box-left-profile .title .text span.name {
	float: right;
	font-weight: 600;
	font-size: 16px;
	text-align: right;
	color: var(--color-font-black);
}
.profile-page .box-left-profile .title .text .line {
	width: 60px;
	height: 5px;
	float: right;
	background-color: var(--color-bg-eggplant);
	margin: 10px 0 0 0;
	border-radius: 5px;
}
.profile-page .box-left-profile .title .more {
	float: left;
	color: var(--color-font-a);
	margin: 10px 0 0 0;
}
.profile-page .box-left-profile .title .more a {
	color: var(--color-font-a);
}
.profile-page .box-left-profile .title .more svg {
	width: 16px;
	height: 16px;
	float: left;
	margin: 3px 0 0 0;
	filter: var(--color-svg-eggplant);
}
.profile-page .box-left-profile .title .more svg.search {
	width: 25px;
	height: 25px;
	float: left;
	margin: 0 0 0 0;
	filter: var(--color-svg-eggplant);
}
.profile-page .box-left-profile .title .more span.btn {
	padding: 5px 15px;
	border-radius: 5px;
	color: var(--color-font-white);
	background-color: var(--color-bg-eggplant);
	border: var(--color-border-eggplant);
	cursor: pointer;
	margin: 0 10px 0 0;
}
.profile-page .box-left-profile .title .more span.nobg {
	color: var(--color-font-eggplant);
	background-color: inherit;
}
.profile-page .box-left-profile .box3 svg {
	width: 60px;
	height: 60px;
	float: right;
	filter: var(--color-svg-volga);
}
.profile-page .box-left-profile .box3 .text {
	float: right;
	padding: 0 20px 0 0;
}
.profile-page .box-left-profile .box3 .text span.name {
	float: right;
	text-align: right;
	color: var(--color-font-medium);
	font-size: 12px;
}
.profile-page .box-left-profile .box3 .text span.bold {
	font-weight: 600;
	font-size: 16px;
	color: var(--color-font-black);
	margin: 5px 0 0 0;
}
.scroll-table {
	width: 100%;
	overflow: auto;
}
.scroll-table table {
	width: 100%;
	border-collapse: collapse;
}
.scroll-table th, .scroll-table td {
	min-width: 120px;
	padding: 8px;
	text-align: center;
}
.scroll-table thead {
	background-color: var(--color-bg-black);
	text-align: center;
	color: var(--color-font-white);
}
.scroll-table tbody tr:nth-child(2n) {
	background-color: var(--color-bg-btn);
}
.scroll-table tbody tr:hover {
	background-color: var(--color-bg-table-hover);
}
.scroll-table tbody tr svg {
	width: 20px;
	height: 20px;
	display: inline-block;
	margin: 5px 0 0 0;
}
.scroll-table table td span.btn {
	min-width: 100px;
	padding: 5px 15px;
	display: inline-block;
	background-color: var(--color-font);
	border-radius: 20px;
	color: var(--color-font-white);
	cursor: default;
	position: relative;
	font-size: 11px;
	white-space: nowrap;
}
.scroll-table table td span.blocked { background-color: #ecf0f1; color: #333; }
.scroll-table table td span.mali { background-color: #16a085; }
.scroll-table table td span.anbar { background-color: #2980b9; }
.scroll-table table td span.commerce { background-color: #8e44ad; }
.scroll-table table td span.finish { background-color: #e74c3c; }
.scroll-table table td span.public { background-color: #27ae60; }
.scroll-table table td span.publish { background-color: #7ace4c; }
.scroll-table table td span.pending { background-color: #ffb400; }
.scroll-table table td span.trash { background-color: #ff5050; }
.scroll-table table td span.draft { background-color: #66C; }
.scroll-table table td span.repair { background-color: #C93; }

.scroll-table table td.v2 span.blocked { color: #333; border:1px solid #333;background-color:inherit; }
.scroll-table table td.v2 span.mali { color: #16a085; border:1px solid #16a085;background-color:inherit; }
.scroll-table table td.v2 span.anbar { color: #2980b9; border:1px solid #2980b9;background-color:inherit; }
.scroll-table table td.v2 span.commerce { color: #8e44ad; border:1px solid #8e44ad;background-color:inherit; }
.scroll-table table td.v2 span.finish { color: #e74c3c; border:1px solid #e74c3c;background-color:inherit; }
.scroll-table table td.v2 span.public { color: #27ae60; border:1px solid #27ae60;background-color:inherit; }
.scroll-table table td.v2 span.publish { color: #7ace4c; border:1px solid #7ace4c;background-color:inherit; }
.scroll-table table td.v2 span.pending { color: #ffb400; border:1px solid #ffb400;background-color:inherit; }
.scroll-table table td.v2 span.trash { color: #ff5050; border:1px solid #ff5050;background-color:inherit; }
.scroll-table table td.v2 span.draft { color: #66C; border:1px solid #66C;background-color:inherit; }
.scroll-table table td.v2 span.repair { color: #C93; border:1px solid #C93;background-color:inherit; }


/* Comments */
.profile-page .comments .box2 {
	border: var(--color-border);
	padding: 15px;
	border-radius: 10px;
}
.profile-page .comments .box2 .img,
.profile-page .comments .user-comment .product .img {
	width: auto;
	height: 120px;
	float: right;
	margin: 0 0 0 10px;
}
.profile-page .comments .box2 .img img,
.profile-page .comments .user-comment .product .img img {
	width: 100%;
	height: 100%;
	float: right;
	object-fit: cover;
	border-radius: 5px;
}
.profile-page .comments .box2 h2,
.profile-page .comments .user-comment .product h2 {
	width: auto;
	float: right;
	font-size: 14px;
	text-align: right;
	color: var(--color-font-black);
}
.profile-page .comments .box2 ul.detail {
	width: 100%;
	float: right;
	padding: 10px 0;
	border-bottom: var(--color-border);
	margin: 0 0 15px 0;
}
.profile-page .comments .box2 ul.detail li {
	float: right;
	color: var(--color-font-medium);
	margin: 0 0 0 15px;
}
.profile-page .comments .box2 ul.detail li:before {
	content: '●';
	float: right;
	font-size: 10px;
	margin: 2px 0 0 5px;
}
.profile-page .comments .box2 ul.detail li .circle {
	width: 15px;
	height: 15px;
	float: right;
	background-color: #000;
	border-radius: 50%;
	margin: 3px 0 0 5px;
}
.profile-page .comments .box2 ul.detail li .color_bg {
	width: 18px;
	height: 18px;
	float: right;
	border-radius: 50%;
	margin: 2px 0 0 5px;
	border:1px solid #666;
}
.profile-page .comments .box2 .btn {
	width: 100%;
	float: right;
	padding: 10px 0;
	text-align: center;
	border: var(--color-border-eggplant);
	color: var(--color-font-eggplant);
	border-radius: 5px;
	cursor: pointer;
}
.profile-page .comments .box2 .btn span.text {
	width: auto;
	display: inline-block;
}
.profile-page .comments .box2 .btn svg {
	width: 20px;
	height: 20px;
	float: right;
	filter: var(--color-svg-eggplant);
	margin: 0 0 0 5px;
}
.profile-page .comments .user-comment .product {
	width: 100%;
	float: right;
	padding: 0 0 20px 0;
	border-bottom: var(--color-border);
	margin: 0 0 15px 0;
	position: relative;
}
.profile-page .comments .user-comment {
	width: 100%;
	float: right;
	padding: 0 0 20px 0;
	border-bottom: var(--color-border);
	margin: 0 0 15px 0;
	position: relative;
}
.profile-page .comments .user-comment .product svg.menu {
	width: 25px;
	height: 25px;
	position: absolute;
	top: 0;
	left: 0;
	filter: var(--color-svg-cancel);
}
.profile-page .comments .user-comment .product .status {
	width: auto;
	position: absolute;
	top: 40px;
	left: 0;
	padding: 3px 15px;
	border-radius: 50px;
	background-color: rgba(41,179,0,0.08);
	color: #4CAF50;
}
.profile-page .comments .user-comment .product .status.pending {
	background-color: rgba(255, 153, 0, 0.08);
	color: #F90;
}
.profile-page .comments .user-comment .product .status.no {
	background-color: rgba(255, 80, 80, 0.08);
	color: #ff5050;
}
.profile-page .comments .user-comment .product .status svg {
	width: 20px;
	height: 20px;
	float: right;
	margin: 1px 0 0 5px;
}
.profile-page .comments .user-comment .product p.star-text {
	width: 100%;
	float: right;
	text-align: right;
	color: #4CAF50;
	margin: 10px 0 0 0;
}
.profile-page .comments .user-comment h3 {
	width: 100%;
	float: right;
	font-size: 16px;
	text-align: right;
	color: var(--color-font-black);
	margin: 0 0 10px 0;
}
.profile-page .comments .user-comment ul.item-list-comment {
	width: 100%;
	float: right;
	padding: 10px 10px 0 0;
}
.profile-page .comments .user-comment ul.item-list-comment li {
	width: 100%;
	float: right;
}
.profile-page .comments .user-comment ul.item-list-comment li:after {
	content: '-';
	float: right;
	margin: -8.5px 0 0 5px;
	color: red;
	font-size: 22px;
}
.profile-page .comments .user-comment ul.item-list-comment li.ok:after {
	content: '+';
	color: green;
}

/* Tabs */
.tabs-box {
	width: 100%;
	float: right;
	border-bottom: var(--color-border);
	margin: 0 0 20px 0;
}
.profile-page .tabs {
	float: right;
	border-radius: 5px 5px 0 0;
	cursor: pointer;
	padding: 20px 10px;
	color: var(--color-font-medium);
	margin-right: 10px;
	font-size: 14px;
	position: relative;
}
.profile-page .tabs .square {
	float: left;
	margin: 0 5px 0 0;
	background-color: var(--color-bg-tabs);
	color: var(--color-font-white);
	padding: 0 5px;
	border-radius: 5px;
	font-size: 12px;
	text-align: center;
}
.profile-page .tabs.active .square {
	background-color: var(--color-bg-eggplant);
}
.profile-page .tabs.active {
	color: var(--color-font-eggplant);
}
.profile-page .tabs.active:after {
	content: '';
	width: 100%;
	height: 5px;
	background-color: var(--color-bg-eggplant);
	border-radius: 5px 5px 0 0;
	position: absolute;
	bottom: 0;
	right: 0;
}
.profile-page .tab-content {
	display: none;
}
.profile-page .tab-content.active {
	display: block;
	padding: 10px 0;
}
.profile-page .tab-content .alert-box {
	width: 100%;
	float: right;
	padding: 20px;
	border-radius: 20px;
	background-color: var(--color-bg-alert);
	margin: 0 0 20px 0;
}
.profile-page .tab-content .alert-box h3,
.profile-page .tab-content .alert-box p {
	width: 100%;
	float: right;
	color: var(--color-font-black);
	font-weight: 600;
	font-size: 16px;
	text-align: right;
	margin: 0 0 5px 0;
}
.profile-page .tab-content .alert-box p {
	font-weight: 500;
	font-size: 12px;
	color: var(--color-font-medium);
}
/* Product Tab Box */
.profile-page .product-tab-box {
	width: 100%;
	float: right;
	padding: 20px;
	border-radius: 10px;
	border: var(--color-border);
	margin: 10px 0;
}
.profile-page .product-tab-box .title {
	width: 100%;
	float: right;
	margin: 0 0 15px 0;
}
.profile-page .product-tab-box .borderBottom {
	padding: 0 0 20px 0;
	border-bottom: var(--color-border);
}
.profile-page .product-tab-box .borderBottom:last-child {
	padding: 0 0 0 0;
	border-bottom: none;
}
.profile-page .product-tab-box .rightBox { float: right; }
.profile-page .product-tab-box .leftBox { float: left; }
.profile-page .product-tab-box .btn.can_cancel {
	background-color:#ff5050;
	color:#fff;
	padding:2px 10px;
	border-radius:5px;
	opacity:0.9;
	font-size:11px;
	cursor:pointer;	
}
.profile-page .product-tab-box .question svg {
	width: 25px;
	height: 25px;
	float: right;
	margin: -2px 20px 0 10px;
	cursor:pointer;	
}
.profile-page .product-tab-box .title svg.icon {
	width: 25px;
	height: 25px;
	float: right;
	margin: 2px 0 0 10px;
}
.profile-page .product-tab-box .title svg.rotate {
	width: 20px;
	height: 20px;
	transform: rotate(180deg);
	margin: 5px 0 0 10px;
}
.profile-page .product-tab-box .title svg.cancel {filter: var(--color-svg-cancel);}
.profile-page .product-tab-box .title span.text {
	float: right;
	font-size: 16px;
	text-align: right;
	color: var(--color-font-black);
}
.profile-page .product-tab-box .title svg.arrow {
	width: 25px;
	height: 25px;
	float: left;
	margin: 2px 0 0 10px;
	filter: var(--color-svg-black);
}
.profile-page .product-tab-box ul.detail {
	width: 100%;
	float: right;
	margin: 0 0 15px 0;
	position: relative;
}
.profile-page .product-tab-box ul.nomargin {
	margin: 0 0 0 0;
}
.profile-page .product-tab-box ul.detail li {
	float: right;
	font-size: 14px;
	position: relative;
	margin: 5px 0;
}
.profile-page .product-tab-box ul.detail li img {
	width: 25px;
	height: 25px;
	float: right;
	margin: 0 0 0 10px;
}
.profile-page .product-tab-box ul.detail li span.spanli {
	color: var(--color-font-medium);
	font-size: 13px;
	margin: 0 0 0 10px;
}
.profile-page .product-tab-box ul.detail li:after {
	content: '●';
	float: right;
	color: var(--color-font-medium);
	margin: 0 10px;
	font-size: 14px;
	text-align: right;
}
.profile-page .product-tab-box ul.detail li.content:after {
	content: none;
}
.profile-page .product-tab-box ul.detail li:first-child:after {
	content: inherit;
}
.profile-page .product-tab-box ul.detail li .unit {
	width: 22px;
	height: 22px;
	float: left;
	margin: 0 5px 0 0;
	font-size: 10px;
	font-weight: 600;
	color: var(--color-font-black);
	position: relative;
}
.profile-page .product-tab-box ul.detail li .unit .text-1 {
	position: absolute;
	bottom: 0;
	left: 0;
}
.profile-page .product-tab-box ul.detail li .unit .text-2 {
	position: absolute;
	top: -6px;
	left: 0;
}
.profile-page .product-tab-box .product-sale,
.profile-page .product-tab-box .product-factor {
	width: 100%;
	float: right;
	border-top: var(--color-border);
	padding: 20px 0 0 0;
}
.profile-page .product-tab-box .product-factor {
	margin: 20px 0 0 0;
	color: var(--color-font-eggplant);
}
.profile-page .product-tab-box .product-sale .imageProduct {
	width: 120px;
	height: 120px;
	float: right;
	margin: 0 0 0 10px;
}
.profile-page .product-tab-box .product-sale .imageProduct img {
	width: 100%;
	height: 100%;
	float: right;
	object-fit: contain;
	border-radius: 5px;
}
.profile-page .product-tab-box svg.factor {
	width: 25px;
	height: 25px;
	float: left;
	filter: var(--color-svg-eggplant);
	margin: 0 0 0 5px;
}
.profile-page .product-tab-box span.factor {
	float: left;
	text-align: left;
	color: var(--color-font-eggplant);
}
.profile-page .product-tab-box .line-status {
	width: 40%;
	position: absolute;
	top: 0;
	left: 0;
}
.profile-page .product-tab-box .line-status span.status {
	float: right;
	text-align: right;
	color: #f9a825;
	font-weight: 600;
}
.profile-page .product-tab-box .line-status .lineBar {
	width:100%;
	height:8px;
	float:right;
	background-color:#f0f0f1;
	border-radius:50px;
	position:relative;
	overflow:hidden;
	margin:5px 0 0 0;
}
.profile-page .product-tab-box .line-status .lineBar .fill {
	width:25%;
	height:8px;
	position:absolute;
	top:0;
	right:0;
	background-color:#f9a825;
}
.profile-page .product-tab-box .line-status.send span.status,
.profile-page .product-tab-box .line-status.delivered span.status {
	color: #0c0;
}
.profile-page .product-tab-box .line-status.send .lineBar .fill,
.profile-page .product-tab-box .line-status.delivered .lineBar .fill
 {
	background-color:#0c0;
	width:100%;
}
.profile-page .product-tab-box .line-status.cancel span.status,
.profile-page .product-tab-box .line-status.problem span.status {
	color: #ff5050;
}
.profile-page .product-tab-box .line-status.cancel .lineBar .fill,
.profile-page .product-tab-box .line-status.problem .lineBar .fill
 {
	background-color:#ff5050;
	width:5%;
}
.profile-page .product-tab-box .line-status.reserve span.status {
	color: #B497DF;
}
.profile-page .product-tab-box .line-status.reserve .lineBar .fill
 {
	background-color:#B497DF;
	width:20%;
}
.profile-page .product-tab-box .alert-box {
	width: 100%;
	float: right;
	padding: 20px;
	border-radius: 20px;
	background-color: var(--color-bg-alert);
	margin: 20px 0 0 0;
}
.profile-page .product-tab-box .alert-box p {
	width: 100%;
	float: right;
	color: var(--color-font-medium);
	font-weight: 500;
	font-size: 14px;
	text-align: right;
}
.profile-page .product-tab-box .alert-box a {
	width: 100%;
	float: right;
	margin: 20px 0;
	color: var(--color-font-eggplant);
	text-align: right;
}
.profile-page .product-tab-box .alert-box span.text {
	float: right;
}
.profile-page .product-tab-box .alert-box svg.icon {
	width: 20px;
	height: 20px;
	float: right;
	filter: var(--color-svg-eggplant);
	margin: 2px 0 0 0;
}
.profile-page .product-tab-box .alert-box svg.icon.copy {
	filter: var(--color-svg-black);
}
.profile-page .product-tab-box .alert-box .code {
	width: 100%;
	float: right;
	text-align: right;
	font-size: 14px;
}
.profile-page .product-tab-box .alert-box .code .text {
	float: right;
	text-align: right;
	margin: 0 0 0 30px;
	color: var(--color-font-medium);
}
.profile-page .product-tab-box .alert-box .code span.text {
	color: var(--color-font-black);
}
.profile-page .product-tab-box .alert-box .code span.copy-message {
	text-align: right;
	float: right;
	font-size: 12px;
}

/* Addresses */
.profile-page .addresses {
	width: 100%;
	float: right;
}
.profile-page .addresses .boxForm {
	width: 100%;
	float: right;
	margin: 0 0 10px 0;
}
.profile-page .addresses .boxForm label {
	width: 100%;
	height: 40px;
	float: right;
	padding: 7px 0;
}
.profile-page .addresses .boxForm label.small {
	width: 25%;
	text-align: center;
	background-color: #F6F8F9;
	border: 1px solid #e0e0e0;
}
.profile-page .addresses .boxForm input,
.profile-page .addresses .boxForm select,
.profile-page .addresses .boxForm textarea {
	width: 100%;
	height: 40px;
	float: right;
	padding: 6px 10px;
	border: 1px solid #e0e0e0;
	font-size: 12px;
	text-align: right;
}
.profile-page .addresses .boxForm input,
.profile-page .addresses .boxForm select {
	width: 75%;
	background-color: #E9ECEF;
	border: 1px solid #e0e0e0;
}
.profile-page .addresses .boxForm textarea {
	min-height: 150px;
	max-height: 150px;
	min-width: 100%;
	max-width: 100%;
}
.profile-page .addresses button {
	float: right;
	padding: 8px 25px;
	text-align: center;
	background-color: var(--color-bg-eggplant);
	color: var(--color-font-white);
	border: none;
	border-radius: 5px;
	margin: 10px 0 0 0;
}
.profile-page .addresses .item-list-address {
	width: 100%;
	height: 300px;
	float: right;
	padding: 15px;
	border-radius: 20px;
	overflow: hidden;
	background-color: #F6F8F9;
	position: relative;
	margin: 0 0 20px 0;
}
.profile-page .addresses .item-list-address ul.item-address {
	width: 100%;
	float: right;
}
.profile-page .addresses .item-list-address ul.item-address li {
	width: 100%;
	float: right;
	margin: 5px 0;
}
.profile-page .addresses .item-list-address .bottom {
	width: 100%;
	position: absolute;
	bottom: 0;
	right: 0;
	background-color: #ECF1F3;
	padding: 20px;
}
.profile-page .addresses .item-list-address .bottom .btn {
	float: left;
	padding: 0 15px;
	text-align: center;
	font-weight: 600;
	font-size: 13px;
	color: var(--color-font-eggplant);
	border-right: 1px solid #e0e0e0;
	cursor:pointer;
}
.profile-page .addresses .item-list-address .bottom .btn:last-child {
	border-right: none;
}
.profile-page .addresses .item-list-address .bottom .assumption {
	float: right;
}

/* Start switchProfile */
.switchProfile {
    position: relative;
    display: inline-block;
    width: 29px;
    height: 18px;
    margin: 3px 0 0 6px;
    float: right;
}
.switchProfile input { 
    opacity: 0;
    width: 0;
    height: 0;
}
.sliderProfile {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #CCC;
    -webkit-transition: .4s;
    transition: .4s;
}
.sliderProfile:before {
    position: absolute;
    content: "";
    height: 13px;
    width: 13px;
    left: 2px;
    bottom: 2px;
    background-color: #FFF;
    -webkit-transition: .4s;
    transition: .4s;
}
input:checked + .sliderProfile {
    background-color: #ffaa00;
}
input:focus + .sliderProfile {
    box-shadow: 0 0 1px #CCC;
}
input:checked + .sliderProfile:before {
    -webkit-transform: translateX(12px);
    -ms-transform: translateX(12px);
    transform: translateX(12px);
}
.sliderProfile.round {
    border-radius: 34px;
}
.sliderProfile.round:before {
    border-radius: 50%;
}
/* End switchProfile */

/* Column Personal Info */
.profile-page .column-personal-info {
	display: grid;
	grid-template-columns: 50% 50%;
	width: 100%;
}
.profile-page .column-personal-info .box {
	padding: 20px;
	border-bottom: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	position: relative;
}
.profile-page .column-personal-info .box:nth-child(2n) {
	border-left: none;
}
.profile-page .column-personal-info .box:last-child,
.profile-page .column-personal-info .box:nth-child(7) {
	border-bottom: none;
}
.profile-page .column-personal-info .box .name,
.profile-page .column-personal-info .box .show-detail {
	width: 100%;
	float: right;
	text-align: right;
	color: var(--color-font-medium);
	font-size: 14px;
	font-weight: 500;
	margin: 0 0 10px 0;
	position: relative;
}
.profile-page .column-personal-info .box .show-detail {
	color: var(--color-font-black);
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 0 0;
}
.profile-page .column-personal-info .box .name span.right {
	float: right;
}
.profile-page .column-personal-info .box .name .status div {
	float: right;
	padding: 3px 10px;
	border-radius: 50px;
	background-color: #ccc;
	color: var(--color-font-white);
	font-size: 12px;
	margin: -2px 10px 0 0;
}
.profile-page .column-personal-info .box .name .status .pending {
	background-color: #F90;
}
.profile-page .column-personal-info .box .name .status .ok {
	background-color: var(--color-bg_green);
}
.profile-page .column-personal-info .box svg.edit {
	width: 25px;
	height: 25px;
	position: absolute;
	top: 40px;
	left: 20px;
	filter: var(--color-svg-cancel);
	cursor:pointer;
}

/* Lists */
.profile-page .lists {
	width: 100%;
	float: right;
}
.profile-page .item-alert {
	width: 100%;
	float: right;
	padding: 10px 0;
	text-align: right;
	position: relative;
	border-bottom: var(--color-border);
	margin: 0 0 30px 0;
}
.profile-page .item-alert .icon {
	float: right;
	width: 22px;
	height: 22px;
	margin: 2px 0 0 10px;
}
.profile-page .item-alert .icon svg {
	float: right;
	width: 100%;
	height: 100%;
	filter: var(--color-svg-black);
}
.profile-page .item-alert span.name {
	float: right;
	color: var(--color-font-black);
	font-weight: 600;
	font-size: 16px;
}
.profile-page .item-alert p {
	width: 100%;
	float: right;
	color: var(--color-font-medium);
	margin: 5px 0 0 0;
}
.box-left-profile.lists .all-post-product {
	width: 33.0%;
	margin: 0 0 10px 0;
	display:inline-block;
}


/* pre-payment */
.profile-page .orders .pre-payment {
	width:100%;
	float:right;
	border-radius:10px;
	padding:20px;
	margin:0 0 20px 0;
}
.profile-page .orders .pre-payment ul {
	width:100%;
	float:right;
	border:1px solid #e0e0e0;
	margin:0 0 20px 0;
	padding:10px;
	border-radius:15px;
}
.profile-page .orders .pre-payment ul li {
	float:right;
	position:relative;
	padding:0 10px;
	margin:12px 0 0 0;
	color:#333;
}
.profile-page .orders .pre-payment ul li.medium { color:#333; float:left; margin:0; }
.profile-page .orders .pre-payment ul li.small { width:10%; color:#333; }
.profile-page .orders .pre-payment ul li.mini { width:35%; color:#333; }
.profile-page .orders .pre-payment ul li.margin { margin:12px 0 0 0; }
.profile-page .orders .pre-payment ul li b.money {
	color:#0a0;
}
.profile-page .orders .pre-payment ul li span.alert-expire {
	color:#F90;
}
.profile-page .orders .pre-payment ul li span.absolute {
	position:absolute;
	top:-10px;
	left:10px;
}
.profile-page .orders .pre-payment ul li svg {
	width:20px;
	height:20px;
	float:right;
	margin:0 0 0 5px;
	filter: invert(68%) sepia(95%) saturate(1213%) hue-rotate(342deg) brightness(104%) contrast(95%);
}
.profile-page .orders .pre-payment ul li .btn {
	width:auto;
	float:left;
	font-weight:500;
	background-color:#ff5050;
	border:1px solid #ff5050;
	color:#fff;
	margin:0 10px 0 0;
	padding:8px 15px;
	border-radius:10px;
	cursor:pointer;
}
.profile-page .orders .pre-payment ul li .btn.nobg {
	background-color:inherit;
	border:none;
	color:#ef4056;
}
@media screen and (max-width: 1080px){
}

.chargeWallet svg {
    width: 120px;
    height: 120px;
    display: inline-block;
}
		

/* Switch */
.switch {
	position: absolute;
	top: 25px;
	left: 0;
	display: inline-block;
	width: 39px;
	height: 23px;
}
.switch input { 
	opacity: 0;
	width: 0;
	height: 0;
}
.switch .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
}
.switch .slider:before {
	position: absolute;
	content: "";
	height: 15px;
	width: 15px;
	left: 4px;
	bottom: 4.05px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}
.switch input:checked + .slider {
	background-color: var(--color-bg-eggplant);
}
.switch input:focus + .slider {
	box-shadow: 0 0 1px var(--color-bg-eggplant);
}
.switch input:checked + .slider:before {
	-webkit-transform: translateX(15px);
	-ms-transform: translateX(15px);
	transform: translateX(15px);
}

/* Rounded sliders */
.switch .slider.round {
  border-radius: 34px;
}

.switch .slider.round:before {
  border-radius: 50%;
}

/* userDetail */
.swal2-modal .swalUser {
	width: 100%;
	float: right;
}
.swal2-modal .swalUser .title {
	width: 100%;
	float: right;
	border-bottom: 1px solid #e0e0e0;
	padding: 10px 0;
	margin: 0 0 10px 0;
	text-align: right;
	font-size: 14px;
	font-weight: 600;
	position: relative;
}
.swal2-modal .swalUser .title .icon {
	position: absolute;
	top: 10px;
	left: 0;
}
.swal2-modal .swalUser .title .icon .circle {
	width: 8px;
	height: 8px;
	position: absolute;
	top: 0;
	right: 0;
	border-radius: 50%;
	background-color: #C00;
	z-index: 22;
}
.swal2-modal .swalUser .title .icon svg {
	width: 25px;
	height: 25px;
	float: right;
	filter: var(--color-svg-black);
}
.swal2-modal .swalUser p {
	width: 100%;
	float: right;
	padding: 10px 0;
	margin: 0 0 10px 0;
	text-align: justify;
	font-size: 13px;
	font-weight: 500;
}
.swal2-modal .swalUser p.form-desc {
	color: var(--color-font-medium);
	margin:0;
	padding:0;
}
.swal2-modal .swalUser p.form-desc.bg {
	width: 96%;
	margin: 10px 2%;
	padding: 10px;
	border-radius: 5px;
	background-color: var(--color-bg-volga-rgba);
}
.swal2-modal .swalUser p.form-desc span.right {
	float: right;
}
.swal2-modal .swalUser p.form-desc span.left {
	font-weight: 600;
	text-align: left;
	float: left;
	color: var(--color-font-black);
}
.swal2-modal .swalUser form.users {
	width: 100%;
	float: right;
	text-align: right;
}
.swal2-modal .swalUser form.users label {
	width: 50%;
	float: right;
	padding: 10px;
	font-weight: 500;
	font-size: 13px;
	text-align: right;
}
.swal2-modal .swalUser form.users label.b100 {
	width: 100%;
}
.swal2-modal .swalUser form.users label.b3 {
	width: 33.33%;
}
.swal2-modal .swalUser form.users label span.label {
	width: 100%;
	float: right;
	margin: 0 0 5px 0;
}
.swal2-modal .swalUser form.users label span.desc {
	width: 100%;
	float: right;
	color: var(--color-font-eggplant);
	font-size: 11px;
	margin: 5px 0 0 0;
}
.swal2-modal .swalUser form.users label a {
	color: var(--color-font-eggplant);
}
.swal2-modal .swalUser form.users label input,
.swal2-modal .swalUser form.users label select {
	width: 100%;
	float: right;
	padding: 10px 5px;
	border: var(--color-border);
	border-radius: 5px;
	background-color: inherit;
}
.swal2-modal .swalUser form.users label input.price-wallet {
	text-align: center;
}
.swal2-modal .swalUser form.users label .star {
	float: right;
	color: var(--color-font-red);
	margin: 0 0 0 5px;
}
.swal2-modal .swalUser form.users .alert {
	width: 100%;
	float: right;
	text-align: right;
	color: var(--color-font-medium);
	font-size: 13px;
	padding: 20px 10px;
}
.swal2-modal .swalUser form.users .box {
	width: 31.33%;
	float: right;
	padding: 5px 0;
	text-align: center;
	border-radius: 5px;
	border: var(--color-border);
	color: var(--color-font-medium);
	margin: 10px 1%;
	font-size: 12px;
	cursor:pointer;
}
.swal2-modal .swalUser form.users .box.active {
	border: var(--color-border-eggplant);
	color: var(--color-font-eggplant);
	font-weight: 600;
}
.swal2-modal .swalUser form.users .alert svg {
	width: 20px;
	height: 20px;
	float: right;
	filter: var(--color-svg-cancel);
	margin: 1px 0 0 5px;
}
.swal2-modal .swalUser form.users button,
.swal2-modal .swalUser form.users .btn {
	width: auto;
	float: left;
	padding: 10px 20px;
	border-radius: 10px;
	background-color: var(--color-bg-eggplant);
	border: var(--color-border-eggplant);
	color: var(--color-font-white);
	border: none;
	margin: 20px 0 0 10px;
	cursor:pointer;
}
.swal2-modal .swalUser form.users .btn.border {
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	border: var(--color-border-eggplant);
	color: var(--color-font-eggplant);
	background-color: inherit;
}
.swal2-modal .swalUser ul.form {
	width: 100%;
	float: right;
	margin: 10px 0;
	padding: 0 10px;
}
.swal2-modal .swalUser ul.form li {
	width: 100%;
	float: right;
	font-size: 11px;
	text-align: right;
	color: var(--color-font-medium);
	margin: 5px 0;
}
.swal2-modal .swalUser ul.form li:after {
	content: '●';
	float: right;
	margin: 0 0 0 5px;
	color: var(--color-font-medium);
}
.swal2-modal .swalUser .column-password {
    display: flex;
    gap: 5px;
    margin-top: 10px;
	padding: 0 10px;
}
.swal2-modal .swalUser .column-password .box {
    width: 33.33%;
    height: 5px;
    background-color: #e0e0e0;
    transition: background-color 0.3s;
	border-radius: 50px;
}
.swal2-modal .swalUser .box.weak {
    background-color: #f44336;
    border-color: #f44336;
}
.swal2-modal .swalUser .box.medium {
    background-color: #ff9800;
    border-color: #ff9800;
}
.swal2-modal .swalUser .box.strong {
    background-color: #4caf50;
    border-color: #4caf50;
}
.swal2-modal .swalUser.comment .img {
	width: auto;
	height: 120px;
	float: right;
	margin: 0 0 0 10px;
}
.swal2-modal .swalUser.comment .img img {
	width: 100%;
	height: 100%;
	float: right;
	object-fit: cover;
}
.swal2-modal .swalUser.comment h2 {
	width: auto;
	float: right;
	font-size: 16px;
	text-align: right;
}
.swal2-modal .swalUser.comment ul.detail {
	width: 100%;
	float: right;
	padding: 15px 0;
	border-bottom: var(--color-border);
	margin: 0 0 15px 0;
}
.swal2-modal .swalUser.comment ul.detail li {
	float: right;
	margin: 0 0 0 10px;
	font-size: 12px;
	color: var(--color-font-medium);
}
.swal2-modal .swalUser.comment ul.detail li:before {
	content: '●';
	float: right;
	margin: 0 0 0 5px;
	font-size: 11px;
	color: var(--color-font-medium);
}
.swal2-modal .swalUser.comment ul.detail li .color_bg {
	width: 18px;
	height: 18px;
	float: right;
	border-radius: 50%;
	margin: 2px 0 0 5px;
	border:1px solid #666;
}
.swal2-modal .swalUser.comment ul.detail li .circle {
	width: 15px;
	height: 15px;
	float: right;
	margin: 3px 0 0 5px;
	background-color: #000;
	border-radius: 50%;
}
.swal2-modal .swalUser.comment .box {
	width: 100%;
	float: right;
	padding: 0 0 15px 0;
	margin: 0 0 15px 0;
	border-bottom: var(--color-border);
}
.swal2-modal .swalUser.comment .box .text {
	float: right;
	font-size: 13px;
	text-align: right;
	color: var(--color-font-black);
	margin:4px 0;
}
.swal2-modal .swalUser.comment .box .rating,
.profile-page .comments .user-comment .product .rating {
    display: flex;
    direction: ltr;
    position: relative;
	float:left;
}
.swal2-modal .swalUser.comment .box .rating .star,
.profile-page .comments .user-comment .product .rating .star {
    width: 30px;
    height: 30px;
    margin: 2px;
    background-color: lightgray;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    cursor: pointer;
    position: relative;
}

.swal2-modal .swalUser.comment .box .rating .star.full,
.profile-page .comments .user-comment .product .rating .star.full {
    background-color: gold;
}

.swal2-modal .swalUser.comment .box .rating .star.half::after ,
.profile-page .comments .user-comment .product .rating .star.half::after {
    content: '';
    width: 50%;
    height: 100%;
    background-color: gold;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    position: absolute;
    left: 0;
    top: 0;
}
.swal2-modal .swalUser.comment .box3 {
	width: 31.33%;
	float: right;
	border: var(--color-border);
	color: var(--color-font-medium);
	padding: 10px;
	border-radius: 10px;
	margin: 15px 1% 0 1%;
	text-align: center;
}
.swal2-modal .swalUser.comment .box3 svg {
	width: 60px;
	height: 60px;
	display: inline-block;
	filter: var(--color-svg-cancel);
}
.swal2-modal .swalUser.comment .box3 p {
	width: 100%;
	float: right;
	text-align: center;
	font-size: 14px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
.swal2-modal .swalUser.comment .box3.active {
	border: var(--color-border-eggplant);
	color: var(--color-font-eggplant);
}
.swal2-modal .swalUser.comment .box3.active svg {
	filter: var(--color-svg-eggplant);
}
.swal2-modal .swalUser form {
	width: 100%;
	float: right;
}
.swal2-modal .swalUser form label {
	width: 100%;
	float: right;
	position: relative;
	text-align: right;
	font-size: 12px;
	color: var(--color-font-medium);
	margin: 5px 0;
}
.swal2-modal .swalUser form label svg.plus {
	width: 30px;
	height: 30px;
	position: absolute;
	top: 33px;
	left: 10px;
	filter: var(--color-svg-cancel);
	cursor: pointer;
	z-index: 33;
}
.swal2-modal .swalUser form input,
.swal2-modal .swalUser form select,
.swal2-modal .swalUser form textarea {
	width: 100%;
	float: right;
	border-radius: 5px;
	padding: 10px;
	margin: 5px 0 0 0;
	background-color: inherit;
	border: var(--color-border);
	color: var(--color-font-medium);
	font-size: 12px;
}
.swal2-modal .swalUser form textarea {
	min-height: 120px;
	max-width: 100%;
	min-width: 100%;
	max-height: 120px;
}
.swal2-modal .swalUser .btn {
	width: 100%;
	float: right;
	padding: 10px 0;
	text-align: center;
	background-color: var(--color-bg-eggplant);
	border: none;
	color: var(--color-font-white);
	border-radius: 5px;
}
.swal2-modal .swalUser ul.item-comment {
	width: 100%;
	float: right;
}
.swal2-modal .swalUser ul.item-comment li {
	width: 100%;
	float: right;
	margin: 5px 0;
	padding: 10px 10px 0 10px;
	border-radius: 5px;
	color: var(--color-font-medium);
	background-color: rgba(255,0,4,0.03);
	position: relative;
}
.swal2-modal .swalUser ul.item-comment.ok li {
	background-color: rgba(19,211,1,0.05);
}
.swal2-modal .swalUser ul.item-comment li:first-child {
	margin: 15px 0 0 0;
}
.swal2-modal .swalUser ul.item-comment li .removeAdd {
	width: 20px;
	height: 20px;
	float: left;
	background-repeat:no-repeat;
	background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyBmaWxsPSIjMDAwMDAwIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiPjwvZz48ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjwvZz48ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxnPiA8Zz4gPHBhdGggZD0iTTMzMS42MzYsNjkuODE4VjBIMTgwLjM2NHY2OS44MThoLTEyOHYxMjhoMzQuOTA5VjUxMmgzMzcuNDU1VjE5Ny44MThoMzQuOTA5di0xMjhIMzMxLjYzNnogTTIxNS4yNzMsMzQuOTA5aDgxLjQ1NSB2MzQuOTA5aC04MS40NTVWMzQuOTA5eiBNMzg5LjgxOCw0NzcuMDkxSDEyMi4xODJWMTk3LjgxOGgyNjcuNjM2VjQ3Ny4wOTF6IE00MjQuNzI3LDE2Mi45MDlIODcuMjczdi01OC4xODJoMzM3LjQ1NVYxNjIuOTA5eiI+PC9wYXRoPiA8L2c+IDwvZz4gPGc+IDxnPiA8cmVjdCB4PSIxNjguNzI3IiB5PSIyNTYiIHdpZHRoPSIzNC45MDkiIGhlaWdodD0iMTYyLjkwOSI+PC9yZWN0PiA8L2c+IDwvZz4gPGc+IDxnPiA8cmVjdCB4PSIzMDguMzY0IiB5PSIyNTYiIHdpZHRoPSIzNC45MDkiIGhlaWdodD0iMTYyLjkwOSI+PC9yZWN0PiA8L2c+IDwvZz4gPGc+IDxnPiA8cmVjdCB4PSIyMzguNTQ1IiB5PSIyNTYiIHdpZHRoPSIzNC45MDkiIGhlaWdodD0iMTYyLjkwOSI+PC9yZWN0PiA8L2c+IDwvZz4gPC9nPjwvc3ZnPg==);
	filter: var(--color-svg-cancel);
}
.swal2-modal .swalUser ul.item-comment li:after {
	content: '-';
	float: right;
	margin: -8.5px 0 0 5px;
	color: red;
	font-size: 22px;
}
.swal2-modal .swalUser ul.item-comment.ok li:after {
	content: '+';
	color: green;
}
.swal2-modal .swalUser span.shaba {
	position: absolute;
	top: 23px;
	left: 22px;
	font-size: 16px;
	font-weight: 400;
	color: var(--color-font-medium);
}

/* Ssilver Box */
.silverBox-container .silverBox {
    max-width: 50vw;
    min-width: unset;
}
.silverBox-container .silverBox h2 {
	width: 100%;
	float: right;
	text-align: right;
	margin: 0 0 10px 0;
	font-size: 16px;
	font-weight: 600;
}
.silverBox-container .silverBox p,
.silverBox-container .silverBox ul {
	width: 100%;
	float: right;
	text-align: justify;
	margin: 0 0 10px 0;
	font-size: 12px;
}
.silverBox-container .silverBox ul {
	padding: 0 10px 0 0;
}
.silverBox-container .silverBox ul li {
	float: right;
	margin: 5px 0;
}
.silverBox-container .silverBox ul li:before {
	content: '●';
	float: right;
	margin: 0 0 0 5px;
}
.silverBox-button-wrapper {
	display: inline-block;
}
@media only screen and (max-width: 1024px) {
  .silverBox-container .silverBox {
    max-width: 90vw;
    min-width: unset;
  }
}

/* Factor Product */
.profile-page .product-tab-box .factor-product {
	width: 100%;
	float: right;
	position: relative;
}
.profile-page .product-tab-box .factor-product .boxFactor {
	width: 100%;
	float: right;
	padding: 20px 0;
	margin: 5px 0;
	border-bottom: var(--color-border);
}
.profile-page .product-tab-box .factor-product .box {
	width: 100%;
	float: right;
}
.profile-page .product-tab-box .factor-product .box.small { width: 20%; }
.profile-page .product-tab-box .factor-product .box.big { width: 80%; }
.profile-page .product-tab-box .factor-product .boxFactor:last-child {
	padding: 20px 0 0 0;
	margin: 0 0;
	border-bottom: none;
}
.profile-page .product-tab-box .factor-product .box img {
	height: 150px;
	display: inline-block;
	border-radius: 5px;
	object-fit: cover;
}
.profile-page .product-tab-box .factor-product ul.factor-detail {
	width: 100%;
	float: right;
	padding: 10px 0;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li {
	width: 100%;
	float: right;
	font-size: 13px;
	margin: 5px 0;
}

.profile-page .product-tab-box .factor-product ul.factor-detail li .color_bg {
	border:1px solid #444;
	width:20px;
	height:20px;
	border-radius:50%;
	float: right;
	margin: 1px 0 0 5px;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li.price {
	width: auto;
	margin: 20px 0 0 0;
	font-weight: 600;
	font-size: 18px;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li span.text {
	float: right;
	color: var(--color-font-medium);
	margin: 0 0 0 10px;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li .color {
	width: 20px;
	height: 20px;
	float: right;
	border-radius: 50%;
	background-color: var(--color-bg_black);
	margin: 2px 0 0 10px;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li span.span-color {
	float: right;
	color: var(--color-font-black);
}
.profile-page .product-tab-box .factor-product ul.factor-detail li .unit {
	width: 22px;
	height: 22px;
	float: left;
	margin: 5px 5px 0 0;
	font-size: 10px;
	font-weight: 600;
	color: var(--color-font-black);
	position: relative;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li .unit .text-1 {
	position: absolute;
	bottom: 0;
	left: 0;
}
.profile-page .product-tab-box .factor-product ul.factor-detail li .unit .text-2 {
	position: absolute;
	top: -6px;
	left: 0;
}

/* ticket */
.ticket {
	width: 100%;
	float: right;
	padding: 40px 0;
}
.ticket h1 {
	width: 100%;
	float: right;
	font-size: 18px;
	text-align: right;
}
.ticket .boxFinger {
	width: 100%;
	float: right;
	padding: 20px;
	border-radius: 10px;
	background-color: #f9f9f9;
	margin: 10px 0;
}
.ticket .boxFinger .msg {
	float: right;
	font-size: 13px;
	text-align: right;
	color: #999;
	margin: 0 0 30px 0;
}
.ticket .boxFinger .addticket {
	float: left;
	font-size: 13px;
	text-align: right;
	color: #999;
	margin: 0 0 30px 0;
	background-color:#fff;	
	padding:5px 10px;
	border-radius:10px;
	border:1px solid #14757c;
	box-shadow:0 2px 10px rgba(20, 117, 124, 0.3);
	color:#14757c;
	cursor:pointer;
}
.ticket .boxFinger .addticket svg {
	margin-right:10px;
	float:left;
	width:20px;
	filter: brightness(0) saturate(100%) invert(30%) sepia(13%) saturate(4980%) hue-rotate(146deg) brightness(106%) contrast(84%);
}
.ticket .boxFinger .tableScroll {
	width: 100%;
	float: right;
	overflow: auto;
}
.ticket .boxFinger .table {
	border-collapse: collapse;
	width: 100%;
}
.ticket .table .button {
	padding:3px 15px;
	border-radius:50px;
	color:#FFF;
	font-weight:500;
	font-size:12px;
	background-color:#555;
}
.ticket .table .button.pending { background-color:#F90; }
.ticket .table .button.publish { background-color:#7ace4c; }
.ticket .table .button.trash { background-color:#707cd2; }
.ticket .table .button.draft { background-color:#4c5667; }
.ticket .table .button.answered { background-color:#7ace4c; }
.ticket .table .button.yes { background-color:#7ace4c; }
.ticket .table .button.close { background-color:#4c5667; }
.ticket .table .button.much { background-color:#f33155; }
.ticket .table .button.average { background-color:#707cd2; }
.ticket .table .button.low { background-color:#c4007d; }
.ticket .table .button.update { background-color:#39F; }
.ticket .table .button.updated { background-color:#e9e9e9; color:#777; }

.ticket .table .btn-svg svg {
	cursor:pointer;
	width:25px;
}
.ticket .boxFinger .table td, .table th {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 8px;
	text-align: center;
	white-space: nowrap;
}
.ticket .boxFinger .table tr:nth-child(even){background-color: #e9e9e9;}
.ticket .boxFinger .table tr:hover {background-color: #ddd;}
.ticket .boxFinger .table th {
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: center;
	background-color: #14757C;
	color: white;
}
.ticket .boxFinger .table .userName {
	display: inline-block;
}
.ticket .boxFinger .table .avatar {
	width: 40px;
	height: 40px;
	float: right;
	overflow: hidden;
	border-radius: 50%;
}
.ticket .boxFinger .table .avatar img {
	width: 100%;
	height: 100%;
	float: right;
}
.ticket .boxFinger .table .name {
	float: right;
	margin: 12px 10px 0 0;
}
.ticket .boxFinger .departeman {
	padding: 2px 15px;
	border-radius: 5px;
	display: inline-block;
	background-color: #2196F3;
	color: #FFF;
}
.ticket .boxFinger .userDetail {
	width: 100%;
	float: right;
	margin: 0 0 30px 0;
}
.ticket .boxFinger .userDetail .avatar {
	width: 40px;
	height: 40px;
	float: right;
	overflow: hidden;
	border-radius: 50%;
}
.ticket .boxFinger .userDetail .avatar img {
	width: 100%;
	height: 100%;
	float: right;
}
.ticket .boxFinger .userDetail .name,
.ticket .boxFinger .userDetail .text {
	float: right;
	margin: 10px 10px 0 0;
	font-weight: 600;
	text-align: right;
}
.ticket .boxFinger .userDetail .text span {
	font-weight: 500;
}

.ticket .formTicket {
	width:100%;
	float:right;
	overflow:hidden;
	display:none;
}
.ticket .formTicket.show {
	display:block;
}
.ticket .formTicket .topBox {
	font-size:14px;
	margin:20px 0;
}
.ticket .formTicket .topBox p {
	font-size:13px;
	font-weight: 500;
	color: #777;
}
.ticket .formTicket .form {
	min-width:100%;
	background-color:#fff;
	border:5px solid rgba(0,0,0,0.05);
	border-radius:10px;
	padding:30px;
	padding-bottom: 50px;
}
.ticket .formTicket .form button {
	border:1px solid #ff5050;
	background-color:#ff5050;
	color:#fff;
	border-radius:5px;
	padding:4px 10px;
	margin-bottom:20px;
	cursor:pointer;
	float:left;
}

.ticket .ticket-msg {
	font-size:13px;
}
.ticket .ticket-msg .top {
	background-color:#555;
	color:#fff;
	padding:5px 15px;
	border-radius:10px;
	font-size:16px;
	width:100%;
	float:right;	
}
.ticket .ticket-msg .top a {
	color:#fff;
}
.ticket .ticket-msg .top a svg {
	width:24px;
	float:left;
	margin-right:5px;
	filter: brightness(0) saturate(100%) invert(100%) sepia(3%) saturate(3901%) hue-rotate(193deg) brightness(118%) contrast(100%);
}
.ticket .ticket-msg .top .left {
	float:left;
}
.ticket .ticket-msg .top .closeTicket {
	background-color:rgba(255,255,255,0.2);
	margin:0 20px;
	border-radius:10px;
	padding:0 4px;
	cursor:pointer;
}
.ticket .ticket-msg .showTicket li {
	margin:10px;
	display:inline-block;
	color:#777;
}
.ticket .ticket-msg .showTicket li span {
	color:#14757C;
}
.ticket .ticket-msg .ticketBox {
	background-color: #fff;
	width:100%;
	float:right;
	border-bottom:1px solid #ccc;
}
.ticket .ticket-msg .ticketBox .topTicket {
    width: 100%;
    float: right;    
    padding: 10px
}
.ticket .ticket-msg .ticketBox .topTicket p {
    width: 100%;
    float: right;
    text-align: right;
    margin: 5px 0
}
.ticket .ticket-msg .ticketBox .topTicket .avatar {
    width: 60px;
    height: 60px;
    float: right;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 0 0 10px;
    border: 5px solid #e0e0e0;
}
.ticket .ticket-msg .ticketBox .topTicket .avatar img {
	float:right;
	width:100%;
}
.ticket .ticket-msg .ticketBox.left .topTicket .avatar {
	float:left;
	border: 5px solid rgba(255,170,0,.5);
	margin: 0 10px 0 0;
}
.ticket .ticket-msg .ticketBox .date,
.ticket .ticket-msg .ticketBox .name {
    margin: 10px 0 0;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}
.ticket .ticket-msg .ticketBox.left .date,
.ticket .ticket-msg .ticketBox.left .name {
	text-align:left;
}
.ticket .ticket-msg .ticketBox .date {
    font-size: 12px;
    font-weight: 300;
    margin: 0;
    color: #999
}
.ticket .ticket-msg .ticketBox .text {
    width: 100%;
    float: right;
    padding: 20px 40px;
	padding-top:10px;
}
.ticket .ticket-msg .upload {
	margin:10px 5px;
	float:left;
}
.ticket .ticket-msg .upload.pic img {
	width:100px;
	height:80px;
	float:right;
	border-radius:10px;
	padding:5px;
	border:1px solid #e0e0e0;
	margin:15px 0px;
}
.ticket .boxHead input, .ticket .boxHead textarea, .ticket .boxHead select {
    width: 100%;
    float: right;
    background-color: #FFF;
    border: 1px solid #ccc;
    border-radius: 5px;
    height: 42px;
    padding: 5px 10px;
    transition: all 1.0s ease-in-out;
    font-size: 13px;
    position: relative;
}
.ticket .boxHead textarea {
    height: auto;
    min-height: 100px;
	max-height:200px;
    max-width: 100%;
    min-width: 100%;
}
.ticket .boxHead span.info {
    width: 100%;
    float: right;
    text-align: right;
    color: var(--color-font-eggplant);
    font-size: 11px;
}
.all-box .ticket .box2, .all-box .ticket .box3, .all-box .ticket .box3-2, .all-box .ticket .box4, .all-box .ticket .box5 {
  margin: 0 0 20px 2%;
}

/* Alert */
.alert {
	width: 100%;
	float: right;
	background-color: #e3f7fc;
	border: 1px solid #b9e7f9;
	padding: 5px 10px;
	border-radius: 10px;
	text-align: right;
	color: #333;
	margin: 10px 0 20px 0;
}
.alert p {
	width: 100%;
	float: right;
	margin: 2.5px 0;
}