/*
Theme Name: Woostify Child
Theme URI: https://woostify.com
Template: woostify
Author: Woostify
Author URI: https://woostify.com/about
Description: Woostify is fast, lightweight, responsive and super flexible WooCommerce theme built with SEO, speed, and usability in mind. The theme works great with any of your favorite page builder likes Elementor, Beaver Builder, SiteOrigin, Thrive Architect, Divi, etc. Therefore, you can build any type of websites like shop, business agencies, corporate, portfolio, education, university portal, consulting, church, restaurant, medical and so on. Woostify is compatible with all well-coded plugins, including major ones like WooCommerce, OrbitFox, Yoast, BuddyPress, bbPress, etc. Learn more about the theme and ready to import demo sites at https://woostify.com
Tags: e-commerce,two-columns,left-sidebar,right-sidebar,custom-background,custom-colors,custom-header,custom-menu,featured-images,full-width-template,threaded-comments,rtl-language-support,footer-widgets,sticky-post,theme-options
Version: 2.4.0.1748418240
Updated: 2025-05-28 07:44:00

*/
body {
     font-family: "Gayathri", sans-serif;
}

/* Grid Layout - Two products per row */
ul.products {
    display: flex;
    flex-wrap: wrap;
}

/* Each Product Card */
li.custom-product-item {
    width: calc(50% - 20px);
}

/* Card Container */
.custom-product-card {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 30px;
    border-radius: 16px;
    background-color: #ffffff;
    /* box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06); */
    transition: box-shadow 0.3s ease;
}

.custom-product-card:hover {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}

/* Product Info */
.custom-product-details {
    flex: 1;
    padding-right: 20px;
}

/* Title */
.custom-product-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: #111;
    margin-bottom: 10px;
    line-height: 1.5;
}

/* Short Description */
.custom-product-description p{
    font-size: 1rem;
    color: #555;
    margin-bottom: 15px;
    line-height: 1.5;
}

/* Price Section */
.custom-product-price {
    margin-bottom: 15px;
}

.custom-price-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.custom-sale-price {
    font-size: 20px;
    font-weight: 600;
    color: #c0392b;
}

.custom-regular-price {
    font-size: 16px;
    color: #999;
    /* remove text-decoration here */
}

/* Only strike through if sale price is shown */
.custom-price-row .custom-sale-price + .custom-regular-price {
    text-decoration: line-through;
}

.custom-discount {
    font-size: 14px;
    color: #27ae60;
    font-weight: 500;
}

.custom-product-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px; /* vertical + horizontal gap */
    margin-top: 12px;
    font-feature-settings: "liga" 0; /* Disable ligatures for crispness */
}

.custom-product-tag {
    background-color: #f5f5f7; /* subtle Apple-like light gray */
    color: #6e6e73; /* calm dark gray */
    font-size: 0.8rem;
    padding: 5px 14px;
    border-radius: 9999px; /* fully rounded pill */
    font-weight: 500;
    letter-spacing: 0.02em;
    user-select: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.custom-product-tag:hover {
    background-color: #0071e3; /* Apple blue accent */
    color: #fff;
    cursor: pointer;
}


/* Image Section */
.custom-product-image {
    width: 180px;
    height: auto;
    flex-shrink: 0;
}

.custom-product-image img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
}

/* Responsive - Mobile */
@media screen and (max-width: 768px) {
    ul.products {
        flex-direction: column;
    }

    li.custom-product-item {
        width: 100%;
    }

    .custom-product-card {
        padding: 0;
    }

    .custom-product-details {
        padding-right: 0;
        margin-bottom: 20px;
    }

    .custom-product-image {
        width: 157px;
    }
}

#secondary.shop-widget {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 80px; /* Offset from top (adjust as needed) */
  align-self: flex-start;
  z-index: 8;

  max-height: calc(100vh - 80px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
  box-sizing: border-box; /* Include padding/borders in height calculation */
}

h2.wp-block-heading a, .shop_widget > h3 {
    color: var(--e-global-color-6e7a345) !important;
}
/* Side bar html*/
.premium-contact-widget {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: #1d1d1f;
  background: #fff;
  padding: 2rem 1.5rem;
  border-radius: 12px;
  max-width: 320px;
  margin: 0 auto;
}

.premium-contact-widget .widget-title {
    font-weight: 600;
    font-size: 1.3rem;
    margin-bottom: 1rem;
    border-bottom: 2px solid var(--e-global-color-primary);
    padding-bottom: 0.3rem;
    letter-spacing: 0.04em;
}

.premium-contact-widget address,
.premium-contact-widget .hours,
.premium-contact-widget .phone {
  font-style: normal;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  margin-bottom: 1rem;
  color: #3a3a3c;
}

.premium-contact-widget .phone a {
  color: #0071e3;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.3s ease;
}

.premium-contact-widget .phone a:hover,
.premium-contact-widget .phone a:focus {
  color: #005bb5;
  outline: none;
  text-decoration: underline;
}

