/*
 * add "mm" to "width" on grid filters and PDP
*/
#jewelry #width.filters .custom-control-description::after{
	content:" mm";
}

#jewelry-details #jewelry-details-option-width::after{
	content:" mm";
}

/*!
 * James Gattas Jewelers
 * Copyright 2008-2024 Punchmark
 */

/* =============================================
   HELPERS
============================================= */

a:focus-visible, *[tabindex="0"]:focus-visible, button:focus-visible,nav.navbar .nav-item .nav-link:focus-visible {
    outline: 2px dashed #006eb6 !important;
    outline-offset: -4px !important;
  }
  

.accessible-sr {
    /* display: block;
    overflow: hidden !important;
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important; */
    /* position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden; */
}

.display-4 {
    font-size: 2.5rem !important;
}

[data-widget-element="widgetHeader"] > .bg-primary {
    color: #ffffff !important;
    display: inline-block !important;
    width: auto !important;
    padding: 0.625rem 1.25rem !important;
    margin: 0.625rem auto 1.25rem auto !important;
}

[data-pagebuilder="widget"].fill-column,
[data-pagebuilder="widget"].fill-column > .widget-inner,
[data-pagebuilder="widget"].fill-column > .widget-inner > img {
    width: 100% !important;
    height: 100% !important;
}

[data-pagebuilder="widget"].fill-column > .widget-inner > img {
    object-fit: cover !important;
    width: auto !important;
}

/* =============================================
   HEADER
============================================= */

.img-round, 
.img-round img {
    border-radius: 1000px !important;
}

.toolbar.top {
    display: none !important;
}

header {
    position: sticky !important;
    top: 0 !important;
    z-index: 2501 !important;
    background: var(--bs-light) !important;
}

body.sitemanager-menu-open header,
body.sitemanager-menu-closed header {
    top: 63px !important;
}

header a#logo {
    padding: 0 !important;
    min-height: 100% !important;
    width: 200px !important;
    max-height: 100% !important;
}

@media (max-width: 400px) {
    header .content-toolbar .content-toolbar-inner>ul>li+li {
        margin-left: 3px !important;
    }
}

header .main-content > .row > .col {
    height: 60px !important;
}

@media(max-width:991px){
    header .content-toolbar {
        padding: 0 !important;
        margin: 0 !important;
        width: 50% !important;
        max-width: 50% !important;
    }
    header .content-toolbar.left {
        padding-left: 42px !important;
    }
    header .content-toolbar.right {
        padding-right: 0.625rem !important;
    }
    header .content-toolbar,
    header .content-toolbar .content-toolbar-inner {
        height: 100% !important;
    }
}

@media(min-width:400px){
    header a#logo {
        width: 220px !important;
    }
}

@media(min-width:575px){
    header a#logo {
        width: 275px !important;
    }
}

@media(min-width:768px){
    header a#logo {
        width: 300px !important;
    }
}

@media(min-width:992px){
    header a#logo {
        padding: 0 1.25rem !important;
        width: 315px !important;
    }
    header .main-content > .row > .col {
        height: 80px !important;
    }
    header .content-toolbar.right {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        flex: 0 !important;
        width: auto !important;
        position: absolute;
        top: calc(50% - 20px);
        right: 0.625rem;
    }
    header .content-toolbar.left {
        display: none !important;
    }
}

@media(min-width:1024px){
    header a#logo {
        width: 355px !important;
    }
}

@media(min-width:1200px){
    header a#logo {
        max-width: 500px !important;
        width: 32vw !important;
    }
}

/* =============================================
   NAV
============================================= */

