@charset "utf-8";
/* CSS Document */
:root{
       --themecolor:#ff7617;
       --themecolor1:#393f4e;
       --themecolor2:#2d394b;
       --blue_color:#4b70e3;
       --green_color:#70cc52;
       --grey_color:#bbb;
       --teal_color:#07b6d2;
       --red_color:#fe2b2b;
       --darkblue_color:#334a90;
       --sidewidth:290px;
       --header_height:60px;
       --header_bg:#ceddea;
       --lightbtn_color:#afcee9;
       --drkgreen_color :#446838;
       --drkblue_color :#384468;
       --drkred_color :#921a1a;
       --drkyellow_color :#b99f15;
       --drkorange_color :#d45111;
       --drkpurple_color :#431792;
       --drkpink_color :#b91982;
       --drkgrey_color :#5b5b5b;
       --msg_delay:3s;
       --yellow_color :#f8d82e;
       --orange_color :#ff8112;
       --purple_color :#8360e5;
       --pink_color :#f66ae0;
       --sidebar_color:#ddf7ff;
}
body
{
       font-family: 'Poppins', sans-serif;
}
.login_page
{
	background: var(--themecolor2);
	display: block;
	width: 100%;
	padding: 0px 10vw;
	min-height: 100vh;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}
.login_page:after
{
	content: "";
	width: 100%;
	height: 0px;
	display: flex;
	position: absolute;
}
.login_box
{
	display: flex;
	padding: 30px;
	border-radius: 10px;
	background: #fff;
	width: 520px;
	max-width: 100%;
	flex-direction: column;
	gap:10px;
	box-shadow: 0px 10px 12px -5px rgba(0,0,0,0.3);
}
.no_headers .header
{
	display: none;
}
.login_logo
{
	display: block;
	height: 50px;
	margin: 30px auto;
	overflow: hidden;
	text-align: center;
}
.login_logo img
{
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
.form_btn
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 10px 20px;
	border-radius: 5px;
	background: var(--themecolor);
	border: none;
	color: #fff;
	transition: all .3s;
}
.form_btn:hover{
	box-shadow: 0px 10px 12px -7px rgba(0,0,0,0.3);
}
.login_flex
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap:15px;
}
.login_link
{
	text-decoration: none;
	font-size: .9em;
	color: var(--themecolor);
	transition: all .3s;
	display: inline-flex;
	align-items: center;
	gap:10px;
}
.login_link:hover{
	color: var(--darkblue_color);
}

.message_box_lg
{
	width: 900px;
	background: #fff;
	border-radius: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 30px;
	box-sizing: border-box;
}
.message_box_img
{
	display: block;
	width:240px;
	max-width: 90%;
	margin: auto;
	margin-top: 30px;
}
.message_box_img img
{
	display: inline-block;
	max-width: 100%;
	max-height: 100%;
}
.message_box_title
{
	margin: 15px auto 15px;
}
.message_box_txt
{
	display: block;
	margin: auto;
	text-align: center;
	max-width: 70%;
	font-size: .9em;
}
.message_box_btns
{
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	gap:15px;
	flex-wrap: wrap;
}
.message_box_btn
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap:10px;
	background: #ddd;
	padding: 5px 15px;
	transition: all .3s;
}
.message_box_btn:hover{
	-webkit-filter:brightness(110%);
	filter:brightness(110%);
	box-shadow: 0px 5px 12px -7px rgba(0,0,0,0.3);
}
.green_btn, .green_btn:hover
{
	background: var(--green_color);
	color: #fff;
}
.grey_btn, .grey_btn:hover{
	background: var(--grey_color);
	color: #444;
}
.blue_btn, .blue_btn:hover{
	background: var(--blue_color);
	color: #fff;
}
.red_btn, .red_btn:hover{
	background: var(--red_color);
	color: #fff;
}
/*btns*/
.btn_green
{
	background: var(--green_color);
	color: #fff;
}
.btn_red
{
	background: var(--red_color);
	color: #fff;
}
.btn_blue
{
	background: var(--blue_color);
	color: #fff;
}
.btn_grey
{
	background: var(--grey_color);
	color: #fff;
}
.btn_orange
{
	background: var(--orange_color);
	color: #fff;
}
.btn_violet
{
	background: var(--violet_color);
	color: #fff;
}
.btn_yellow
{
	background: var(--yellow_color);
	color: #fff;
}
.btn_purple
{
	background: var(--purple_color);
	color: #fff;
}
/*btns*/

