/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


/**** Menu spinner ********************/

.menu-spinner {
  display: inline-block;
  width: 1.2em;
  margin: 0;
  margin-right: 5px;
  height: 1.2em;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  border-top-color: #000;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: menu-spinner-spin 1s ease-in-out infinite;
}
@media only screen and (max-width: 48em) {
  .menu-spinner {
    border-top-color: #446084;
    border-top: 3px solid;
  }
}
@keyframes menu-spinner-spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}
@-webkit-keyframes menu-spinner-spin {
  to {
    -webkit-transform: rotate(360deg);
  }
}

/**********************************************/


/***Product page variation checkboxes **************/
table.variations input[type='checkbox'] {
    width: 20px;
    height: 20px;
}

.header-wrapper button.ux-search-submit {
    visibility: hidden;
}

/*** Category color swatches **********************/

.category-var-colors{
    width: 20px; 
    height: 20px;
    border-radius: 50%;
    margin-right: 4px;
    display: inline-grid;
    border: 1px solid lightgrey; 
    opacity: 0.8; 
    cursor: pointer;
}

.category-var-colors.active{
    border: 2px solid orange; 
    height: 22px; 
    width: 22px; 
    box-shadow: 0 0 0 2px #ffffff inset;
}

@media only screen and (max-width: 48em) {
    .category-var-color-section{
        display: flex; 
        overflow-x: auto;
        
    }
    .category-var-colors{
        flex-shrink:0
    }
}


/******** Product Category product box ***********************/

p.name.product-title.woocommerce-loop-product__title,p.name.product-title.woocommerce-loop-product__title > a {
    margin: 0;
}

.product-small.box .price-wrapper .price {
    margin-top: 6px;
    margin-bottom: 6px;
}

.star-rating.star-rating--inline {
    margin-top: 6px;
    margin-bottom: 0;
}

.product-small.box a, .product-small.box .star-rating {
    font-size: 0.9em;
}

a:has(.cboffer) {
    margin: 0;
}

.cboffer {
    font-size: 0.9em;
    width: auto;
    padding: 3px 6px;
    border-width: 1px;
    margin-top: 0;
    cursor: pointer;
    background: #f1f3f6;
}
.cbamt {
    font-weight: bolder;
    color: #d26e4b;
}
.fromp {
font-weight: normal;	
}

/**********************************************************/

/*** Owl carousel css ***************/
.owl-theme .owl-nav [class*=owl-] { 
    background: #446084 !important; 
    margin: 0 !important;
}

.owl-nav .nav-button {
    font-size: 20px !important;
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background: #ff9800 !important;
}