@media(max-width:991px){
    .navbar-toggler, 
    header .navbar-toggler {
        height: 100% !important;
        z-index: 100 !important;
    }
    nav.navbar #main-navigation {
        background: white !important;
    }
    nav.navbar .navbar-nav .nav-item .nav-link {
        color: var(--bs-p-color) !important;
    }
    nav.navbar .navbar-nav .nav-item .nav-link:hover,
    nav.navbar .navbar-nav .nav-item .nav-link:focus {
        color: var(--bs-primary) !important;
    }
    nav.navbar .navbar-nav.navbar-right {
        border: 0 !important;
    }
    nav.navbar .navbar-nav .nav-item.dropdown .dropdown-menu.dropdown-menu-wide .dropdown-item i[class^="dia-"], 
    nav.navbar .navbar-nav .nav-item.dropdown .dropdown-menu.dropdown-menu-wide .dropdown-item i[class*=" dia-"] {
        height: 24px !important;
    }
    nav.navbar #main-navigation .mobile-bottom .nav-bottom-buttons {
        display: none !important;
    }
    nav.navbar #main-navigation .mobile-top-toolbar .toolbar-item.item-wishlist {
        display: block !important;
    }
}

@media(min-width:992px){
    nav.navbar .navbar-nav.navbar-left, 
    nav.navbar .navbar-nav.navbar-right {
        width: 50% !important;
        max-width: 50% !important;
        justify-content: space-around !important;
    }
    nav.navbar .navbar-nav.navbar-left {
        padding-right: 158.5px !important;
    }
    nav.navbar .navbar-nav.navbar-right {
        padding-left: 158.5px !important;
        padding-right: 165px !important;
    }
    nav.navbar .navbar-nav .nav-item,
    nav.navbar .navbar-nav .nav-item+.nav-item {
        padding: 0 !important;
    }   
    nav.navbar .navbar-nav .nav-item .nav-link {
        line-height: 1 !important;
        font-size: 12px !important;
        font-weight: 300 !important;
        letter-spacing: 0.05rem !important;
        text-transform: uppercase !important;
        color: var(--bs-secondary) !important;
        padding: 0.625rem 0.3125rem !important;
    }
    nav.navbar .navbar-nav .nav-item .nav-link:hover,
    nav.navbar .navbar-nav .nav-item .nav-link:focus, 
    nav.navbar .navbar-nav .nav-item.dropdown-is-open .nav-link {
        color: var(--bs-primary) !important;
    }
    nav.navbar .navbar-nav .nav-item.item-search-inline {
        padding-left: 0.3125rem !important;
        padding-right: 0.625rem !important;
        width: 100% !important;
    }
    nav.navbar .navbar-nav .nav-item.item-search-inline > form {
        width: 100% !important;
    }
    nav.navbar .navbar-nav .nav-item.item-search-inline > form > .input-group {
        min-width: none !important;
        width: 100% !important;
        flex: 1 !important;
    }
    nav.navbar .navbar-nav .nav-item.item-search-inline > form > .input-group .btn {
        padding-left: 0.125rem !important;
    }
    nav.navbar .navbar-nav .nav-item.dropdown .dropdown-menu.dropdown-menu-wide .dropdown-item.dropdown-item-parent {
        font-family: var(--bs-h1-family) !important;
        font-size: 18px !important;
    }
}
@media(min-width:1024px){
    nav.navbar .navbar-nav.navbar-left {
        padding-right: 177.5px !important;
    }
    nav.navbar .navbar-nav.navbar-right {
        padding-left: 177.5px !important;
    }
}
@media(min-width:1200px){
    nav.navbar .navbar-nav.navbar-left {
        padding-right: 16vw !important;
    }
    nav.navbar .navbar-nav.navbar-right {
        padding-left: 16vw !important;
        padding-right: 175px !important;
    }
    nav.navbar .navbar-nav .nav-item .nav-link {
        font-size: 14px !important;
    }
    nav.navbar .navbar-nav .nav-item.item-search-inline {
        padding-left: 0.625rem !important;
        padding-right: 1.25rem !important;
    }
    nav.navbar .navbar-nav .nav-item.item-search-inline > form > .input-group { 
        max-width: 300px !important;
        margin: 0 0 0 auto !important;
    }
}

@media(max-width: 430px){
    .hide-mini {
        display: none !important;
    }
}

@media(max-width: 360px){
    header .content-toolbar .content-toolbar-inner > ul > li.item-search,
    header .content-toolbar .content-toolbar-inner > ul > li.item-wishlist {
        display: none !important;
    }
    header a#logo {
        width: 170px !important;
    }
}