.footer
{
	display: block;
	position: relative;
	padding: 15px 30px;
	background: #2b303f;
	background: var(--themecolor2);
	color: #fff;
	font-size: .8em;
	text-align: center;
}
.login_page ~ .footer
{
	position: sticky;
	di splay: none;
	bottom: 0%;
}
.title_404
{
	display: block;
	text-align: center;
	font-size: clamp(2em, 4vw + 2em, 7em);
	font-weight: bold;
	color: var(--themecolor);
}
.account_page
{
	display: block;
	position: relative;
	padding-top: var(--header_height);
	height: auto;
	min-height: calc(100vh - 70px);
}
.account_page:after{
	content: "";
	width: 100%;
	height: 0px;
	display: table;
}
.header
{
	position: fixed;
	width: calc(100% - var(--sidewidth));
	height: var(--header_height);
	background: var(--header_bg);
	left: var(--sidewidth);
	top: 0px;
	z-index: 1999;
}
.account_content
{
	display: block;
	position: relative;
	padding: 30px 30px 0px;
	box-sizing: border-box;
	height: auto;
       min-height: 90vh;
	margin-left: var(--sidewidth);
}
.leftbar_cover
{
	display: block;
	width: var(--sidewidth);
	background: var(--themecolor2);
	height: 100vh;
	max-height: 100vh;
	position: fixed;
	left: 0px;
	top: 0px;
       padding-top: 60px;
}
.header_logo
{
	display: flex;
	box-sizing: border-box;
	align-items: center;
	height: var(--header_height);
	background: var(--header_bg);
       position: absolute;
       inset:0;
}
.desktop_logo
{
	display: block;
	padding: 10px 15px;
	height: 100%;
	width: 100%;
	box-sizing: border-box;
}
.desktop_logo img
{
	display: block;
	max-width: 100%;
	max-height: 100%;
}
.mobile_logo
{
	display: none;
}
.acc_pages .footer
{
	margin-left: var(--sidewidth);
	box-sizing: border-box;
}
.statistics_box
{
	display: flex;
	gap:15px;
	padding: 15px;
	box-sizing: border-box;
	border: 1px solid #ddd;
	border-radius: 10px;
	background: #fff;
	flex-direction: column;
       height: 100%;
}
.statistics_header
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap:15px;
	flex-direction: row-reverse;
}
.statistics_icon
{
	font-size: 1.2em;
	flex-shrink: 0;
       width: 34px;
       height: 34px;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 50%;
       flex-shrink: 0;
}
.statistics_box_title
{
	font-weight: 500;
       font-size: .9em;
}
.statistics_content
{
	display: flex;
	gap:1px;
	flex-direction: column;
}
.statistics_value
{
	font-weight: 600;
	font-size: clamp(2em , .4vw + 1.4em , 1.4em);
}
.statistics_subtxt
{
	font-size: .9em;
	opacity: .7;
}
.content_box
{
	display: block;
	position: relative;
	height: auto;
	border-radius: 10px;
	border: 1px solid #ddd;
	background: rgba(255,255,255,1);
}
.content_box:after
{
	content: "";
	width: 100%;
	height: 0px;
	display: table;
}
.content_box_header
{
	display: flex;
	gap:15px;
	padding: 15px;
	box-sizing: border-box;
	position: relative;
}
.content_box_header:after
{
	content: "";
	width:calc(100% - 30px);
	height: 1px;
	display: block;
	position: absolute;
	background: #eee;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0px;
}
.content_box_title
{
	font-weight: 500;
	font-size: 1.2em;
}
.content_body
{
	width: 100%;
	height: auto;
	padding: 15px;
	box-sizing: border-box;
}
.submit_btn
{
	color: #fff;
	background: #45d082;
	border: none;
}
.submit_btn:is(:hover, .btn.submit_btn:active)
{
	color: #fff;
	background: #3c9b7c;
}
.cancel_btn
{
	background: var(--grey_color);
	border: none;
}
.cancel_btn:is(:hover, .btn.cancel_btn:active)
{
	color: #fff;
	background-color:#444;
}
.breadcrumb_cover
{
	font-size: .8em;
}
.mandatory > label
{
	position: relative;
}
.mandatory > label:before
{
	content: "*";
	margin-right: 5px;
	font-size: 1.1em;
text-align: baseline;
       line-height: 1;
	color: var(--red_color);
}
.img_display
{
	display: block;
	max-width: 100%;
	height: auto;
	overflow: hidden;
	padding: 5px;
	background: #fff;
	border: 1px solid #bbdbf1;
	border-radius: 3px;
}
.content_action_bar
{
	display: flex;
	padding: 15px;
	box-sizing: border-box;
	justify-content: flex-end;
	gap:15px;
	align-items: center;
}
.edit_btn
{
	border: 1px solid #444;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap:10px;
       font-size: .8em;
}
.edit_btn:is(:hover , .btn.edit_btn:active)
{
	background: var(--blue_color);
	color: #fff;
}
.more_actions_btn
{
	background: #fff;
	border: none;
	border-radius: 5px;
}
.more_actions_menu
{
	font-size: .9em;
	padding: 0px 0px;
	background: var(--themecolor1);
	color: #fff;
}
.more_actions_menu .dropdown-item:not(:hover)
{
	color: #fff;
}
.more_actions_menu .dropdown-item:hover{
	background: var(--lightbtn_color);
}
.admin_table :is( td, th)
{
	padding: 15px;
	box-sizing: border-box;
}
.user_display
{
	display: flex;
	gap:10px;
	text-decoration: none;
	color: #444;
}
.user_display_icon
{
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	flex-shrink: 0;
}
.user_display_icon img
{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
	border: 1px solid #ddd;
	padding: 1px;
	background: #eee;
	transition: all .3s;
}
.user_display_icon i
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
	border: 1px solid #ddd;
	padding: 1px;
	background: #fff;
	transition: all .3s;
}
.user_display_info
{
	display: flex;
	gap:3px;
	flex-direction: column;
	flex: 1;
}
.user_display_name
{
	font-size: .9em;
	font-weight: 500;
	line-height: 1;
}
.user_display_subtxt
{
	opacity: .7;
	line-height: 1;
	font-size: .8em;
}
a.user_display:hover{
	color: var(--blue_color);
}
a.user_display:hover .user_display_icon img
{
	border-color: var(--blue_color);
}
a.user_display:hover .user_display_icon i
{
	border-color: var(--blue_color);
}
.table_link
{
	color: var(--blue_color);
	font-size: .9em;
	text-decoration: none;
	transition: all .3s;
}
.table_link:hover{
	color: var(--green_color);
}
.table_tag
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 10px;
	font-size: .8em;
	backgr ound: #fff;
	border-radius: 10px;
	position: relative;
	z-index: 1;
}
.table_tag:after{
	content: "";
	display: block;
	position: absolute;
	z-index: -1;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: #fff;
	opacity: .3;
	border-radius: inherit;
}
.green_tag
{
	color: var(--drkgreen_color);
}
.green_tag:after
{
	background: var(--green_color);
}
.blue_tag
{
	color: var(--drkblue_color);
}
.blue_tag:after
{
	background: var(--blue_color);
}
.red_tag
{
	color: var(--drkred_color);
}
.red_tag:after
{
	background: var(--red_color);
}
.yellow_tag
{
	color: var(--drkyellow_color);
}
.yellow_tag:after
{
	background: var(--yellow_color);
}
.orange_tag
{
	color: var(--drkorange_color);
}
.orange_tag:after
{
	background: var(--orange_color);
}
.purple_tag
{
	color: var(--drkpurple_color);
}
.purple_tag:after
{
	background: var(--purple_color);
}
.pink_tag
{
	color: var(--drkpink_color);
}
.pink_tag:after
{
	background: var(--pink_color);
}
.grey_tag
{
	color: var(--drkgrey_color);
}
.grey_tag:after
{
	background: var(--grey_color);
}
.admin_table
{
	--bs-table-striped-bg:#f3f8fa;
}
.admin_table :is(tr)
{
	border-color: #eee;
}.table_btns
{
	display: flex;
	align-items: center;
	gap:10px;
	flex-wrap: wrap;
}
.table_btn
{
	border: none;
	transition: all .3s;
       position: relative;
       width: 24px;
       height: 24px;
       padding:0px;
       text-align: center;
}
.table_txt_btn
{
       display: flex;
       align-items: center;
       font-weight: 500;
       font-size: .9em;
	border: none;
	transition: all .3s;
       position: relative;
       width: auto;
       gap:7px;
       height: 24px;
       padding:2px 7px;
       text-align: center;
       border-radius: 3px;
}
.table_txt_btn:hover{
       -webkit-filter:brightness(110%);
       filter:brightness(110%);
}
.table_btn i
{
       max-width: 100%;
}
.green_icon
{
	background: var(--green_color);
	color: #fff;
	border: none;
}
.green_icon:is(:hover , .btn.green_icon:active)
{
	background: var(--drkgreen_color);
	color: #fff;
}
.blue_icon
{
	background: var(--blue_color);
	color: #fff;
	border: none;
}
.blue_icon:is(:hover , .btn.blue_icon:active)
{
	background: var(--drkblue_color);
	color: #fff;
}
.red_icon
{
	background: var(--red_color);
	color: #fff;
	border: none;
}
.red_icon:is(:hover , .btn.red_icon:active)
{
	background: var(--drkred_color);
	color: #fff;
}
.orange_icon
{
	background: var(--orange_color);
	color: #fff;
	border: none;
}
.orange_icon:is(:hover , .btn.orange_icon:active)
{
	background: var(--drkorange_color);
	color: #fff;
}
.yellow_icon
{
	background: var(--yellow_color);
	color: #fff;
	border: none;
}
.yellow_icon:is(:hover , .btn.yellow_icon:active)
{
	background: var(--drkyellow_color);
	color: #fff;
}
.grey_icon
{
	background: var(--grey_color);
	color: #fff;
	border: none;
}
.grey_icon:is(:hover , .btn.grey_icon:active)
{
	background: var(--drkgrey_color);
	color: #fff;
}
.purple_icon
{
	background: var(--purple_color);
	color: #fff;
	border: none;
}
.purple_icon:is(:hover , .btn.purple_icon:active)
{
	background: var(--drkpurple_color);
	color: #fff;
}
.pink_icon
{
	background: var(--pink_color);
	color: #fff;
	border: none;
}
.pink_icon:is(:hover , .btn.pink_icon:active)
{
	background: var(--drkpink_color);
	color: #fff;
}
.table_btn:hover:after{
	content: attr(title_tag);
	position: absolute;
	display: block;
	top: -25px;
	left: 50%;
	transform: translatex(-50%);
	color: #fff;
	background: var(--themecolor1);
	z-index: 1;
	padding: 2px 7px;
	font-size: .75em;
	border-radius: 5px;
       white-space: nowrap;
}

