/**
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
*/
.menu-item-4037 {
  margin: 0 !important;
  padding: 0 !important;
}

.menu-item-4037 > a {
  display: block;
  padding: 12px 20px !important;
  line-height: 1.4;
  font-size: inherit;
  text-align: left;
  color: inherit;
  width: 100%;
  box-sizing: border-box;
  margin-left: 14px !important; /* Default for English */
}

/* Hover effect */
.menu-item-4037 > a:hover {
  background-color: rgba(0, 0, 0, 0.05);
  color: inherit;
}

/* Tablet */
@media (max-width: 1024px) {
  .menu-item-4037 > a {
    margin-left: 10px !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .menu-item-4037 > a {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 14px !important;
  }
}

/* Very small screens */
@media (max-width: 480px) {
  .menu-item-4037 > a {
    padding-left: 14px !important;
    padding-right: 14px !important;
    margin-left: 12px !important;
  }
}

/* Arabic RTL alignment and slight push */
html[lang="ar"] .menu-item-4037 > a {
  direction: rtl;
  text-align: right;
  font-family: 'Tajawal', sans-serif;
  margin-right: 12px !important; /* Adjusted push */
  margin-left: 0 !important; /* Reset left margin in Arabic */
}

/* Hide any ghost/empty anchor tag */
.menu-item-4037 > a:empty {
  display: none !important;
}

/* 🌐 Main switcher box (current language) *//* 🌐 Main switcher box (current language) */
.trp-ls-shortcode-current-language {
  width: 90px !important; /* Set the width to 90px */
  max-width: 90px !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  padding: 4px 6px !important;
  box-sizing: border-box;
  overflow: visible; /* Ensure content is not clipped */
  margin-right: 10px;
  position: relative; /* Add position relative to control child elements */
}

/* 🌐 Anchor inside the current language box (text + flag) */
.trp-ls-shortcode-current-language a.trp-ls-disabled-language {
  font-size: 14px !important; /* Ensure text is big enough for readability */
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: visible; /* Make sure content is fully visible */
  direction: ltr; /* Ensure left-to-right direction for text */
}

/* 🌐 Flag image inside the current language button */
.trp-ls-shortcode-current-language img.trp-flag-image {
  width: 18px !important; /* Adjust the flag size for better visibility */
  height: 12px !important;
  margin-right: 6px; /* Space between flag and text */
}

/* 🌐 For Arabic language, align the flag to the left */
html[lang="ar"] .trp-ls-shortcode-current-language a.trp-ls-disabled-language {
  direction: rtl; /* Set right-to-left direction */
}

html[lang="ar"] .trp-ls-shortcode-current-language img.trp-flag-image {
  margin-left: 6px; /* Push flag to the left */
  margin-right: 0 !important; /* Remove margin-right for Arabic */
}

/* 🌐 Dropdown arrow icon inside the current language box */
.trp-ls-shortcode-current-language .trp-ls-toggle {
  position: absolute;
  right: 5px; /* Adjust the position of the drop-down icon */
  top: 50%;
  transform: translateY(-50%); /* Center the drop-down icon vertically */
  font-size: 16px; /* Size of the arrow */
}

/* 🔽 The dropdown container (hidden until clicked) */
.trp-ls-shortcode-language {
  width: 90px !important; /* Set dropdown width to match the current language box */
  max-width: 90px !important;
  display: none;
  position: absolute;
  z-index: 9999;
  left: 0; /* Ensure dropdown aligns with the current language box */
}

/* 🔽 Language links inside the dropdown */
.trp-ls-shortcode-language a {
  font-size: 14px !important; /* Set a readable font size for dropdown items */
  padding: 10px 12px !important; /* Add padding for easy clicking */
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: visible; /* Ensure the content is fully visible */
  box-sizing: border-box;
}

/* 🔽 Flag images inside the dropdown */
.trp-ls-shortcode-language a img.trp-flag-image {
  width: 20px !important; /* Adjust flag size inside the dropdown for better visibility */
  height: 14px !important;
  margin-right: 6px;
}

/* 🌐 For the entire language switcher container, reduce width */
.trp-language-switcher {
  width: 90px !important; /* Reduce width to 90px */
  max-width: 90px !important;
  display: flex !important;
  justify-content: flex-start !important;
}

/* 🔽 On mobile, adjust button and dropdown to fit better */
@media (max-width: 768px) {
  .trp-ls-shortcode-current-language {
    width: 80px !important; /* Adjust width on mobile */
  }

  .trp-ls-shortcode-language {
    width: 80px !important; /* Match width for dropdown on mobile */
  }

  .trp-ls-shortcode-language a {
    font-size: 14px !important;
    padding: 10px 12px !important;
  }
}


/* Reduce overall form padding */
#user-registration .ur-frontend-form {
  padding: 20px !important; /* You can reduce more if needed */
  max-width: 100% !important;
}

