/************************
 *     Variables
 ***********************/
:root{
	/******* colors *********/
	--transp-grey-1: rgba(0, 0, 0, .2);
	--transp-grey-2: rgba(180, 180, 180);
	--lightgrey-1: rgb(210, 210, 210);
	--lightgrey-2: rgb(240, 240, 240);
	/******* borders ********/
	--bord-1: 1px solid rgba(0, 0, 0, .2);
	--bord-2: 1px solid rgba(180, 180, 180);
	--bord-rad-1: 5px;
	--bord-rad-100: 100px;
	/***** box shadows ******/
	--box-shad-1: 0 3px 10px -3px rgba(0, 0, 0, .2);
	--box-shad-2: 0px 3px 5px -2px rgba(0, 0, 0, .2);
	/***** animation *******/
	--transi-dur-1: .2s;
}


/************************
 *   Globals Classes
 ***********************/
.FRTWOOMGMTLinkStyles, button.FRTWOOMGMTLinkStyles, input.FRTWOOMGMTLinkStyles{
	background: transparent !important;
	border: none !important;
	color: unset !important;
}
.FRTWOOMGMTLinkStyles:hover, button.FRTWOOMGMTLinkStyles:hover, input.FRTWOOMGMTLinkStyles:hover{
	font-weight: bold;
}
.FRTWOOMGMT_border{
	border: 1px solid grey;
}
.FRTWOOMGMT_shadow_1{
	box-shadow: var(--box-shad-1);
}
.FRTWOOMGMT_bord_rad_1{
	border-radius: var(--bord-rad-1);
}

.FRTWOOMGMT_chckToBtn{
	border: var(--bord-2);
	transition-duration: var(--transi-dur-1);
}
.FRTWOOMGMT_chckToBtn input{
	display: none;
}
.FRTWOOMGMT_chckToBtn:hover{
	cursor: pointer;
	transform: scale(1.05);
}
.FRTWOOMGMT_chckToBtn:has(input:checked){
	color: white;
	background: var(--transp-grey-2);
}
.FRTWOOMGMT_var_en:not(input:checked):after{
	content: 'Disabled';
}
.FRTWOOMGMT_var_en:has(input:checked):after{
	content: 'Enabled';
}

.FRTWOOMGMT_lightgrey{
	color: white !important;
	background: var(--lightgrey-1) !important;
	background-color: var(--lightgrey-1) !important;
	border: none !important;
	border-radius: var(--bord-rad-100);
	transition-duration: var(--transi-dur-1);
	font-size: 26px !important;
    line-height: 1 !important;
}
.FRTWOOMGMT_lightgrey:hover{
	background: var(--lightgrey-2) !important;
	background-color: var(--lightgrey-2) !important;
}
.FRTWOOMGMTForm label:has(input[type='checkbox']:checked){
	font-weight: bold !important;
	text-decoration: underline !important;
}
.FRTWOOMGMTForm label:has(input[type='checkbox']):hover{
	cursor: pointer;
}


/************* Hover Classes **************/
.FRTWOOMGMT_hov_scale_1, .FRTWOOMGMT_hov_1{
	transition-duration: var(--transi-dur-1);
}
.FRTWOOMGMT_hov_scale_1:hover, .FRTWOOMGMT_hov_1{
	cursor: pointer;
}
.FRTWOOMGMT_hov_scale_1:hover{
	cursor: pointer;
	transform: scale(1.01);
}
.FRTWOOMGMT_hov_1:hover{
	box-shadow: none !important;
	background: var(--lightgrey-2) !important;
}

/************* Icon Classes **************/
.FRTWOOMGMT_search_field::after{
	content: "\f002";
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    margin-left: -25px;
    margin-top: 4px;
    z-index: 2;
}
.FRTWOOMGMT_search_field:has(input:focus-visible)::after{
	display: none;
}

/************************
 *     Nav Systems
 ***********************/
.FRTWOOMGMTTabNav p{
	background: rgb(250, 250, 250);
	padding: 20px 30px;
	border-radius: 5px 5px 0 0;
	border: 1px solid var(--transp-grey-1);
    border-bottom: 0;
	display: inline;
	position: relative;
	margin: 0;
	z-index: 1;
	width: 100%;
    text-align: center;
}
.FRTWOOMGMTTabNav p:hover{
	cursor: pointer;
	background: rgb(230, 230, 230);
}
.FRTWOOMGMTTabNav p.FRTWOOMGMTActive{
/* 	padding: 20px 60px; */
	background: white;
	z-index: 2;
	margin-bottom: -1px;
}
.FRTWOOMGMTTabNav p.FRTWOOMGMTActive:hover{
	cursor: unset;
}