.table_result_bar
{
	display: block;
	width: 100%;
	padding: 15px;
	box-sizing: border-box;
	padding-bottom: 0px;
	border-top: 1px solid #eee;
}
.table_result_info
{
	color:#5a7088;
}
.table_result_info span
{
	color: var(--orange_color);
	padding: 0px 5px;
}
.no_result_box
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap:15px;
	flex-direction: column;
	width: 100%;
	margin: 30px auto;
	padding: 30px;
	box-sizing: border-box;
	border: 1px solid #eee;
}
.no_result_icon
{
	font-size: 2em;
	opacity: .5;
}
.page-item
{
	min-width: 30px;
	text-align: center;
}
.active.page-item .page-link
{
	background: var(--orange_color);
	border-color: var(--orange_color);
}
.page-item:not(.active) .page-link
{
	color: var(--drkgrey_color);
}

.rows_filter
{
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap:10px;
	color: #5a7088;
	padding-bottom: 15px;
}
.rows_filter_title
{
	display: block;
	flex: auto;
	font-size: .9em;
}
.rows_filter_select
{
	flex: auto;
	max-width: 50px;
	height: 24px;
	font-size: .8em;
	background: #eee;
	border: 1px solid #ddd;
	border-radius: 7px;
}
.rows_filter_select option
{
	background: #fff;
}
.field_error
{
	border-color: var(--red_color);
}
.header
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap:15px;
}
.leftbar_toggler
{
	display: none;
}
.header_right
{
	display: flex;
	margin-left: auto;
}
.header_menu
{
	display: flex;
	align-items: center;
	gap:15px;
	padding: 0px 15px;
}
.header_ul
{
	display: flex;
	list-style: none;
	align-items: center;
	gap:15px;
	margin: 0px;
	padding: 0px;
}
.header_notif
{

}
.notif_icon
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	position: relative;
	border-radius: 5px;
	background: #fff;
}
.notif_count
{
	display: inline-flex;
	padding: 0px 0px;
	position: absolute;
	top: -5px;
	right:-7px;
	font-size: .6em;
	background: var(--orange_color);
	color: #fff;
	border-radius: 3px;
	min-width: 12px;
	height: 12px;
	text-align: center;
	align-items: center;
	justify-content: center;
}
.notif_list
{
	width: var(--sidewidth);
}
.show.notif_list
{
	max-height: 50vh;
	overflow: hidden;
	overflow-y: auto;
}
.notif_list
{
	scrollbar-width:thin;
}
.notif_ul
{
	list-style: none;
	display: flex;
	flex-direction: column;
	gap:10px;
	margin: 0px;
	padding: 15px;
}
.unread.notif_li
{
	color: var(--orange_color);
}
.notif_item
{
	display: flex;
	flex-wrap: wrap;
	gap:10px;
	padding: 10px;
	box-sizing: border-box;
	border: 1px solid #eee;
	border-radius: 5px;
}
.notif_item_time
{
	width: 100%;
	text-align: right;
	font-size: .8em;
	opacity: .7;
	display: inline-flex;
	gap:5px;
	justify-content: flex-end;
}
.notif_item_right
{
	flex: 1;
	font-size: .9em;
	display: flex;
	flex-direction: column;
	gap:5px;
}
.notif_item_title
{
	font-weight: 500;
	line-height: 1;
}
.notif_item_txt
{
	font-size: .9em;
	line-height: 1.2;
}
.header_user_menu .dropdown-item
{
	display: flex;
	gap:10px;
}
.confirm_popup .modal-footer
{
	border-top: none;
}
.form_msg
{
	display: flex;
	gap:15px;
	padding: 15px;
	box-sizing: border-box;
	max-width: 90%;
	width: 500px;
	position: fixed;
	bottom: 15%;
	right: -120%;
	background: var(--green_color);
	border-radius: 5px;
	color: #fff;
	transition: all .3s;
       z-index: 1199;
}
.active.form_msg
{
	right: 30px;
}
.form_msg .fm_succes_icon
{
	display: flex;
}
.form_msg .fm_error_icon
{
	display: none;
}
.form_msg_icon
{
	padding-top:3px;
}
.error.form_msg
{
	background: var(--red_color);
}
.error.form_msg .fm_succes_icon
{
	display: none;
}
.error.form_msg .fm_error_icon
{
	display: flex;
}
.form_msg_title
{
	font-weight: 500;
}
.form_msg_txt
{
	font-size: .85em;
}
/*sidebar*/
.sidebar_ul
{
	list-style: none;
	padding: 15px 10px;
	margin: 0px;
	display: flex;
	flex-direction: column;
	gap:15px;
       height: auto;
       max-height: 100%;
       overflow: hidden;
       overflow-y: auto;
}
.sidebar_li
{
	display: block;
	position: relative;
}
.sidebar_link
{
	display: flex;
	align-items: flex-start;
	position: relative;
	text-decoration: none;
	color: var(--sidebar_color);
	font-size: .9em;
	padding: 10px 15px;
	border-radius: 7px;
	transition: all .3s;
}
.active.sidebar_link
{
	color: #4ebaf9;
	background: #3a485e;
}
.sidebar_link:hover{
	background: #3a485e;
}

.sidebar_icon
{
	display: flex;
	width: 30px;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #98a3ad;
}
.active.sidebar_link .sidebar_icon
{
	color: #e6e6b6;
}
.sidebar_link span
{
	line-height: 1.2;
	display: flex;
	align-items: center;
	gap:10px;
	flex: 1;
	padding: 0px 10px;
}
.sidebar_sub_ul
{
	list-style: none;
	margin: 0px;
	padding: 0px;
	display: flex;
	flex-direction: column;
}
.sidebar_sub_li
{
	display: block;
}
.sidebar_sub_link
{
	display: flex;
	align-items: center;
	gap:10px;
	font-size: .9em;
	line-height: 1;
	text-decoration: none;
	color: #6798c0;
	padding: 10px 15px;
	box-sizing: border-box;
	border-radius: 7px;
	transition: all .3s;
	min-height: 44px;
}
.sidebar_sub_link:hover{
	background: #3a485e;
}

.sidebar_sub_link i
{
	display: flex;
	width: 30px;
	align-items: center;
	justify-content: center;
}
.has_sub.sidebar_link
{
	padding-right: 45px;
	position: relative;
}
.arrow
{
	display: flex;
	width: 24px;
	height: 24px;
	position: absolute;
	right:15px;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.li_count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: .8em;
	font-weight: 500;
	background: #67bdf0;
	align-self: center;
	color: #fff;
	padding: 0px 3px;
	border-radius: 3px;
}
.active.sidebar_sub_link
{
	color: #e6e6b6;
	background: #3a485e;
}
.sidebar_sub_ul
{

	height: auto;
	max-height: 0px;
	overflow: hidden;
	margin: 0px;
	transition: all .3s;
}
.has_sub
{
	cursor: pointer;
}
.active.has_sub + .sidebar_sub_ul
{
	max-height: 700px;
	margin: 15px 0px;
}
/*sidebar*/
.color1_box
{
	background: #e0e0f2;
}
.color1_box .content_box_header:after
{
	background: #a7afcc;
}
.add_btn
{
	background: var(--green_color);
	color: #fff;
}
.keywords_list
{
	display: flex;
	width: 100%;
	padding: 15px;
	box-sizing: border-box;
	min-height: 150px;
	max-height: 160px;
	overflow: hidden;
	overflow-y: auto;
	border: 1px solid #ddd;
	border-radius: 10px;
	background: #fff;
	gap:10px;
	flex-wrap: wrap;
	align-items: flex-start;
       align-content: flex-start;
}
.keyword_item
{
	display: flex;
	align-items: center;
	padding: 0px 0px 0px 10px;
	border: 1px solid #bbb;
	background: #eee;
	font-size: .8em;
	gap:10px;
	max-width: 100%;
	border-radius: 5px;
}
.keyword_action
{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	border: none;
	background: none;
	color: #777;
	border-radius: 0px;
	transition: all .3s;
}
.keyword_action:hover{
	border-left:1px solid #e6adad;
	background: #f1acac;
	color: #f90000;
}
.step_count
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 3px 7px;
	border-radius: 5px;
	background: #738bc6;
	font-size: .7em;
	gap:5px;
	color: #fff;
}
.selection_box
{
	display: flex;
	flex-direction: column;
	padding: 5px 10px;
	border-radius: 5px;
	background: #f7f7d6;
	gap:5px;
}
.selection_box_title
{
	font-size: .8em;
	color: #777;
	font-weight: 500;
}
.selection_box_value
{
	font-weight: 500;
	font-size: 1.1em;
	color: var(--blue_color);
}