/* Reduce padding inside fields */
#user-registration .ur-form-grid {
  padding: 0 !important;
  margin: 0 !important;
}

/* Reduce spacing between form fields */
#user-registration .user-registration-form-row {
  margin-bottom: 12px !important;
}

/* Reduce padding inside input fields */
#user-registration input[type="text"],
#user-registration input[type="password"] {
  padding: 8px 10px !important;
}

/* Adjust the login button */
#user-registration .ur-submit-button {
  padding: 10px 20px !important;
  font-size: 16px;
}

/* Reduce spacing on smaller screens */
@media (max-width: 768px) {
  #user-registration .ur-frontend-form {
    padding: 15px !important;
  }
}


/*Shop*/

body.woocommerce-page .ast-container, .ast-container-fluid{
	margin-left: 0;
}

@media (min-width: 922px) {
	.woocommerce #secondary{
    	width: 20%; 
    }
     .woocommerce #primary{
    	width: 75%; 
        margin: auto !important;
    }
    .woocommerce-page ul.products li.product.desktop-align-left .button{
    	font-size: 0.7em;
    }
    /* Shop page product buttons */
    .woocommerce ul.products li.product .button {
        width: 100%;               /* button always fits the product box */
        box-sizing: border-box;    /* prevents overflow */
        display: flex;             /* use flexbox for alignment */
        justify-content: center;   /* centers text horizontally */
        align-items: center;       /* centers text vertically */
        text-align: center;        /* ensures text stays centered */
        margin-top: 10px;
    }
}
@media (min-width: 993px) {
	.ast-left-sidebar #secondary{
    	padding-right: 20px;
    }
    
    body.woocommerce-page .ast-container {
    	max-width: none !important;
    }
}


/* Card styling */
.woocommerce ul.products li.product {
    border: 1px solid #ddd;
    padding: 10px;
    background: #f5f5f5;
    transition: box-shadow 0.2s ease;
}

.woocommerce ul.products li.product:hover {
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
}




/* Mobile: Sidebar full width on top */
@media (max-width: 991px) {
    .woocommerce #content {
        display: flex;
        flex-direction: column;
    }

    .woocommerce #secondary {
        order: 1; /* Sidebar first */
    }

    .woocommerce #primary {
        order: 2;
    }
}

/* Limit WooCommerce product titles to 2 lines */
.woocommerce-js ul.products li.product .woocommerce-loop-product__title, .woocommerce-page ul.products li.product .woocommerce-loop-product__title{
     display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* 2 lines */
    overflow: hidden;
    text-overflow: ellipsis;

    line-height: 1.4em;
    max-height: 2.8em; /* fallback to keep cards aligned */
}

/* WooCommerce product grid: fill entire width */
.woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px; /* space between products */
}

.woocommerce ul.products li.product {
    width: auto !important;
}

/*Pop up*/

/* Mobile filter button */
.mobile-filter-button {
    display: none; /* hidden by default */
    background: #0071a1; /* Amazon-style blue */
    color: #fff;
    padding: 10px 20px;
    border: none;
    cursor: pointer;
    border-radius: 4px;
    font-weight: bold;
    margin-bottom: 15px;
}

/* Show button only on mobile */
@media (max-width: 991px) {
    .mobile-filter-button {
        display: block;
    }

    /* Hide original sidebar on mobile */
    .woocommerce-sidebar {
        display: none;
    }
}

/* Popup styling */
.mobile-filter-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 80%;
    max-width: 300px;
    height: 100%;
    background: #fff;
    box-shadow: 2px 0 10px rgba(0,0,0,0.3);
    z-index: 9999;
    padding: 20px;
    overflow-y: auto;
    display: none; /* hidden by default */
}

.mobile-filter-popup .close-popup {
    display: block;
    margin-bottom: 20px;
    background: #eee;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
    border-radius: 3px;
    font-weight: bold;
}

/* Overlay behind the popup */
.mobile-filter-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4); /* semi-transparent dark */
    z-index: 9998; /* behind the popup */
    display: none; /* hidden by default */
}