/*
Theme Name: Powergems Ecommerce
Theme URI: https://powergems.com
Text Domain: powergems-ecommerce
*/

/*
 * Home Page
 */
 .led-banner {
    background-color: rgb(255, 148, 0);
    background-color: #eee;
}
.led-banner .container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    margin-bottom: 0;
}
.led-banner .container p {
    margin: 0;
    font-weight: 600;
}
.led-banner .container a { color: #000; }
.led-btn {
    font-weight: 700;
    text-decoration: underline;
    padding-left: 1rem;
}

.hero-banner {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    height: 250px;
    display: flex;
    align-items: center;
    flex-direction: column;
    z-index: 0;
    position: relative;
    justify-content: center;
    margin-bottom: 30px;
}
.hero-banner .home-header h1 {
    margin: 0; 
    color: #FF9400; 
    font-size: 20px; 
    font-weight: 600;
}

.hero-banner .home-header h2 {
    margin: 0; 
    color: #FF9400; 
    font-size: 17px; 
    font-weight: 500;
}
@media only screen and (min-width: 600px) {
    .hero-banner {
        background-size: 100% auto;
        margin-bottom: 0;
    }
    .hero-banner .home-header h1 {
        font-size: 28px; 
    }
    
    .hero-banner .home-header h2 {
        font-size: 19px; 
        margin: 10px 0 0; 
    }
}
@media only screen and (min-width: 700px) {
    .hero-banner {
        height: 300px;
    }
}
@media only screen and (min-width: 800px) {
    .hero-banner {
        height: 380px;
    }
}

@media only screen and (min-width: 1000px) {
    .hero-banner {
        height: 400px;
    }
}
@media only screen and (min-width: 1200px) {
    .hero-banner .home-header h1 {
        font-size: 56px; 
        font-weight: 600;
    }
    
    .hero-banner .home-header h2 {
        font-size: 38px; 
        font-weight: 500;
    }
    .hero-banner {
        height: 500px;
    }
}
@media only screen and (min-width: 1400px) {
    .hero-banner {
        height: 550px;
    }
}
@media only screen and (min-width: 1500px) {
    .hero-banner {
        height: 700px;
    }
}


/* .hero-divider {
    background-image: url(https://powergems.com/wp-content/uploads/2023/05/New-Master-PowerGem-band-and-swirl.png);
    background-position: center;
    background-size: cover;
    z-index: 3;
    position: relative;
    height: 300px;
    transform: translatey(-150px);
} */

.prod-cat-row {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    max-width: 1879px;
    padding: 20px;
}

.prod-cat-container {
    display: flex; 
    justify-content: center;
    border-bottom: 1px solid #FF9400; 
}
.prod-cat { 
    margin: 1rem;
    max-width: 450px;
    min-width: 300px; 
}

.prod-cat-rows { padding-inline-start: 0; } 
/* 
 * large screen size only styling
 */
 @media only screen and (min-width: 991px) {
    .prod-cat-row .slide-title { text-align: left; }
    ul.prod-cat-rows li.prod-cat-row:nth-child(even) { flex-direction: row-reverse; }
    ul.prod-cat-rows li.prod-cat-row:nth-child(even) .slide-title { text-align: right; } 
    .home-cta.home-cta--callout { 
        padding: 40px 50px; 
        margin: 20px 20px 50px 20px;
    }
}
/* 
 * medium screen size only styling
 */
 @media screen and (max-width: 991px) and (min-width: 768px) { 
    .prod-cat { width: 40%; }
}
/* 
 * small screen size only styling
 */
 @media only screen and (max-width: 768px) { 
    .prod-cat-container { display: none; }
    .prod-cat-row .slide-title { text-align: left; }
    .home-cta.home-cta--callout {
        padding-left: 80px;
        padding-right: 80px;
    }
    .hero-divider { 
        height: 100px;
        transform: translatey(-50px);
    }
    .home-prod-cats { transform: translateY(-50px); }
}

/*
 * Product Category page
 */
 .product-grid { margin-top: 30px; }
 .product-grid ul.products {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row;
}
.cat-prod-single {
    /* make sure no border on category page */
    border: none!important;
    padding: 0!important;
}
.prod-items {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
    height: 100%;
    justify-content: flex-start;
}
.category-title, .term-description, ul.products {
    max-width: 1300px;
}
ul.products li.product { width: 100%; }
.list-product-details { 
    text-align: left;
    padding: 0; 
    padding-top: 15px;
}
.list-product-image {
    border: solid 1px #ddd;
    width: 100%;
}
.list-product-image img {
    height: 200px;
    width: 300px;
    object-fit: contain;
}
/* 
 * large screen size only styling
 */
 @media only screen and (min-width: 991px) {
    ul.products li.product { width: 33.33%; height: 350px; }
    .list-product-details { width: 100%; }
    ul.products li:nth-child(3n+2) .prod-items {
        padding-left: 30px;
        padding-right: 30px;
    }
    ul.products li:nth-child(3n+1) .prod-items { padding-right: 60px; }
    ul.products li:nth-child(3n+3) .prod-items { padding-left: 60px; }
}
/* 
 * medium screen size only styling
 */
 @media screen and (max-width: 991px) and (min-width: 500px) { 
    ul.products li.product { width: 50%; }
    ul.products li:nth-child(2n+1) .prod-items { padding-right: 25px; }
    ul.products li:nth-child(2n+2) .prod-items { padding-left: 25px; }  
}

/*
 *  Support page template styling
 */
 .support-buttons {
    margin: 3rem 0;
}

.product-manual-results {
    margin: 0px auto 50px auto;
    width: 500px;
}
.product-manual-results ul { padding: 0; }
.product-manual-results li {
    padding-inline-start: unset;
    list-style: none;
    padding: 1rem;
    border-top: 2px solid #eee;
    font-size: 15px;
}
.product-manual-results li:first-child { border-top: none; }
#pgProductSearch {
    margin-bottom: 10px;
}

.search-bar {
    height: 0;
}