/*.category_set
{
	background: var(--green_color);
}
.category_set .selection_box_title
{
	color: #444;
}
.category_set .selection_box_value
{
	color: #fff;
	font-size: .9em;
}*/

.selection_complete:after{
	content: "\F26A";
	width: auto;
	font-family: "bootstrap-icons";
	position: absolute;
	right: 15px;
	top:15px;
	font-size: 1.2em;
	color: var(-green_color);
}
.selection_complete
{
	background: var(--green_color);
       padding-right: 45px;
	position: relative;
}
.selection_complete .selection_box_title
{
	color: #444;
}
.selection_complete .selection_box_value
{
	color: #fff;
	font-size: .9em;
}


/*campaign sections*/
.tabpane_content
{
	display: block;
	width: 100%;
	padding: 15px;
	box-sizing: border-box;
	border: 1px solid #eee;
	border-top: 0px;
}
.tabpane_title
{
	font-size:1em;
	font-weight: 500;
	color: #2179d9;
}
.campaigns_medias_list
{
	display: block;
	padding: 15px;
	box-sizing: border-box;
	border-radius: 10px;
	border: 1px solid #ddd;
	margin: 15px auto;
	width: 100%;
}
.campaign_media_item
{
	display: flex;
	flex-direction: column;
	gap:10px;
	width: 180px;
}
.campaign_media_pills
{
	display: flex;
	flex-wrap: wrap;
	gap:15px;
}
.campaign_box
{
	display: block;
	width: 100%;
	border: 1px solid #ddd;
	border-radius: 5px;
	background: #fff;
	padding: 15px 0px;
}
.active.campaign_box
{
	background: #a9e2e8;
	border-color: #5aaab3;
}
.campaigns_list
{
	display: flex;
	flex-direction: column;
	gap:15px;
}
.campaign_list_item
{
	display: flex;
	flex-direction: column;
	gap:10px;
	padding: 15px;
	box-sizing: border-box;
	border: 1px solid #ddd;
	border-radius: 10px;
}
.campaign_list_item:nth-child(even)
{
	background: #f7f7ff;
}
.campaign_list_item_header
{
	display: flex;
	justify-content: space-between;
	gap:15px;
	flex-wrap: wrap;
}

.campaign_list_item_left, .campaign_list_item_right {
    /* display: flex; */
    gap: 10px;
    align-items: center;
}
.campaign_list_item_right_in {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: end;
    margin-bottom: 10px;
}
.campaign_list_item_right_bottom {
    float: right;
    display: flex;
    gap: 10px;
}

.campaign_state {
    padding: 2px 8px;
    border: 1px solid #dbf1fe;
    border-radius: 16px;
    background: #dff0ff;
}
/*.campaign_list_item_left, .campaign_list_item_right
{
	display: flex;
	gap:10px;
	align-items: center;
}*/
.campaign_list_item_left
{
	flex-direction: column;
}
.campaign_item_header_info
{
	display: flex;
	flex-direction: column;
	gap:5px;
}
.campaign_no
{
	display: flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	background: #ddd;
}
.campaign_title
{
	font-weight: 500;
	line-height: 1.4;
	word-break: break-word;
}
.campaign_title_desc
{
	font-size: .8em;
	line-height: 1.2;

}
.campaign_date
{
	font-size: .8em;
	display: inline-flex;
	background: #eee;
	border-radius: 30px;
	padding: 2px 10px;
	align-items: center;
	gap:5px;
}
.campaign_date_title{
	font-size: .75em;
	color: #5881b5;
}
.display_flex
{
	display: flex;
	gap:15px;
	align-items: center;
}
.campaign_btn
{
	display: inline-flex;
	gap:10px;
	border: none;
	border-radius: 5px;
	padding: 3px 10px 3px 10px;
	font-size: .8em;
	background: var(--green_color);
	color: #fff;
	align-items: center;
}
.campaign_btn .details_on
{
	display: inline;
}
.campaign_btn .details_off
{
	display: none;
}
.campaign_btn i
{
	display: none;
	width: 24px;
	align-items: center;
	justify-content: center;
	padding: 5px 0px;
	padding: 0px;
	border-left: 1px solid #fff;
}
.active.campaign_btn i
{
	display: flex;
	width: 24px;
}
.active.campaign_btn
{
	background: #2fb3d7;
	color: #fff;
}
.active.campaign_btn .details_off
{
	display: inline;
}
.active.campaign_btn .details_on
{
	display: none;
}
.campaign_list_info
{
	display: block;
	position: relative;
	height: auto;
	overflow: hidden;
	padding: 15px;
	box-sizing: border-box;
}
.campaign_list_info_header
{
	display: flex;
	gap:15px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}
.campagin_info_ul
{
	display: flex;
	align-items: center;
	gap:15px;
	padding-bottom: 0px;
	margin: 0px;
	padding: 0px;
}
.campagin_info_li
{
	padding: 0px;

}
.campagin_info_li + .campagin_info_li
{
	border-left: 1px solid #ddd;
}
.campagin_info_item
{
	display: flex;
	gap:10px;
	padding: 10px 15px;
	box-sizing: border-box;
	margin: 0px;
}
.camp_info_count
{
	font-weight: bold;
}
.camp_info_right
{
	display: flex;
	flex-direction: column;
}
.camp_info_right_title
{
	font-weight: 500;
	font-size: .9em;
}
.camp_info_right_desc
{
	font-size: .75em;
	opacity: .7;
}
.campaign_status
{
	display: block;
	padding: 0px 10px;
}
.campaign_status .status_tag
{
	border: 1px solid ;
	border-radius: 30px;
	padding-right: 10px;
	padding-left: 20px;
	font-size: .8em;
}
.campaign_status .status_tag:before{
	left: 7px;
	top:6px;
	width: 7px;
	height: 7px;
}
.active.campagin_info_ul
{
	bor der-bottom: 1px solid #5aaab3;
}
.active.campagin_info_ul .campagin_info_li + .campagin_info_li
{
	border-left: none;
}
.active.campagin_info_item
{
	background: #a9e2e8;
  border: 1px solid #5aaab3;
	border-bottom: 0px;
	border-radius: 10px 10px 0px 0px;
}
.active.campagin_info_ul .campagin_info_item
{
       cursor: pointer;
}
.active.campagin_info_ul .campagin_info_item:not(.active):hover
{
       background:#cfe5fa;
       cursor: pointer;
       border-bottom: 0px;
	border-radius: 10px 10px 0px 0px;
}
.details_pane > .active
{
	border: 1px solid #5aaab3;
	margin-top: 0px;
       padding: 15px;
       box-sizing: border-box;
       background: #fff;
}
.campsettings_btn
{
	display: inline-flex;
	gap:5px;
	border: none;
	border-radius: 5px;
	padding: 3px 10px 3px 10px;
	font-size: .8em;
	background: var(--blue_color);
	color: #fff;
	align-items: center;
}
.campsettings_btn .details_on
{
	display: inline;
}
.campsettings_btn .details_off
{
	display: none;
}
.campsettings_btn i
{
	display: none;
	width: 24px;
	align-items: center;
	justify-content: center;
	padding: 5px 0px;
	padding: 0px;
	border-left: 1px solid #fff;
}
.show.campsettings_btn i
{
	display: flex;
	width: 24px;
}
.show.campsettings_btn
{
	background: #2fd7ad;
	color: #fff;
	padding-right: 5px;
}
.show.campsettings_btn .details_off
{
	display: inline;
}
.show.campsettings_btn .details_on
{
	display: none;
}
.admin_popup.modal
{
	z-index: 2999;
}
.post_preview :is(.modal-header, .modal-footer){
	background: var(--themecolor2);
	color: #fff;
}
.post_preview .modal-body
{
	background: #dee8f5;
}
.infostatis_box
{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap:5px;
	padding: 15px;
	box-sizing: border-box;
	border-radius: 10px;
	position: relative;
	background: #fff;
	border: 1px solid #ddd;
	flex-wrap: wrap;
}
.infostatis_box_icon
{
	width: 30px;
	height: 30px;
	border-radius: 5px;
	background: #fb8218;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1em;
	margin-left: auto;
	position: relative;
	color: #fff;
}
.infostatis_box_value
{
	font-weight: bold;
	font-size: 1.4em;
	flex: 1;
}
.infostatis_box_title
{
	font-size: .9em;
	opacity: .7;
	width: 100%;
	line-height: 1.2;
}
.campaign_list_info_header_left, .campaign_list_info_header_right
{
	flex:auto;
	min-width: calc(45% - 15px);
}
.campaign_time_line
{
	display: flex;
	gap:10px;
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 5px;
	flex-wrap: wrap;
	flex: 1;
	background: #eee;
	justify-content: space-between;
}
.campaign_time_line > span
{
	font-size: .9em;
}
.keywords_list
{
	display: flex;
	padding: 15px;
	box-sizing: border-box;
	border: 1px solid #eee;
	border-radius: 7px;
	gap:15px;
	flex-wrap: wrap;
}
.keyword
{
	display: inline-block;
	font-size: .75em;
	padding: 3px 10px;
	border-radius: 30px;
	background: #eee;
	color: #444;
	cursor: default;
	transition: all .3s;
	word-break: break-word;
}
.keyword:hover{
	background: #d0e6e8;
}
/*campaign sections*/