/************************
 *    Tab System
 ***********************/
.FRTWOOMGMTTabContainer {
	padding: 20px 30px;
	border: 1px solid lightgrey;
	border-radius: 0 0 5px 5px;
	position: relative;
}
.FRTWOOMGMTTabContent{
	display: none;
}
.FRTWOOMGMTTabContent p{
	margin: 0;
}
.FRTWOOMGMTTabActive{
	display: flex;
	flex-flow: column;
	gap: 20px;
}
/******* Search Bar ********/
#FRTWOOMGMTContainer .FRTWOOMGMTTabContent input.frtwoomgmtSearch{
	border-radius: 100px;
    border: 1px solid lightgrey;
	width: 100%;
	padding: 10px 20px;
}
#FRTWOOMGMTContainer .FRTWOOMGMTTabContent .FRTWOOMGMTSearchContainer span{
	position: absolute;
	right: 45px;
}
#FRTWOOMGMTContainer .FRTWOOMGMTTabContent .FRTWOOMGMTSearchContainer span:hover{
	cursor: pointer;
	transform: scale(1.2);
}
#FRTWOOMGMTContainer .FRTWOOMGMTTabContent .FRTWOOMGMTSearchContainer span:active{
	transform: scale(1.5);
}

/****** List Styles *******/
.FRTWOOMGMTListItem{
	padding: 20px;
    border: 1px solid lightgrey;
    border-radius: 5px;
	position: relative;
	z-index: 1;
	background: white;
}

.FRTWOOMGMTListItemForm{
	position: relative;
	z-index: 0;
	margin-top: -15px;
}


/**** Form Styles ****/
.FRTWOOMGMTForm input[type='text'], .FRTWOOMGMTForm input[type='tel'], .FRTWOOMGMTForm textarea, .FRTWOOMGMTForm .FRTWOOMGMT_txt_input{
	border: none;
    border-bottom: 1px solid grey;
    border-radius: 0;
    padding: 5px 0 0 5px;
	margin-top: 2px;
	transition-duration: .2s;
	outline: none !important;
}
.FRTWOOMGMTForm textarea:focus-visible{
	outline: none !important;
	transform: scale(1.01);
    padding: 1%;
}
.FRTWOOMGMTForm input[type='text']:focus-visible, .FRTWOOMGMTForm input[type='tel']:focus-visible, .FRTWOOMGMTForm .FRTWOOMGMT_txt_input:focus-visible{
	border: none;
	outline: none !important;
    border-bottom: 1px solid grey;
	transform: scale(1.02);
}
.FRTWOOMGMTToggleEx{
	margin: 0 !important;
	width: 30px !important;
	height: 30px !important;
	background: grey !important;
	color: white !important;
	border-radius: 100% !important;
	border: 1px solid grey !important;
	display: flex !important;
	flex-flow: row !important;
	justify-content: center !important;
	align-items: center !important;
	font-size: 15px !important;
	line-height: 1 !important;
	font-family: sans-serif !important;
	font-weight: bold !important;
	transition-duration: .2s !important;
	padding: 0px !important;
	text-transform: uppercase;
}
.FRTWOOMGMTToggleEx:hover{
	cursor: pointer !important;
	background: white !important;
	color: grey !important;
}

.FRTWOOMGMTToggleEx.FRTWOOMGMTSmEx{
	width: 20px !important;
	height: 20px !important;
	font-size: 10px !important;
	z-index: 1 !important;
}

.FRTWOOMGMTForm select{
	outline: none;
}
.FRTWOOMGMTForm select[multiple] option{
	appearance: none;
	padding: 3px;
}
.FRTWOOMGMTForm select[multiple] option:hover{
	cursor: pointer;
	background: rgba(0, 0, 0, .05);
}
.FRTWOOMGMTForm select[multiple] option:checked {
	background-image: lightgrey;
	color: white;
}
.FRTWOOMGMTForm select[multiple]:focus option:checked {
	background-image: radial-gradient(darkgrey, grey);
}
.FRTWOOMGMTForm ::-webkit-scrollbar {
	width: 10px; /* Width of the scrollbar */
}

