/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/
.ast-container{
	padding-left: 8px !important;
	padding-right: 8px !important;
}
/*code for the three prices*/
.pricing-boxes {
  display: flex;
  gap: 12px;
  flex-direction: row-reverse;
  justify-content: center;
}

.pricing-box {
  width: 33%;
  display: flex;
  align-items: center;
  border: 1px solid #6b0e0e;
  border-radius: 6px;
  padding: 6px 6px;
  cursor: pointer;
  background-color: #fff;
  position: relative;
  transition: background-color 0.3s ease;
  flex-direction: row-reverse;
}

.pricing-box.selected {
  background-color: #d9f5c7; /* light green */
}

.pricing-box input[type="radio"] {
  display: none;
}

.pricing-box .content {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 8px;
  background-color: #D9D9D9;
  border-radius: 5px;
  gap: 4px;
}

.pricing-box .quantity {
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 6px;
  color: #000;
}

.pricing-box .price {
  background-color: #d80000;
  color: #fff;
  font-weight: bold;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 25px;
  position: relative;
  bottom: 5px;
  display: flex;
  flex-wrap: nowrap;
}

.custom-radio {
  width: 18px;
  height: 18px;
  border: 2px solid #6b0e0e;
  border-radius: 50%;
  position: relative;
}

.pricing-box.selected .custom-radio::after {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #2c2c2c;
  border-radius: 50%;
  position: absolute;
  top: 2px;
  left: 2px;
}
.three-currency{
	font-size: 14px !important;
	margin-right: 5px !important;
}
.above-qty{
	display: flex;
}
.above-qty h5{
	margin-bottom: 10px;
    color: #C42626;
    background-color: #FFFF00;
	padding: 3px 11px;
}
/*removing the margin from the headers*/
.header-h div h2, .couner-header h2{
	margin: 0 !important;
}
/*adding the code for the custom form*/
.main-form{
    display: flex;
    justify-content: center;
    align-items: center;
}
.main-form form{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
}
.methods-and-form{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-direction: row;
    height: 300px;
}
.payment-methods{
    width: 20%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: column;
    padding: 0px 5px;
    height: 100%;
}
.cod-method{
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid black;
    border-radius: 8px;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    height: 25%;
	font-size: 14px;
	font-weight: 700;
}
.ngenius-method{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px solid black;
    width: 100%;
    border-radius: 8px;
    box-sizing: border-box;
    height: 35%;
}
.ngenius-method div:nth-child(1){
    width: 100%;
    text-align: center;
    height: 50%;
	font-size: 14px;
	font-weight: 700;
}
.ngenius-method div:nth-child(2){
    width: 100%;
    text-align: center;
    background-color: #E50113   ;    
    border-radius: 0px 0px 8px 8px;
    box-sizing: border-box;
    height: 50%;
    color: white;
	font-size: 14px;
	font-weight: 700;
}
.tabby-method{
    width: 100%;
    box-sizing: border-box;
    height: 35%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    border: 1px solid black;
    padding: 5px;
}
.tabby-method div{
    width: 95%;
    height: 95%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #3dedc1;
    border-radius: 8px;
    font-size: 24px;
    color: #292929;
}   
.active-method{
	background-color: #d9f5c7;
}
.form-fields{
    height: 100%;
    width: 80%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    padding: 10px 15px;
    box-sizing: border-box;
    border: 1px solid black;
    border-radius: 8px 8px 0px 0px;
}
.cod-form-header{
    margin: 0;
    width: 100%;
    text-align: right;
    color: #E50113;
	font-size:16px;
	font-weight: 400;
}
.form-fields input, .form-fields textarea{
    width: 100%;
    border: 0px;
    background-color: #D9D9D9 !important;
    color: #292929;
    text-align: right;
    height: 22%;
    border-radius: 5px !important;
	transition: 0.2s all ease-in;
}
.phone-error-message{
    margin: 0px;
    text-align: right;
    width: 100%;
    color: #E50113;
	font-size: 14px;
	font-weight: 700;
}
.form-fields textarea{
    padding: 10px 12px;
    box-sizing: border-box;
    height: 34%;
}
input[name='email']{
    display: none;
}
.form-button{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.form-button div{
    width: 100%;
    background: #5E1B02;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 12px;
    font-size: 24px;
    font-weight: 700;
    padding: 10px;
    border-radius: 8px;
    color: white;
}
.form-totals{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-color: #D9D9D9;
    border-radius: 7px;
    margin-top: 12px;
    flex-direction: row;
    padding: 14px 0px;
}
.form-totals div:nth-child(2){
    width: 40%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px 0px 1px 0px solid black;
    border-left: 1px solid #E50113;
    border-right: 1px solid #E50113;
}
.form-totals div:nth-child(1), .form-totals div:nth-child(3){
    width: 30%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.form-totals div h4{
    margin: 5px;
}
.form-totals div h4:nth-child(1){
    font-size: 16px;
    font-weight: 400;
    color: #461117; 
}
.form-totals div h4:nth-child(2){
    font-size: 18px;
    font-weight: 700;
    color: #E50113;
}
/*adding the cdoe for the reviews*/
.review-slider {
  position: relative;
  width: 100%;
  max-width: 500px;
  margin: auto;
  overflow: hidden;
}

.review-slide {
  text-align: right;
  display: none;
  padding: 20px;
  animation: fade 1s ease-in-out;
}

.review-slide.active {
  display: block;
}

.review-img {
  width: 100%;
/*   max-height: 300px;
  object-fit: cover; */
  border-radius: 25px !important;
  background: #ddd;
}

.review-name {
  margin: 15px !important;
  font-weight: bold;
  color: #461117;
  font-size: 18px;
}

.review-text {
  margin-top: 10px;
  color: #461117;
  line-height: 1.8;
  white-space: pre-line;
  font-size: 18px;
  font-weight: 400;
}

@keyframes fade {
  from {opacity: 0;}
  to {opacity: 1;}
}
/*adding the code for the bottom order button*/
.order-now-button{
	display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 10;
    background-color: #5E1B02;
    color: white;
    font-size: 26px;
    font-weight: 700;
    padding: 5px;
}
/*adding the code for the counter*/
.countdown-box {
  background-color: #E50113;
  padding: 20px;
  border-radius: 20px;
  color: white;
  text-align: center;
  max-width: 400px;
  margin: auto;
}
.countdown-title {
  font-weight: bold;
    background: white;
    color: red;
    padding: 8px 55px;
    display: inline-block;
    border-radius: 12px;
    font-size: 22px;
    font-weight: 700;
}
.countdown-subtitle {
  font-size: 18px;
  font-weight: 700;
}
.countdown-timer {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-direction: row-reverse;
}
.time-block {
  background-color: white;
  color: black;
  border-radius: 10px;
  width: 30%;
  font-size: 18px;
  padding: 5px 0;
}
.time-block span {
  display: block;
  font-weight: bold;
  font-size: 20px;
}
.time-block span {
	font-size: 18px;
    font-weight: 700;
}
/*adding the cdoe for the left in stock*/
.stock-div{
	display: flex;
	justify-content: center;
	align-content: center;
	font-size: 18px;
	font-weight: 700;
	color: #E50113;
}
.stock-div span{
	color: #260003;
    margin: 0 6px;
}
/*adding the code for the data loader*/
.data-loader{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100000;
	background-color: #000000b0;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.data-loader img {
  animation: spin 1s linear infinite;
}
/*adding the code for the thank you page*/
.thanks-featured li	.review-rating , .thanks-featured li .star-rating , .thanks-featured li .astra-shop-summary-wrap .price , .thanks-featured li .add_to_cart_button , .thanks-featured li .astra-shop-summary-wrap .ast-woo-product-category , .thanks-featured li .ast-onsale-card{
	display: none;
}
/*adding the style for the delivery charge message*/
.delivery-charge-phrase{
	width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #5e1b02;
    padding: 6px 0px;
    border-radius: 8px;
}
.delivery-charge-phrase h4{
	color: white;
}