.search_bar
{
	display: flex;
	padding: 15px;
	box-sizing: border-box;
	border-bottom: 1px solid #ddd;
}
.search_btn
{
	background: var(--themecolor);
	color: #fff;
	transition: all .3s;
}
.btn.search_btn:hover{
	background: var(--blue_color);
	color: #fff;
	-webkit-filter: brightness(110%);
	filter: brightness(110%);
       box-shadow: 0px 10px 12px -10px rgba(0,0,0,0.3);
}
.filter_btn
{
	background: var(--themecolor);
	color: #fff;
	transition: all .3s;
}
.btn.filter_btn:hover
{
	background: var(--blue_color);
	color: #fff;
	-webkit-filter: brightness(110%);
	filter: brightness(110%);
	box-shadow: 0px 10px 12px -10px rgba(0,0,0,0.3);
}
/*user profile */
.dashboard_header
{
	display: flex;
	align-items: center;
	box-sizing: border-box;
	flex-wrap: wrap;
	gap:30px;
	justify-content: space-between;

}
.dashboard_header_left, .dashboard_header_right
{
flex-shrink: 0;
}
.dashboard_header_left
{
	border-radius: 10px;
	padding: 30px 5px 5px;
	position: sticky;
	top:90px;
	background: linear-gradient(45deg, #8aa8d6,#7ed6f3 ,#8aa8d6);
}
.dashboard_header_right
{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	flex: 1;
}
.user_display_lg
{
	display: flex;
	flex-direction: column;
	gap:5px;
	color: #fff;
	text-shadow: 0px 1px 2px rgba(0,0,0,.3);
}
.user_info
{
	text-align: center;
}
.user_img_box
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #19dcff;
	position: relative;
	margin: auto;
}
.writer_info_right
{
	display: flex;
	gap:15px;
	align-items: center;
	justify-content: center;
}
.user_img
{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.user_img_btn
{
	display: flex;
	position: absolute;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	border-radius: 50%;
	border: none;
	background: rgba(0,0,0,0.5);
	color: #fff;
	transition: all .3s;
	opacity: 0;
}
.user_img_btn i
{
	font-size: 1.4em;
}
.user_img_btn span
{
	font-size: .8em;
}
.user_img_box:hover .user_img_btn
{
	opacity: 1;
}
.user_name
{
	font-size: clamp(1.2em, 1.2em + .5vw , 2em);
}
.verified_user
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap:5px;
	white-space: nowrap;
	text-shadow: none;
}
.verified_user span
{
	background: #19dcff;
	padding: 2px 5px;
	font-size: .8em;
	border-radius: 5px;
	font-weight: 500;
}
.user_subtitle
{
	font-size: .9em;
}
.membership_note
{
	display: inline-flex;
	border: 1px solid #fff;
	padding: 3px 15px;
	border-radius: 30px;
	gap:15px;
	font-size: .9em;
}
.join_time
{
	color: #000;
	text-shadow: none;
}
.profile_banner
{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	margin: 15px 0px;
	display: block;
	min-height: 100px;
	text-align: right;
}
.profile_banner_img
{
	position: relative;
	z-index: 10;

}
.profile_title
{
	font-weight:bold;
	position: absolute;
	z-index: 100;
	font-size: 1.6em;
	color: #fff;
	right: 45px;
	top:50%;
	transform: translateY(-50%);
	text-shadow: 0px 10px 15px rgba(0,0,0,0.2);
}
.dashboard_header .article_items
{
	background: none;
	border: none;
}
.dashboard_header .article_items .article_icon
{
	font-size: 1.4em;
}
.dashboard_header .article_item_txt, .article_item_title
{
	/*color: #fff;
	opacity: 1;
       text-shadow: 0px 1px 3px rgba(0,0,0,0.4);*/
	text-decoration: none;
}
.dashboard_header .breadcrumb_public
{
	margin-left: auto;
}
.dashboard_header .breadcrumb_public .breadcrumb
{
	margin-bottom: 0px;
}
.dashboard_content
{
	display: block;
	width: 100%;
	padding:30px 30px;
	box-sizing: border-box;
	background: #f8f8f8;
	background: #f4f7fd;
       background: none;
	height: auto;
	min-height: 85vh;
	border-radius: 10px;
}
.dashboard_box
{
	display: block;
	padding: 15px;
	box-sizing: border-box;
	background: #fff;
	border-radius: 10px;
	border: 1px solid #bbb;
	height: 100%;
}
.dashboard_box_title
{
	font-size: .9em;
	font-weight: 300;
	opacity: .7;
	text-transform: uppercase;
}
.dashboard_menu_cover
{
	display: flex;
	width: 100%;
	min-height: 75vh;
	align-items: center;
	position: sticky;
	top: 0px;
}
.dashboard_menu
{
	list-style: none;
	display: flex;
	flex-direction: column;
	gap:10px;
	font-size: .9em;
	margin: auto 0px;
	padding: 0px 10px;
	width: 100%;
}
.dashboard_li:not(:last-child)
{
	display: block;
	border-bottom: 1px solid #eee;
	padding-bottom: 10px;
}
.dashboard_link
{
	display: flex;
	align-items: center;
	gap:10px;
	text-decoration: none;
	color: #182442;
	padding: 5px 10px;
	position: relative;
	transition: all .3s;
}
.dashboard_link:hover
{
	color: var(--themecyan);
}
.dashboard_link i
{
	color: #4f66b6;
}
.dashboard_link:hover i
{
	color: var(--themecyan);
}
.active.dashboard_link
{

}
.active.dashboard_link:after
{
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	display: block;
	z-index: -1;
	left: 0px;
	opacity: .5;
	border-radius: 5px;
	background:  linear-gradient(45deg, rgba(255,255,255,0),#8aa8d6,#7ed6f3 ,#8aa8d6, rgba(255,255,255,0));

}
.section_title
{
	font-size: .9em;
	font-weight: 300;
	color: #4f66b6;
	margin-bottom: 15px;
}
.dashboard_box_footer
{
	display: flex;
	justify-content: space-between;
}
.view_all
{
	display: inline-flex;
	align-items: center;
	gap:10px;
	font-size: .8em;
	color: #444;
	text-decoration: none;
}
.comment_item
{

	padding: 15px;
	box-sizing: border-box;
}
.comment_item_header
{
	display: flex;
	gap:15px;
	text-decoration: none;
	color: #000;
	padding-bottom: 15px;
}
.blog_title
{
	text-decoration: none;
	line-height: 1.2;
}
.comment_text
{
	display: block;
	padding: 15px;
	box-sizing: border-box;
	border-radius: 10px;
	background: #f2ffff;
	font-size: .9em;
	;line-height: 1.4;
	color:#444;
	position: relative;
	width: 100%;
	height: auto;
}
.comment_text:before{
	content: "\F6B0";
	font-family: bootstrap-icons;
	color: #4599f9;
	font-size: 2em;
	position: absolute;
	top: -15px;
	left: -10px;

}
.comment_text:after
{
	content: "";
	width: 100%;
	height: 0px;
	display: table;
}
.comments_slider_cover
{
	padding: 15px 30px 0px;
	position: relative;
}
.prev_arrow, .next_arrow
{
	display: block;
	position: absolute;
	width: 30px;
	height: 30px;
	background: transparent;
	border: 5px solid #4f66b6;
	border-right: none;
	border-bottom: none;
	top: 45%;
	cursor: pointer;
	transform: translateY(-50%);
	transition: all .3s;
}
.prev_arrow:hover, .next_arrow:hover{
	border-color: var(--themecyan);
}
.prev_arrow
{
	transform: rotate(-45deg);
	left: -15px;
}
.next_arrow
{
	right: -15px;
	transform: rotate(-225deg);
}


.image_preview_box, .image_croper_box {
  display: none;
  text-align: center;
}
.active.image_preview_box, .active.image_croper_box {
  display: block;
}
.active.image_croper_box {
  margin-top:30px;
}
.active.image_preview_box .croped_img_preview {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
  background: var(--themeblue);
  border: 1px dashed var(--themecolor);
  border-radius: 50%;
  margin: 30px auto;
  width: 150px;
  max-width: 100%;
  object-fit: contain;
}
.hidden
{
	display: none;
}
.cancel_btn {
  background: #bbb;
  border: none;
  color: #fff;
  box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
}
.crop_btn, .btn.crop_btn:hover
{
	background: var(--orange_color);
	color: #fff;
}
.btn.crop_btn:hover
{
	background: var(--blue_color);
}
.cropper_modal .modal-header
{
	background: linear-gradient(45deg, #8aa8d6,#7ed6f3 ,#8aa8d6);
	color: #fff;
}
.cropper_modal .modal-footer
{
	background: #fff;
}
.crop_save_btn
{
	background: var(--green_color);
	color: #fff;
}
.btn.crop_save_btn:hover{
	background: var(--green_color);
	color: #fff;
}
.my_activity_item .comment_item
{
	flex-direction: column;
	gap:5px;
}
.stats_box
{
	display: flex;
	align-items: center;
	justify-content: center;
	gap:5px;
	flex-direction: column;
	background: rgba(255,255,255,1);
	padding: 30px;
	box-sizing: border-box;
       border: 1px solid #ddd;
	border-radius: 10px;
	transition: all .3s;
}
.stats_box_icon
{
	display: flex;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #f4f7fd;
	align-items: center;
	justify-content: center;
	font-size: 1.4em;
}
.stats_box_value
{
	font-size: 2em;
	font-weight: bold;
	line-height: 1;
}
.stats_box_title
{
	font-size: .9em;
	font-weight: 500;
	opacity: .7;
}
.stats_box_link
{
	font-size: .8em;
	text-decoration: none;
	color: var(--green_color);
	transition: all .3s;
}
.stats_box_link:hover{
	color: var(--orange_color);
}
.stats_box:hover{
	box-shadow: 0px 30px 22px -15px rgba(0,0,0,0.05);
}
.social_media_accounts
{
	display: flex;
	gap:30px;
	flex-wrap: wrap;
	padding: 15px 0px;
}
.social_media_title
{
	font-weight: 500;
	font-size: 1.2em;
	max-width: 150px;
	line-height: 1.2;
}
.social_media_list
{
	display: flex;
	gap:30px;
	flex-wrap: wrap;
	align-items: center;
	flex: 1;
}
.social_media_item
{
	display: block;
	position: relative;
}
.sm_item_icon
{
	display: flex;
	width: 50px;
	height: 50px;
	border-radius: 5px;
	border: 1px solid #444;
	align-items: center;
	justify-content: center;
	position: relative;
	font-size: 1.4em;
       cursor: pointer;
}
.socialmedia_popup .modal-content
{
	background: linear-gradient(45deg, #8aa8d6,#7ed6f3 ,#8aa8d6);
}
.socialmedia_popup :is(.modal-header, .modal-footer)
{
	border: none;
}
.sm_item_box
{
	display: flex;
	padding: 15px;
	box-sizing: border-box;
	background: rgba(255,255,255,0.43);
	border-radius: 10px;
	flex-direction: column;
}
.socialmedia_popup .btn.cancel_btn
{
	background: #444;
	color: #fff;
}
.active.social_media_item:before{
	content: "\F26A";
	font-family: bootstrap-icons;
	color: var(--green_color);
	position: absolute;
	right:-10px;
	top: -5px;
	z-index: 100;
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: #fff;
	border-radius: 50%;
}

.sm_item_title
{
	font-weight: bold;
	font-size: 1.2em;
}
.sm_item_note
{
	font-size: .9em;
	font-weight: 400;
}
.sm_item_form
{
	display: flex;
	gap:10px;
	padding: 15px 0px;
}
.sm_add
{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2px 7px;
	border-radius: 5px;
	background: var(--green_color);
	color: #fff;
	border: none;
	transition: all .3s;
}
.sm_add:hover{
	box-shadow: 0px 10px 12px -7px rgba(0,0,0,.3);
}
.sm_remove
{
	display: flex;
	align-items: center;
	justify-content: center;
	padding:0;
	width: 30px;
	border-radius: 5px;
	background: var(--red_color);
	color: #fff;
	border: none;
	transition: all .3s;
}
.sm_remove:hover{
	box-shadow: 0px 10px 12px -7px rgba(0,0,0,.3);
}
.btn.cancel_btn:hover{
	background: #444;
	color: #fff;
}
.submit_btn
{
	background: linear-gradient(45deg, #8aa8d6,#7ed6f3 ,#8aa8d6);
	color: #fff;
	border: none;
	transition: all .3s;
	display: inline-flex;
	align-items: center;
	gap:10px;
}
.submit_btn:hover{
	box-shadow: 0px 10px 12px -7px rgba(0,0,0,0.3);
}
.verify_btn
{
	border: none;
	background: var(--themecyan);
	color: #fff;
	transition: all .3s;
}
.btn.verify_btn:hover{
	background: var(--themecyan);
	box-shadow: 0px 10px 12px -7px rgba(0,0,0,0.3);
}
.display_box
{
	display: flex;
	padding: 15px;
	box-sizing: border-box;
	border-radius: 10px;
	background: #fff;
	flex-direction: column;
	gap:5px;
}
.display_box_header
{
	display: flex;
	align-items: center;
	gap:15px;
	padding: 0px 30px 15px;
}
.display_box_icon
{
	display: flex;
	width: 50px;
	height: 50px;
	align-items: center;
	justify-content: center;
	font-size: 1.4em;
	background: #ccedff;
	border-radius: 5px;
	flex-shrink: 0;
}
.display_box_title
{
	font-weight: 500;
}
.display_box_subtitle
{
	font-size: .8em;
	opacity: .7;
}
.display_box_header_info
{
	display: flex;
	flex-direction: column;
	flex: 1;
}
.display_box_content
{
	display: block;
	padding: 15px;
	height: auto;
	overflow: hidden;
}
.msg_box
{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 30px 15px;
	box-sizing: border-box;
	flex-direction: column;
	border-radius: 10px;
	background: repeating-linear-gradient(45deg, #f7f7f7 0, #f7f7f7 15px, transparent 15px, transparent 30px);
}
.success.msg_box
{
	background: repeating-linear-gradient(45deg, #eef9ef 0, #eef9ef 15px, transparent 15px, transparent 30px);

}
.msg_title
{
	font-weight: bold;
	font-size: 1.2em;
}
.success.msg_box .msg_title
{
	color: var(--green_color);
	text-shadow: 0px 7px 9px rgba(0,0,0,0.1);
}
.msg_txt
{
	font-size: .9em;
	opacity: .7;
}
.email_display
{
	display: flex;
	padding: 10px 0px;
	box-sizing: border-box;
	width: 100%;
	background: #fff;
	gap:15px;
	flex-wrap: wrap;
}
.email_address
{
	display: flex;
	width: 50%;
	flex: 1;
	border-radius: 0px;
	background: #fff;
	border-bottom: 2px solid #eee;
	padding: 10px 10px;
}
.email_status
{
	display: flex;
	align-items: center;
	justify-content: center;
}
.email_status .verified
{
	display: none;
}
.email_status .verified span
{
	color: #fff;
}
.email_status .no_verified
{
	display: inline-flex;
	font-size: .8em;
	background: var(--orange_color);
	color: #fff;
	border-radius: 5px;
	padding: 3px 10px;
}
.active.email_status .verified
{
	display: inline-flex;
}
.active.email_status .no_verified
{
	display: none;
}
.mandatory label:before{
	content: "*";
	color: var(--red_color);
	margin-right: 3px;
	font-size: 1.2em;
	line-height: 1;
}
.footer_txt_link
{
	font-size: .9em;
	text-decoration: none;
	color: #444;
	transition: all .3s;
}
.footer_txt_link:hover{
	color: var(--orange_color);
}
.comment_reply
{
	padding-left: 15px;
	border-left: 1px solid #ddd;
	margin-top: 30px;
}
.page_bg
{
	backg round: #f6f6f6;
	min-height: 70vh;
	padding: 15px;
	box-sizing: border-box;
	border-radius: 15px;
}
.download_btn
{
	display: inline-flex;
	gap:15px;
	background: var(--themecyan);
	color: #fff;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0px 15px;
	border-radius: 5px;
	text-decoration: none;
	width: 200px;
	max-width: 100%;
	transition: all .3s;
}
.download_btn:hover{
	box-shadow: 0px 10px 22px -10px rgba(0,0,0,.3);
}

.profile_status_box
{
	display: flex;
	align-items: center;
	 background: rgba(255,255,255,1);
	gap:30px;
	margin: 10px 0px;
	padding: 5px 10px 5px 10px;
	border-radius: 5px;
}
.profile_status_state
{
	font-size: .8em;
	color: #000;
	display: flex;
	flex-direction: column;
	gap:5px;
	align-items: flex-start;
	margin-bottom: 10px;
	background: rgba(255,255,255,1);
	width: 100%;
}
.profile_status
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap:10px;
	padding: 5px 10px;
	border-radius: 30px;
	color: #fff;
	flex-shrink: 0;
}
.active.profile_status_box  .profile_status
{
	background: var(--green_color);
}
:not(.active).profile_status_box  .profile_status
{
	background: var(--grey_color);
}
.profile_status :is(.stats_on, .stats_of)
{
	display: inline-flex;
	gap:10px;
	align-items: center;
	white-space: nowrap;
}
:not(.active).profile_status_box .profile_status .stats_of
{
	display: inline-flex;
}
:not(.active).profile_status_box .profile_status .stats_on
{
	display: none;
}
.active.profile_status_box .profile_status .stats_on
{
	display: inline-flex;
}
.active.profile_status_box .profile_status .stats_of
{
	display: none;
}
.activate_btn
{
	display: flex;
	align-items: center;
	border-radius: 5px;
	border: none;
	padding: 3px 10px;
	width: 100%;
	margin-top: 10px;
	justify-content: center;
	background: var(--green_color);
	color: #fff;
	gap:10px;
	box-shadow: 0px 10px 12px -10px rgba(0,0,0,.5);
}
.active.profile_status_box .activate_btn
{
	color: #fff;
	background: #444;
}
:not(.active).profile_status_box .activate_btn
{
	background: #baf1ff;
	color: #195a80;
}
.activate_btn:is (.stats_on, .stats_of)
{
	display: none;
}
.active.profile_status_box .activate_btn .stats_of
{
	display: inline-flex;
	gap:10px;
}
.active.profile_status_box .activate_btn .stats_on
{
	display: none;
}
:not(.active).profile_status_box .activate_btn .stats_on
{
	display: block;
}
:not(.active).profile_status_box .activate_btn .stats_of
{
	display: none;
}
.image_preview_box, .image_croper_box {
  display: none;
  text-align: center;
}
.active.image_preview_box, .active.image_croper_box {
  display: block;
}
.active.image_croper_box {
  margin-top:30px;
}
.active.image_preview_box .croped_img_preview {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
  background: var(--themeblue);
  border: 1px dashed var(--themecolor);
  border-radius: 50%;
  margin: 30px auto;
  width: 150px;
  max-width: 100%;
  object-fit: contain;
}
.hidden
{
	display: none;
}
.cancel_btn {
  background: #bbb;
  border: none;
  color: #fff;
  box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
}
.crop_btn, .btn.crop_btn:hover
{
	background: var(--orange_color);
	color: #fff;
}
.btn.crop_btn:hover
{
	background: var(--blue_color);
}
.cropper_modal .modal-header
{
	background: linear-gradient(45deg, #8aa8d6,#7ed6f3 ,#8aa8d6);
	color: #fff;
}
.cropper_modal .modal-footer
{
	background: #fff;
}
.crop_save_btn
{
	background: var(--green_color);
	color: #fff;
}
.btn.crop_save_btn:hover{
	background: var(--green_color);
	color: #fff;
}
.profile_menu
{
	list-style: none;
	display: flex;
	margin: 25px 0px 0px;
	padding: 0px;
	gap:15px;
	background: rgba(255,255,255,1);
	padding: 15px;
	box-sizing: border-box;
	border-radius: 5px;
}
.profile_li
{
	width: 100%;
}
.profile_li:not(:last-child)
{
	display: block;
	width: 100%;
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
}
.profile_menu_link
{
	display: flex;
	padding: 5px 10px;
	box-sizing:border-box;
	gap:15px;
	border-radius: 5px;
	width: 100%;
	text-decoration: none;
	color: #444;
}
.active.profile_menu_link
{
	color: #215675;
	background:  #d4f1f7;
}
.active.profile_menu_link i
{
	color: var(--orange_color);
}
.comment_preview_txt
{
	padding: 0px 5px;
	box-sizing: border-box;
	overflow: hidden;
	background: #fff;
	border-radius: 5px;
	border: 1px solid #ddd;
	font-size: .8em;
	position: relative;
	display: -webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	text-overflow: ellipsis;

}


.content_box_right
{
	display: flex;
	flex: 1;
	justify-content: flex-end;
	gap:15px;
	align-items: center;
}
.status_tag
{
	display: inline-flex;
	font-size: .8em;
	padding: 5px 5px 5px 15px;
	position: relative;
	line-height: 1;
	margin-bottom: 15px;
}
.status_tag:before{
	content: "\F28A";
	font-family: "bootstrap-icons";
	font-size: .6em;
	font-weight: bold;
	position: absolute;
	left: 0px;
	top: 9px;
}
.status_tag.green_tag
{
	color: var(--green_color);
}
.status_tag.red_tag
{
	color: var(--red_color);
}
.chart_box {
	padding: 30px;
	border: 1px solid #ddd;
	border-radius: 10px;
	background: #fff;
	margin: 25px 0;
       max-height: 500px;
}
.subcategory_breadcrumbs {
    float: left;
    width: 100%;
}
.subcategory_breadcrumbs ul {
	padding: 0;
	float: left;
	width: 100%;
}
.subcategory_breadcrumbs ul li {
	float: left;
	list-style: none;
}
.subcategory_breadcrumbs ul li a {
	float: left;
	height: 34px;
	background: #fb6f0e;
	display: flex;
	align-items: center;
	margin-right: 4px;
	padding: 0 12px 0 20px;
	position: relative;
	text-decoration: none;
	color: #fff;
    font-size: 15px;
	transition: .2s all;
}
.sub_start a {
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}
.sub_end a {
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}
.sub_start a::after, .sub_nxt a::after {
	content: "";
	border-top: 17px solid transparent;
	border-bottom: 17px solid transparent;
	border-left: 17px solid #ff7617;
	position: absolute;
	right: -17px;
	top: 0;
	z-index: 1;
	transition: .2s all;
}
.sub_nxt a::before, .sub_end a::before {
	content: "";
	border-top: 17px solid transparent;
	border-bottom: 17px solid transparent;
	border-left: 17px solid #fff;
	position: absolute;
	left: 0;
	top: 0;
	transition: .2s all;
}
.sub_nxt a {
	padding: 0 12px 0 30px !important;
}
.sub_end a {
	padding: 0 20px 0 30px !important;
}
#sub1 a::after {
	border-left-color: #fb6f0e;
}
#sub2 a {
	background: #ff8534;
}
#sub2 a::after {
	border-left-color: #ff8534;
}
#sub3 a {
	background: #ff9d59;
}
.subcategory_breadcrumbs ul li a:hover {
	background: #363d47 !important;
}
.subcategory_breadcrumbs ul li a:hover:after {
	border-left-color: #363d47 !important;
}

/*user profile */
.help_box
{
	display: flex;
	gap:15px;
	border: 1px dashed #777;
	border-radius: 10px;
	padding: 15px;
	box-sizing: border-box;
	background: #e5edff;
}
.help_box_txt
{
       font-size: .9em;
}
.help_box_icon
{
       flex-shrink: 0;
}
.use_ai_in {
  background: #ededf9;
  padding: 5px 20px;
  border-radius: 10px;
  border: 1px solid #e2e2ff;
}
.g-ai-bt {
  border: 1px solid #dee2e6;
  width: 120px;
  margin: 10px 20px 20px 0;
}
.g-ai-bt:hover {
  color: #212529;
  background: #dee2e6;
}
.g-ai-bt.active {
  color: #fff;
  background: #3c9b7c;
  border-color: #3c9b7c;;
}
/* amal start */
#use_ai {
  display: none;
}
.blog-img-preview {
  width: 100%;
  max-width: 350px;
  background: #f8f8ff;
  border-radius: 10px;
}
.img-section {
  display: flex;
  width: 100%;
  height: auto;
  overflow: hidden;
  aspect-ratio: 3/2;
  border-radius: 10px;
  object-fit: contain;
  position: relative;
}
.img-section img {
min-width: 100%;
min-height: 100%;
margin: auto;
}
.prvw-img-delete {
  position: absolute;
  width: 36px;
  height: 30px;
  background: #ff7618;
  border-radius: 5px;
  right: 8px;
  bottom: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: .2s all;
}
.prvw-img-delete:hover {
  background: #ed6000;
}
.prvw-img-delete i {
  color: #fff;
}
.generated-rslt h4 {
  font-size: 18px;
  margin-bottom: 10px;
}
.regenerate-img {
  position: absolute;
  left: 8px;
  bottom: 8px;
  height: 30px;
  font-size: 15px;
  padding: 0 10px;
  border-radius: 5px;
  gap: 7px;
  cursor: pointer;
}
#use_ai.active {
display: flex !important;
  gap: 15px;
  align-items: flex-start;
}
.use_ai_in.active {
  width: 55%;
}
.blog-preview.active {
  width: 45%;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 15px;
}
.preview-head h4 {
  font-size: 17px;
  margin-top: 5px;
  margin-bottom: 0;
}
.preview-head p {
  font-size: 13px;
  color: #868686;
}
.preview-cnt p {
  font-size: 14px;
  color: #6c6c6c;
}
.preview-img {
  border-radius: 7px;
  overflow: hidden;
}
.preview-img img {
  width: 100%;
}
.loader {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: inline-block;
	position: relative;
	border: 3px solid;
	border-color: #86B8E0 #86B8E0 transparent transparent;
	box-sizing: border-box;
	animation: rotation 1s linear infinite;
  }