.FRTWOOMGMTForm ::-webkit-scrollbar-track {
	background: transparent; /* Background of the scrollbar track */
	padding: 2px 0 2px 2px;
}

.FRTWOOMGMTForm ::-webkit-scrollbar-thumb {
	background: #d85535; /* Color of the scrollbar thumb */
	border-radius: 100px; /* Rounded corners for the thumb */
}

.FRTWOOMGMTForm ::-webkit-scrollbar-thumb:hover {
	background: #555; /* Color on hover */
}

.FRTWOOMGMTForm .FRTWOOMGMT_ExtraLink{
	transform: translateY(100%);
    background: transparent;
    height: 0px;
}
.FRTWOOMGMTForm .FRTWOOMGMT_ExtraLink:hover input, .bbwdBtnToLnk:hover{
	font-weight: bold;
	text-decoration: underline !important;
}

.FRTWOOMGMT_togOptns{
	bottom: 0;
    transform: translateY(96%);
}
.FRTWOOMGMT_errorMsg{
    text-align: center;
    padding: 10px 0;
    background: rgba(140, 0, 0);
    color: white;
    font-weight: bold;
    border-radius: 5px;
	overflow: hidden;
}
.FRTWOOMGMT_Term {
    padding: 3px 10px;
    background: rgba(0, 0, 0, .1);
    border-radius: 5px;
}



/************************
 *    Overview Tab
 ***********************/
#FRTWOOMGMT_Chrt_Error{
	position: absolute;
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#FRTWOOMGMT_Chart_Wrap{
	position: relative;
	overflow: hidden;
}
#FRTWOOMGMT_Chart_Loading{
	position: absolute;
	height: 100%;
	background: rgba(270, 270, 270, .8);
	top: 0;
}


/************************
 *    Order Tab
 ***********************/
.FRTWOOMGMTOrdNotes div{
    padding: 10px 15px;
    border-radius: 5px;
    border: 1px solid grey;
    background: rgba(0, 0, 0, .04);
}
.FRTWOOMGMTOrdNotes .captured-event-details{
	padding: 0;
	border: none;
	background: unset;
	width: 100%;
}
.FRTWOOMGMTOrdNotes div{
    width: 32%;
}
.FRTWOOMGMTOrdNotes .captured-event-details p{
	width: 100%;
}

.FRTWOOMGMTForm fieldset{
	margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
	background: white;
}

.FRTWOOMGMTorStat, .FRTWOOMGMT_Stat{
	font-weight: 900;
	color: rgb(180, 0, 0);
	text-transform: capitalize;
}
.FRTWOOMGMTListItem span.processing, .FRTWOOMGMT_Stat.shipping, .FRTWOOMGMT_Stat.yellow, .FRTWOOMGMTorStat.draft, .FRTWOOMGMTorStat.pending, .FRTWOOMGMTorStat.onbackorder{
	color: rgb(190, 190, 0);
}
.FRTWOOMGMTListItem span.completed, .FRTWOOMGMT_Stat.taxable, .FRTWOOMGMT_Stat.yes, .FRTWOOMGMT_Stat.green, .FRTWOOMGMTorStat.publish, .FRTWOOMGMTorStat.instock{
	color: rgb(0, 180, 0);
}

#FRTWOOMGMTContainer .orProdListItem{
	padding: 5px 10px;
	box-shadow: var(--box-shad-1);
    border-radius: 5px;
    width: 49%;
	font-weight: 500;
}
.FRTWOOMGMTOrdProducts .orProdListItem img{
	object-fit: contain;
}
.FRTWOOMGMTAddressForm{
	padding: 20px !important;
}


/************************
 *    Product Tab
 ***********************/
.FRTWOOMGMT_prod_imgs{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	padding: 10px;
	border-radius: var(--bord-rad-1);
}
.FRTWOOMGMT_prod_imgs img{
	width: 100%;
	object-position: center;
}
.FRTWOOMGMT_attr_opt{
	background: grey;
    color: white;
	border-radius: var(--bord-rad-1);
}
.page-id-212 .FRTWOOMGMT_VariationList img{
	height: 180px;
}
.FRTWOOMGMT_VariationList p{
	padding: 0 !important;
	margin: 0 !important;
}
.FRTWOOMGMT_search_res{
    z-index: 2;
    background: white;
    border-radius: 0 0 10px 10px;
    box-shadow: var(--box-shad-2);
    max-height: 180px;
    overflow-y: scroll;
    top: 73px;
}