/* =============================================
   FOOTER
============================================= */

footer {
    background: var(--bs-primary);
    color: var(--bs-light);
    border-top: 1px solid rgba(255,255,255,0.1);
}

footer h6,
footer p,
footer .p, 
footer .footerlinks,
footer .footerlinks a,
footer .social-networks a i,
footer .subscribe-widget-xl form label,
footer p.copyrights,
footer p.copyrights * {
    color: var(--bs-light);
}

footer .logo {
    padding: 2.5rem 1.25rem 1.75rem 1.25rem !important;
    max-width: 600px !important;
    margin: 0 auto;
}

footer .logo img {
    filter: brightness(0) invert(1);
}

footer .subscribe-widget-xl form label {
    font-size: var(--bs-h6-size) !important;
    white-space: wrap !important;    
    font-weight: bolder !important;
    margin-bottom: 0 !important;
}

footer .footerlinks a {
    padding: 0.625rem;
}

@media(min-width:768px){
    footer .footerlinks {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

footer .container-fluid.px-0,
footer .px-0.container-sm,
footer .px-0.container-md,
footer .px-0.container-lg,
footer .px-0.container-xl,
footer .px-0.container-xxl {
    background: rgba(255,255,255, 0.025); 
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-left: var(--bs-container-negative-margin);
    margin-right: var(--bs-container-negative-margin);
    width: calc(100% + var(--bs-container-padding-x-2x))
}

footer .subscribe-widget-xl form label {
    font-size: calc(var(--bs-p-size) * 0.9);
    margin-bottom: var(--bs-container-padding-x)
}

footer .subscribe-widget-xl form .input-group {
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 4px
}

footer .subscribe-widget-xl form .input-group .form-control {
    color: var(--bs-primary-color);
    font-size: 0.9rem;
    background: none;
    border-color: transparent;
    box-shadow: none;
    border-radius: 4px 0 0 4px;
    padding-left: var(--bs-container-padding-x-2x) !important
}

footer .subscribe-widget-xl form .input-group .form-control::placeholder {
    color: var(--bs-primary-color);
    opacity: 0.5
}

footer .subscribe-widget-xl form .input-group .btn {
    color: var(--bs-primary-color);
    background: rgba(255,255,255,0.1);
    border-color: transparent;
    box-shadow: none;
    border-radius: 0 4px 4px 0
}

footer .subscribe-widget-xl {
    margin-top: 3rem;
    margin-bottom: 3rem;
    max-width: 100%;
    padding-left: var(--bs-container-padding-x-2x);
    padding-right: var(--bs-container-padding-x-2x)
}

footer .subscribe-widget-xl form label {
    white-space: nowrap
}

footer .subscribe-widget-xl form .input-group {
    margin: 0 auto;
    max-width: 480px
}

@media (min-width: 768px) {
    footer .subscribe-widget-xl form .input-group {
        margin:0
    }
}

footer .social-networks {
    margin-top: 2rem;
    margin-bottom: 0;
}

footer .social-networks .network {
    color: var(--bs-primary-color);
    border: 2px solid var(--bs-primary-color);
    width: 40px;
    height: 40px;
    border-radius: 40px;
    font-size: 0.9rem;
    margin: 0.5rem !important;
}

footer .social-networks .network:hover,
footer .social-networks .network:focus,
footer .social-networks .network:active {
    background: var(--bs-primary-color);
    color: var(--primary)
}

footer .social-networks.mobile-collapse {
    margin-top: 0;
    padding-left: 0;
    padding-right: 0
}

footer h6 + div > .social-networks,
footer .h6 + div > .social-networks {
    margin-top: 0rem
}

footer .footer-affiliate-logos {
    padding: 0;
    margin: 4rem auto 2rem auto
}

footer .footerlinks a {
    text-transform: uppercase !important;
    font-weight: 300 !important;
    letter-spacing: 0.05rem !important;
    font-size: 12px !important;
}

footer .required-links li a {
    font-size: 10px;
    color: var(--bs-primary-color);
    padding: 0 var(--bs-container-padding-x);
    font-weight: bolder;
    display: block;
    line-height: 1
}

@media (min-width: 768px) {
    footer .required-links li:last-child a {
        padding-right:0
    }
}

footer .accepted-ccs {
    margin: 2rem auto
}

footer .accepted-ccs li {
    display: block;
    margin-right: calc(var(--bs-container-padding-x) * .5);
    margin-bottom: calc(var(--bs-container-padding-x) * .5)
}

footer .accepted-ccs li i {
    display: block;
    font-size: 2rem
}

footer .accepted-ccs li:last-child {
    margin-right: 0
}

footer .accepted-ccs.mobile-collapse {
    margin-top: 0
}

footer p.copyrights {
    text-align: center !important;
    padding: 30px 1rem 30px 1rem !important;
}

/* =============================================
    Product Section
============================================= */

section.gattas-product-section .widget-product-carousel {
    padding: 10vw 10vw 0vw 10vw !important;
}

section.gattas-product-section .widget-product-carousel .product-slider a.widget-inner {
    border: 0 !important;
}

section.gattas-product-section .widget-product-carousel .product-slider .product-title,
section.gattas-product-section .widget-product-carousel .product-slider .product-price {
    text-align: center !important;
}

section.gattas-product-section .widget-product-carousel .product-slider .add-to-wishlist,
section.gattas-product-section .widget-product-carousel .product-slider .owl-nav, 
section.gattas-product-section .widget-product-carousel .product-slider:hover .owl-nav {
    display: none !important;
}

section.gattas-product-section .widget-product-carousel .product-slider .owl-dots {
    position: relative !important;
    width: 100% !important;
    margin-top: 50px !important;
    margin-bottom: 40px !important;
    display: flex !important;
    justify-content: center !important;
}

section.gattas-product-section .widget-product-carousel .product-slider .owl-dots .owl-dot {
    width: 7px !important;
    height: 7px !important;
    background: var(--bs-secondary) !important;
    border-radius: 20px !important;
    color: var(--bs-primary) !important;
    line-height: 1 !important;
    margin: 0 4px !important;
    opacity: 0.6 !important;
}

section.gattas-product-section .widget-product-carousel .product-slider .owl-dots .owl-dot.active,
section.gattas-product-section .widget-product-carousel .product-slider .owl-dots .owl-dot:hover,
section.gattas-product-section .widget-product-carousel .product-slider .owl-dots .owl-dot:focus {
    background: var(--bs-primary) !important;
    opacity: 1 !important;
}

section.gattas-product-section .link-container {
    padding-bottom: 40px;
}

@media(min-width:768px){
    section.gattas-product-section .widget-product-carousel {
        padding: 10vw 10vw 0vw 10vw !important;
    }
}


/* =============================================
    Testimonials Section
============================================= */

.testimonials-carousel .review-heading,
.testimonials-carousel .review-description,
.testimonials-owl-carousel .star-rating + p,
.testimonials-owl-carousel .star-rating i,
.testimonials-owl-carousel .review-description {
    color: var(--bs-light) !important;
}

.testimonials-carousel .owl-carousel .owl-dots .owl-dot,
.testimonials-carousel .testimonials-owl-carousel .owl-dots .owl-dot {
    background: var(--bs-light) !important;
    opacity: 0.5 !important;
}

.testimonials-carousel .owl-carousel .owl-dots .owl-dot:hover,
.testimonials-carousel .owl-carousel .owl-dots .owl-dot:focus,
.testimonials-carousel .owl-carousel .owl-dots .owl-dot.active,
.testimonials-carousel .testimonials-owl-carousel .owl-dots .owl-dot:hover, 
.testimonials-carousel .testimonials-owl-carousel .owl-dots .owl-dot:focus, 
.testimonials-carousel .testimonials-owl-carousel .owl-dots .owl-dot.active {
    background: var(--bs-light) !important;
  	opacity: 1 !important;
}