.loader::after, .loader::before {
	content: '';
	box-sizing: border-box;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	border: 3px solid;
	border-color: transparent transparent #ff7416 #ff7416;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	box-sizing: border-box;
	animation: rotationBack 0.5s linear infinite;
	transform-origin: center center;
  }
  .loader::before {
	width: 24px;
	height: 24px;
	border-color: #86B8E0 #86B8E0 transparent transparent;
	animation: rotation 1.5s linear infinite;
  }
.Generate-loader {
  background: ghostwhite;
  padding: 20px;
  text-align: center;
  margin-bottom: 20px;
  border-radius: 10px;
  transition: .3s all;
  display: none;
}
.Generate-image-loader {
  text-align: center;
  padding: 15px 20px;
  display: none;
  transition: .3s all;
}
.loader-text {
  font-size: 14px;
  font-weight: 600;
  color: #292929;
}
/* amal end */

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotationBack {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
.chart_container
{
  width: 100%;
  	max-height: 450px;
  	height: 400px;
  	padding: 15px;
  	box-sizing: border-box;
  	display: flex;
  	align-items: center;
  	justify-content: center;
}


.big_img_box
{
	display: block;
	width: 50%;
	padding: 15px;
	box-sizing: border-box;
	min-height: 135px;
	height: auto;
	overflow:hidden;
	border: 1px solid #ddd;
}
.big_img
{
	display: inline-block;
	max-width: 100%;
}
.big_img_preview
{
	display: none;
	width: auto;
	max-width: 100%;
	min-height: 150px;
	aspect-ratio: 16/9;
	object-fit: contain;
}
.active .big_img_preview
{
	display: block;
	max-height: 100%;
	margin: auto;
	max-width: 100%;
}
.big_image_preview_box
{
	display: none;
	width: auto;
	max-width: 100%;
	min-height: 150px;
	aspect-ratio: 16/9;
	object-fit: contain;
}
.active.big_image_preview_box
{
	display: flex;
	max-width: 500px;
	margin: auto;
       aspect-ratio: 16/9;
	object-fit: contain;
       align-items: center;
       justify-content: center;
	border: 1px solid #eee;
}
.modal-open .header
{
       z-index: 999;
}
/* responsive design*/
@media screen and (max-width:1999px)
{
       .profile_statis_list
       {
              flex-direction: column;
              width: 100%;
       }
       .profile_statis_li
       {
              width: 100%;
       }
       .profile_statis_li + .profile_statis_li:before
       {
              width: 100%;
              height: 1px;
              left: 0px;
              top: -5px;
       }
}