button.owl-prev {
    left: 0;
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

button.owl-next {
    right: 0;
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

/***********************************************/


/** Setting global variables *********/
:root {
    --yp-orange: #f6861f;
    --btn-color: #428bca;
}

/*** Setting color for input checkboxes****/
input[type=checkbox] {
    accent-color: orange;
}

/**Pagination css********/
.nav-pagination>li>a, .nav-pagination>li>span {
    border: none;
}


html{
    background-color: white;
}

/*** Error shaking effect ******************/
@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.shaker {
    animation: shake 0.5s;
}
/*************************************************/

/****Left to right animation********************/
@keyframes move-left-to-right {
    from {
        transform: translateX(-50%);
    }
    to {
        transform: translateX(0);
    }
}

/********************************************/

/**Product title on product pages********/
h1.product-title.product_title.entry-title{
    font-size: 1.2em;
   white-space: initial;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

@media screen and (min-width: 850px) {
    
    /**With overflowing product title, the div comes below the product gallery div without max-width on pc ********/
    .product-info.summary.product-summary {
        max-width: 50%;
    }
    
}

/*******************************************/

/*** Limit product title on category pages to n Lines ****/

p.name.product-title > a {
    white-space:initial;
    overflow:hidden;
    text-overflow:ellipsis;
    width:100%;
    display: -webkit-box; 
    -webkit-line-clamp: 2; 
    -webkit-box-orient: vertical;
}

/*****************************************/

/***** Shop sidebar filter widget ************/

span.widget-title.shop-sidebar {
    font-size: 0.9em;
}

li.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term {
    font-size: 0.9em;
}

/*************************************************/

.button{
    border-radius:5px;
}




/************** mini cart**************/
ul.woocommerce-mini-cart.product_list_widget li a:not(.remove){
  font-size: 0.7em;
}

/*** qty buttons ***********/

.quantity.buttons_added .minus {
    border-radius: 5px 0 0 5px;
}

.quantity.buttons_added .plus {
    border-radius: 0 5px 5px 0;
}


/************* Toggle switch - Preview On/Off ****************************************/
.onoffswitch {
    position: relative !important;
    -webkit-user-select:none; 
	-moz-user-select:none; 
	-ms-user-select: none;
}
.onoffswitch-checkbox {
    position: absolute !important;
    opacity: 0;
    pointer-events: none;
}
.onoffswitch-label {
    display: block !important;
    overflow: hidden !important;
    width: 86px;
    cursor: pointer;
    border-radius: 10px;
    margin-bottom:0;
}
.onoffswitch-inner {
    display: block !important; 
	width: 200%; 
	margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block !important; 
	float: left; 
	width: 50%; 
	height: 30px; 
	padding: 0; 
	line-height: 30px;
    font-size: 11px; color: white;  
	font-weight: bold;
    box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "Preview ON";
    padding-left: 21px;
    background-color: #446084;
    color: #FFFFFF;
    left: 0;
    font-size: 0.8em;
}
.onoffswitch-inner:after {
    content: "Preview Off";
    padding-left: 10px;
    background-color: #EEEEEE;
    color: #999999;
    text-align: center;
    font-size: 0.8em;
}
.onoffswitch-switch {
    display: block !important;
    width: 15px;
    height: 15px;
    margin: 9px;
    background: #ffffff;
    position: absolute;
    top: -1px;
    left: -6px;
    bottom: 0;
    border: 2px solid #999999;
    border-radius: 50%;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    background: green;
}
/*******************************************************************/

/***** Bubbles for New, Sale etc *************************************/

span.bubble-new:after {
    content: "NEW";
    margin-left: 10px;
    font-size: x-small;
    font-weight: bold;
    background: #f6861f;
    padding: 3px;
    color: white;
    border-radius: 5px;
}

span.bubble-sale:after {
    content: "SALE";
    margin-left: 10px;
    font-size: x-small;
    font-weight: bold;
    background: green;
    padding: 3px;
    color: white;
    border-radius: 5px;
}

/******************************************************************/


/*************** Loder Spinning icon ***********************************/

.circle-loader {
  display: block;
  border: 5px solid #f3f3f3;
  border-radius: 50%;
  border-top: 5px solid #f6861f;
  width: 60px;
  height: 60px;
  -webkit-animation: spin 1.5s linear infinite; /* Safari */
  animation: spin 1.5s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*********************************************************************/

/********Image preloader*********************************************/

.image-preloader{
    background-size: 4em;
    background-image: url(https://www.yourprint.in/wp-content/uploads/2022/06/rolling_loader-1.gif);
    background-repeat: no-repeat;
    background-position: center;
}

/*********************************************************/


/*** My account > orders > view order page & track order page css *******/
.page-id-7 section.woocommerce-customer-details *,
.page-id-894 section.woocommerce-customer-details *{
    font-size: 0.93em;
}

.page-id-7 section.woocommerce-columns--addresses,
.page-id-894 section.woocommerce-columns--addresses{
    display: flex;
    margin-bottom: 10px;
    flex-wrap: inherit;
    text-align: center;
    overflow-x: auto;
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
    white-space: nowrap;
}

.page-id-7 section.woocommerce-columns--addresses > div,
.page-id-894 section.woocommerce-columns--addresses > div{
margin-right: 10px;
}

/*****************************************/

/*** Hide my account desktop dropdown*****/
.account-item .nav-dropdown{
    display:none !important;
}

/** Making cart icon width auto****/
span.cart-icon.image-icon strong{
    min-width: 2.2em;
    width: auto;
}

/*** Category desc font size ***************/

.bottomdesc h1,.bottomdesc h2,.bottomdesc h3,.bottomdesc h4,.bottomdesc h5{
    font-size:17px!important;
}
.bottomdesc p,.bottomdesc li{
    font-size:13px!important;
}
.bottomdesc li {
    margin-left:10px;
    list-style: initial;
}

.bottomdesc a {
    text-decoration: underline;
    font-weight: bold;
}

/*******Hide by default*********/
.hidden-default {
display:none !important;
}

/***100 % width for place order button*********/
.page-id-6 button#place_order,
.page-id-6 button#smsalert_otp_token_submit{
    width:100%;
    margin-right: 0;
}



/*******Border radius for search box*******/
.header-wrapper form.searchform [id*=woocommerce-product-search-field-] {
    border-radius: 5px;
}


/***Ajax search for woocommerce - damian dora******/

.dgwt-wcas-suggestions-wrapp {
    overscroll-behavior: contain;
}


/***Menu & Header Changes START****/

#logo img{
    padding:5px;
}


.desktop-menu-left {
    margin-right: 15px;
    cursor: pointer;
    color: black;
    font-weight: bold;
}

.header-bottom{
    border-bottom: 1.5px solid #F1F3F5;
}

@media screen and (min-width: 850px) {

.page-title-inner:has(.woocommerce-breadcrumb) {
    min-height: 0;
    padding-top: 15px;
}

#logo img{
    padding:10px;
}

}


header#header{
    background: white;
}

.nav-column>li>a,
.nav>li>a,
.nav-vertical>li>ul li a,
.nav-dropdown>li>a{
    color: black;
}


.off-canvas-left .mfp-content,
.nav-sidebar.nav-vertical>li.menu-item.active, .nav-sidebar.nav-vertical>li.menu-item:hover {
background-color: rgb(255, 255, 255);

}

.nav>li.active>a {
background-color:#446084;
color:white;
}
/*****Menu & Header Changes END*******/

.pcathomepage h5 {
    text-transform: initial !important;
}

footer#footer h4 {
    color: #f6861f;
}