.premium-contact-widget .social-links {
  display: flex;
  gap: 1.25rem;
  margin-bottom: 2rem;
}

.premium-contact-widget .social-link {
  color: #6e6e73;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  position: relative;
  padding-bottom: 2px;
  border-bottom: 2px solid transparent;
  transition: color 0.3s ease, border-color 0.3s ease;
}

.premium-contact-widget .social-link:hover,
.premium-contact-widget .social-link:focus {
  color: #0071e3;
  border-bottom-color: #0071e3;
  outline: none;
}

.premium-contact-widget .online-order {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.premium-contact-widget .order-btn {
  flex: 1;
  background: #0071e3;
  color: white;
  font-weight: 600;
  font-size: 1rem;
  text-align: center;
  padding: 0.75rem 0;
  border-radius: 8px;
  text-decoration: none;
  box-shadow: 0 4px 14px rgb(0 113 227 / 0.4);
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.premium-contact-widget .order-btn:hover,
.premium-contact-widget .order-btn:focus {
  background: #005bb5;
  box-shadow: 0 6px 20px rgb(0 91 181 / 0.6);
  outline: none;
}

.premium-contact-widget .doordash {
  background: #ff2d55;
  box-shadow: 0 4px 14px rgb(255 45 85 / 0.4);
}

.premium-contact-widget .doordash:hover,
.premium-contact-widget .doordash:focus {
  background: #c41f3b;
  box-shadow: 0 6px 20px rgb(196 31 59 / 0.6);
}




.main-product-categories-scroll {
    display: flex;
    overflow-x: auto;
    gap: 13.5rem;
    padding: 1rem 0;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

.main-product-categories-scroll::-webkit-scrollbar {
    height: 6px;
}

.main-product-categories-scroll::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 3px;
}

.category-item {
    flex: 0 0 auto;
    width: 140px;
    text-align: center;
    text-decoration: none;
    color: #111;
    font-weight: 600;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
        Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    transition: transform 0.3s ease, color 0.3s ease;
    cursor: pointer;
}

.category-item:hover,
.category-item:focus {
    color: #D7B46C;
    transform: scale(1.05);
    outline: none;
}

.category-image {
    width: 300px;
    height: 300px;
    margin: 0 auto 10px;
    border-radius: 24px;
    background-size: cover;
    background-position: center;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.07);
    transition: box-shadow 0.3s ease;
}

.category-item:hover .category-image,
.category-item:focus .category-image {
  box-shadow: 0 15px 30px rgba(215, 180, 108, 0.3);
}

.category-name {
display: block;
    font-size: 1.5rem;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    color: #ffffff;
    font-family: 'Gayathri';
}


.menu-item-text{
    text-transform: uppercase !important;
}
 
.woostify-product-recently-viewed-title, .related > h2{
    font-size: 36px !important;
    font-weight: var(--e-global-typography-primary-font-weight) !important;
    color: var(--e-global-color-primary);
}


/* Sticky header base */
#masthead.site-header {
    position: sticky;
    top: 0;
    z-index: 9;
    background-color: #ffffff; /* Solid, no transparency */
    transition: box-shadow 0.3s ease;
}

/* Shadow appears on scroll */
#masthead.site-header.is-scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); /* Subtle, premium */
}

/* Default menu text color */
#masthead .menu-item-text {
    color: #ffffff; /* White for all menu items */
}

/* Active/current menu item */
#masthead .current-menu-item .menu-item-text {
    color: #d4af37; /* Gold shade */
}

/* Optional: make hover also gold */
#masthead .primary-navigation li a:hover .menu-item-text {
    color: #d4af37;
}

.main-navigation .primary-navigation > .menu-item .sub-menu {
    background: #0e2425;
}
    
@media (max-width: 768px) {
    .sidebar-menu{
                width: 80%;
                
    }
    
    .sidebar-menu hr{
    background-color: var(--e-global-color-primary);
    opacity: .2;
    }
  .sidebar-menu .primary-navigation { 
    display: none !important;
  }
  .sidebar-menu {
    background-color: var(--e-global-color-secondary) !important;
    padding: 14px;
    color:#ffffff !important;
    }
    .my-mobile-menu-header a.active,
    .my-mobile-menu-categories a.active {
    color: var(--e-global-color-primary) !important;       /* your highlight color */
    font-weight: 600;  /* make it bold */
    /* add any other premium style */
    }
    
    .sidebar-menu li {
        padding:24px 0;
    }
    
    .sidebar-menu a{
        color:#ffffff !important;
    }
    .sidebar-menu a:hover, .sidebar-menu h3:hover{
        color:var(--e-global-color-primary) !important;
    }
    .sidebar-menu h3{
        font-size:2rem !important;
        color: #ffffff;
    }
    .custom-product-card:hover {
        box-shadow: none !important;
    }
    .my-mobile-menu-contact{
        margin-left: 1rem;
        margin-bottom:30vh;
    }
    address{
        font-size: 1rem !important;
    }
    

}