/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.8.1754413306
Updated: 2025-08-05 17:01:46

*/

.custom-product-page {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
	align-items: flex-start;
    padding: 40px 0;
	flex-direction: row !important;
}

.product-gallery {
    flex: 1 1 45%;
/* 	max-width: 45%; */
}

.product-gallery .main-image img {
    width: 100%;
	height: auto;
    border-radius: 8px;
    object-fit: contain;
}

.thumbnail-gallery {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.thumbnail-gallery img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid #ddd;
}

.product-summary {
    flex: 1 1 45%;
/* 	max-width: 55%; */
}

.product-title {
    font-size: 1.8rem;
    margin-bottom: 10px;
}

.product-price del {
    color: #888;
    margin-right: 8px;
}

.product-price ins {
    color: #0077cc;
    font-weight: bold;
}

.stock-status span {
    color: green;
    font-weight: bold;
}

.product-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 15px;
}

.product-actions .quantity input {
    width: 60px;
    text-align: center;
    padding: 5px;
}

.btn-add-to-cart {
    background: #0077cc;
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.btn-add-to-cart:hover {
    background: #005fa3;
}

.btn-whatsapp {
    background: #25D366;
    color: white;
    padding: 10px 20px;
    border-radius: 4px;
    text-decoration: none;
}

.btn-whatsapp:hover {
    background: #1ebe5b;
}

/* Tab Styling */
/* Glassy Tabs (light background friendly) */
.product-tabs { margin-top: 40px; }

/* Tab Navigation */
.tab-nav {
  list-style: none;
  display: flex;
  gap: 14px;
  padding: 0;
  margin: 0 0 18px 0;
  border: 0;
}

.tab-nav li {
  padding: 10px 16px;
  cursor: pointer;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.04);               /* light tint on white bg */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #222;                                    /* readable on white */
  font-weight: 500;
  transition: all .25s ease;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.tab-nav li:hover {
  background: rgba(0, 0, 0, 0.06);
  border-color: rgba(0, 0, 0, 0.12);
}

.tab-nav li.active {
  background: rgba(255, 255, 255, 0.8);          /* “raised” glass */
  border-color: var(--ast-global-color-0, #0073aa);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
  color: #111;
  font-weight: 600;
}

/* Tab Content */
.tab-content .tab-pane {
  display: none;
  padding: 22px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.7);          /* frosted panel */
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(0, 0, 0, 0.08);
  color: #222;
  line-height: 1.65;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.08);
}

.tab-content .tab-pane.active { display: block; }

/* Optional: links & lists inside content */
.tab-content a { color: var(--ast-global-color-0, #0073aa); text-decoration: underline; }
.tab-content ul { padding-left: 1.1rem; margin: 0.5rem 0; }

/* WordPress Form */
/* General form wrapper */
.modern-form {
  max-width: 600px;
  margin: 0 auto;
  padding: 2rem;
}

/* Target input fields inside your custom class wrapper */
.modern-input input[type="text"],
.modern-input input[type="email"],
.modern-input input[type="url"],
.modern-input input[type="tel"],
.modern-input input[type="number"],
.modern-input input[type="password"],
.modern-input select {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 16px;
  transition: all 0.3s ease;
  background-color: #fff;
  margin-bottom: 1rem;
}

.modern-input input:focus,
.modern-input select:focus {
  border-color: #0274be;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.2);
  outline: none;
}

/* Target textarea inside wrapper */
.modern-textarea textarea {
  width: 100%;
  min-height: 120px;
  padding: 12px 16px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 16px;
  transition: all 0.3s ease;
  background-color: #fff;
  margin-bottom: 1rem;
  resize: vertical;
}

.modern-textarea textarea:focus {
  border-color: #0274be;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.2);
  outline: none;
}

/* Submit button */
.modern-button {
  display: inline-block;
  background: #0274be;
  color: #fff;
  padding: 12px 24px;
  font-size: 16px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 600;
}

.modern-button:hover {
  background: #3730a3;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}


@media (max-width: 922px) {
    .custom-product-page {
        flex-direction: column !important;
    }
}

@media (min-width: 922px) {
	.site-content .ast-container {
		flex-direction: column;
	}
}

@media (max-width: 722px) {
	.product-tabs .ast-container {
		padding-right: 0;
		padding-left: 0;
	}
	.tab-content .tab-pane {
		padding: 10px;
	}
	
	.ast-separate-container #content .ast-container {
		padding-left: 0.1em;
		padding-right: 0.1em;
	}
}