/****Sms alert otp box margin bottom for timer*********/

#smsalert_validate_field {
    margin-bottom:1.5em !important;
    
}



/***** Underling Update date on track order page******/
.page-id-894 .comment-text .meta {
    text-decoration: underline !important;
}

/*****Ajax Search result box START***********/

.dgwt-wcas-search-input {
    max-height: 35px !important;
}

.dgwt-wcas-si {
width:80px !important;
}

/*****Ajax Search result box END***********/



/****Bulk pricing table margin***/
.product .rp_wcdpd_product_page {
margin-top:0 !important;    
margin-bottom:0 !important;
    
}



/***Hide Comment Area in Blog Posts for Logged in Users due to caching****/


body.logged-in.single-post .comment-respond {
	display:none !important;
}

/*******Hide tax on frontend******/

small.includes_tax {
display:none !important;
}




/*******Hide Password Hint******/

.woocommerce-password-strength,
.woocommerce-password-hint {
display:none !important;
}



h1.entry-title.mb-0 {
margin-bottom: 10px !important;
}



/* Do not display to logged in users */
.logged-in .loggedout {
display:none;
}
 
.loggedin {
display:none !important;
}
 
/* Display to logged in users */
 
.logged-in .loggedin {
display:inline !important;
}

/*************** Hide author in posts ***************/
span.byline {
display:none;
}

/*************** Padding and bg color in select your device dropdown ***************/
div#woocommerce_product_categories-15 {
    padding: 10px 10px 0 10px !important;
}

.selectyourdevice {
background: #446084 !important;
}

@media (min-width: 49em) {
.selectyourdevicecolumn {
max-height:60px !important;
}
}



select#bulk-action-selector-top option[value="mark_processing"] {
display: none !important;
}

/*************** Hide Shipping Address in Account Page  ***************/

.page-id-7 .u-column2.col-2.woocommerce-Address {
display:none !important;
}


/** Hide sorting dropdown from category page***/

form.woocommerce-ordering {
display:none !important;
}

/** Sub Menu Font Theming ***/

.submenu {
	
	font-weight:bolder !important;
	color:#000000 !important;
	font-size: .9em !important;
}

.menufocus > a {
    color:#f6861f !important;
}

@media only screen and (min-width: 48em) {
    /***** Non - mobile devices Css ***********/
    
    .mobile-only{
        display:none;
    }
    
    
}

/*** Product-main padding on desktop ************/
.product-main {
    padding: 10px 0 !important;
}


/**** Category page with subcateries as display type ************/


.cat-subcat-display .box-image {
  border-radius: 10px;
  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}


.cat-subcat-display .box-bounce .box-text {
  position: absolute;
  bottom: 7px;
  background: rgb(255 255 255 / 90%);
  width: auto;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 5px;
  padding: 0 4px;
  min-width: 50%;
  max-width: 90%;
}

.cat-subcat-display .box-bounce .box-text h5{
overflow: hidden;
font-size: 9px;
white-space: nowrap;
text-overflow: ellipsis;
text-transform: none;
overflow: hidden;
}

/*** hide shop sidebar******/
.cat-subcat-display .col.large-3.hide-for-medium:has(#shop-sidebar) {
    display: none;
}

/*** Make content area 100% of available width as we have hidden sidebar on desktop ****/
@media screen and (min-width: 850px) {

.cat-subcat-display .large-9 {
    flex-basis: 100%;
    max-width: 100%;
}

}

/*********************************************/



@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	
.desktop-only {
      display: none;
    }

/**Product title on product pages********/
h1.product-title.product_title.entry-title{
    font-size:1.1em;
}

/*** Product designer/Featured Image padding on product page ***/
.product-container .product-main .product-gallery.large-6.col{
    padding-left: 8px;
    padding-right: 8px;
}

/** Variation labels in single line on mobile *********/
table.variations th label{
    white-space: nowrap; 
    margin-right: 10px;
    
}
	
	
	/*********** Change search input color to white on mobile  ***************/

	.form-flat input:not([type="submit"]), .form-flat textarea, .form-flat select {
		background-color: #ffffff !important;
	}	

	/*************** Remove Product Area margin in Custom Products on mobile  ***************/
.product-main {
    padding:0 0 !important;
}
	
/******** Hide Bottom Header on Product Page on Mobile *******/	
.single-product .header-bottom {
	display:none !important
	}	

/*****Stickey Proceed to checkout button on cart*******/

.page-id-5 a.checkout-button.button.alt.wc-forward {
    position: fixed;
    bottom: -3px;
    width: 100%;
    z-index: 100;
    padding: 0px;
    margin: 0px;
    left: 0px;
    line-height: 3.5em;
}




		
	
/*Visible only on PC*/
.pconly {
display:none !important;
}

/*OTP modal width on mobile*/

.modal-content {
width:80% !important;
}
	
	/*Decrease padding on category pages*/
	.category-page-row {
		padding-top:1px !important;
	}
	
		/*Non-Product menu links on mobile*/
	.submenumobile > a {
		text-transform:none !important;
		font-weight:normal !important;
	}	
	

}

