/* Custom css specifico del progetto */
:root {
    --primary-color: #ED7102;
    --primary-color-darker: #CF6202;

    --bs-primary-rgb: 237, 113, 2;
    --bs-bg-opacity: 1;
}


body{
    font-family:'Open Sans',sans-serif;
    -webkit-font-smoothing: antialiased;
}
.font-alt{
    font-family: "Montserrat", arial, sans-serif;
}

.color-primary{
    color: var(--primary-color);
}
.color-primary-darker{
    color: var(--primary-color-darker);
}


p{
    margin: 0 0 .5em 0;
}

/* Overrides template */
.btn-mod, a.btn-mod{
    background: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-mod:hover,
.btn-mod:focus,
a.btn-mod:hover,
a.btn-mod:focus{
    background: var(--primary-color-darker);
    border-color: var(--primary-color-darker);
}
.form textarea{text-transform: none !important;}


.hs-line-11{
    letter-spacing: 0.2em;
}

.mod-breadcrumbs{
    letter-spacing: 0.2em;
    word-break: keep-all;
}

.mod-breadcrumbs span{
    color: var(--primary-color);
    opacity: 1;
}

/* Alerts */
.alert{text-transform: none !important;}
.alert p{margin-bottom: 0 !important;}


/* Nav max width */
nav.main-nav > .full-wrapper{
    max-width: 1400px;
    margin: auto;
}

nav.main-nav.mobile-on.small-height{
    height: 75px !important;
}

/* Mobile nav button - fix per accessibilità: reset stili default button */
button.mobile-nav {
    background: transparent !important;
    border: none !important;
    border-left: 1px solid rgba(0,0,0, .05) !important;
    border-right: 1px solid rgba(0,0,0, .05) !important;
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    width: 75px !important;
    height: 75px !important;
    display: none;
    float: right;
    vertical-align: middle;
    cursor: pointer;
}

button.mobile-nav:focus {
    outline: none;
    box-shadow: none;
}

button.mobile-nav .fa {
    height: 100% !important;
    width: 100% !important;
    font-size: 21px !important;

    display: flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

/* Assicura che il mobile-nav sia visibile e allineato correttamente su mobile */
@media all and (max-width: 1024px) {
    button.mobile-nav {
        display: table !important;
    }
}

/* Colore bianco per l'icona quando il main-nav non è dark */
.main-nav:not(.dark) button.mobile-nav {
    color: #333 !important;
}

.main-nav:not(.dark) button.mobile-nav:hover,
.main-nav:not(.dark) button.mobile-nav.active {
    background: #fff !important;
    color: #777 !important;
}
/* input .with-error */
input.with-error{
    border-color: red !important;
}
.preorder-form-step-title{
    font-weight: bold;
}


/* Category Grid */

.category-grid-entry > a > img,
.category-grid-entry > a > p{
    transition: all 0.3s cubic-bezier(.3,.1,.58,1);
}

.category-grid-entry > a:hover > img
{
    opacity: 0.6;
}

.category-grid-entry > a:hover  > p {
    bottom: 0 !important;
}

.products-grid .products-grid-entry .products-grid-entry-intro p{
    line-height: 1.3em;
}


/* Product grid */
@media all and (min-width: 992px) {
    .products-grid-entry-intro{
        overflow: hidden;
        height: 74px;
        text-overflow: ellipsis;
    }
}

.products-grid-entry-symbols{
    white-space: nowrap;
}


/* Product page */
.product-page #main_description p{
    margin-bottom: .5em;
}

.button-product-image.active{
    color: #fff;
  border-color: transparent;
  background: #000;
}

#classifications_entry_icons a{
    border: solid 2px transparent;
}

#classifications_entry_icons a.active{
    border-color: var(--primary-color);
}

#classification-description-holder{
    border-top: solid 1px #d5d5d5;
    border-bottom: solid 1px #d5d5d5;
}

#product-tabs img.img-responsive{
    width: 100%; height: auto;
}




/* News */

.article-wrapper{
	display: flex;
	flex-direction: row;
	margin-bottom: 4em;

}

.article-wrapper .article-content{
	width: 60%;
	display: flex;
	flex-direction: column;
}

.article-content .article-text{
	height: 80%;
	padding-left: 2em;
}

.article-content .article-link{
	height: 20%;
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding-left: 2em;
}

/* versione senza foto */
.article-wrapper.without-article-image .article-content{
    width: 100%;
}
.article-wrapper.without-article-image .article-content .article-text,
.article-wrapper.without-article-image .article-content .article-link
{
    padding-left: 0;
}




.article-title > a{
    text-decoration: none;
    text-transform: uppercase;
}


@media all and (max-width: 992px) {

    .article-wrapper{
        flex-direction: column;
    }

    .article-wrapper .article-content,
    .article-content .article-text
    {
        width: 100%;
    }
    
    .article-wrapper .article-picture{
        width: 100%;
    }
    .article-wrapper .article-picture a{
        display: block;
    }
    .article-wrapper .article-picture a img{
        width: 100%; height: auto;
    }
    
    .article-content .article-text{
        padding-left: 0;
        padding-top: 1em;
    }
    
    .article-content .article-link{
        padding-left: 0;
    }
}

.pagination a.active{
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

/* Account */
.account-menu a i{
    margin-right: 0.8em;
}

/* Footer */

/* social footer */
.footer-social-links a::before{
    content: none;
}
.footer-social-links a i{
    font-size: 2em;
}

.footer-social-links a{
    color: #888;
}
.footer-social-links a:hover{
    color: var(--primary-color);
}


/* GDPR Flags */
label.gdpr-input.with-errors .GDPRFlag-input{
    border: solid 2px red;
}
.GDPRFlag-input .opt-input{
    background-color: #FFFFFF;
    transition: all 500ms;
    cursor: pointer;
}
.GDPRFlag-input .opt-yes.selected,
.GDPRFlag-input .opt-no.selected{
    background-color: #428bca;
    color: white;
}

/* Accessibility: Field error messages */
.field-error {
    display: block;
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
    min-height: 1.25rem;
}

.field-error[aria-hidden="true"] {
    display: none;
}

/* Label styles for visible labels */
.form-group label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #333;
}

.form-group label .required {
    color: #dc3545;
}

/* Button loading state accessibility */
.btn .btn-loading {
    display: inline-block;
}

.btn .btn-loading.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}


/* Accessibility: Field error messages - più compatto */
.field-error {
    display: block;
    color: #dc3545;
    font-size: 0.8125rem;
    margin-top: 0.125rem;
    margin-bottom: 0;
    min-height: 1rem;
    line-height: 1.2;
}

.field-error[aria-hidden="true"] {
    display: none;
}

/* Label styles for visible labels - design compatto */
.form-group label {
    display: block;
    margin-bottom: 0.25rem;
    font-weight: 500;
    font-size: 0.875rem;
    color: #666;
    line-height: 1.3;
}

.form-group label .required {
    color: #dc3545;
    margin-left: 2px;
}

/* Riduci spazio tra i form-group */
.form-group {
    margin-bottom: 1rem;
}


/* ################################  */
/* pagebuilder frontend css support */

:root{
    --pb_spacing_1: 1rem;
    --pb_spacing_2: 2rem;
    --pb_spacing_3: 3rem;
    --pb_spacing_4: 4rem;
    --pb_spacing_5: 5rem;
}


/* Figure */
figure.with-img-responsive img{ width: 100%; height: auto; }


/* Backgrounds */
.with-background.with-background-cover{
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.with-background.with-background-contain{
    background-repeat: no-repeat;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
}

.with-background.with-background-contain{
    background-repeat: repeat;
}


/* Bottone alternativo, outline */
.btn.btn-alt{
    background: transparent;
    color: #3c3c3c;
    border-color: #3c3c3c;
    text-decoration: none;
}
.btn.btn-alt:hover,
.btn.btn-alt:active,
.btn.btn-alt:focus
{
    color: #FFFFFF;
    background: #3c3c3c;
}





/* General Layout Padding and Margin */

.pb_p-0{
    padding: 0 !important;
}
.pb_p-1{
    padding: var(--pb_spacing_1) !important;
}
.pb_p-2{
    padding: var(--pb_spacing_2) !important;
}
.pb_p-3{
    padding: var(--pb_spacing_3) !important;
}
.pb_p-4{
    padding: var(--pb_spacing_4) !important;
}
.pb_p-5{
    padding: var(--pb_spacing_5) !important;
}


.pb_m-0{
    margin: 0 !important;
}
.pb_m-1{
    margin: var(--pb_spacing_1) !important;
}
.pb_m-2{
    margin: var(--pb_spacing_2) !important;
}
.pb_m-3{
    margin: var(--pb_spacing_3) !important;
}
.pb_m-4{
    margin: var(--pb_spacing_4) !important;
}
.pb_m-5{
    margin: var(--pb_spacing_5) !important;
}


/* padding and margin for smaller screens */

@media all and (max-width: 991px) {
    
    .pb_sm_p-0{
        padding: 0 !important;
    }
    .pb_sm_p-1{
        padding: var(--pb_spacing_1) !important;
    }
    .pb_sm_p-2{
        padding: var(--pb_spacing_2) !important;
    }
    .pb_sm_p-3{
        padding: var(--pb_spacing_3) !important;
    }
    .pb_sm_p-4{
        padding: var(--pb_spacing_4) !important;
    }
    .pb_sm_p-5{
        padding: var(--pb_spacing_5) !important;
    }
    
    
    .pb_sm_m-0{
        margin: 0 !important;
    }
    .pb_sm_m-1{
        margin: var(--pb_spacing_1) !important;
    }
    .pb_sm_m-2{
        margin: var(--pb_spacing_1) !important;
    }
    .pb_sm_m-3{
        margin: var(--pb_spacing_1) !important;
    }
    .pb_sm_m-4{
        margin: var(--pb_spacing_1) !important;
    }
    .pb_sm_m-5{
        margin: var(--pb_spacing_1) !important;
    }
    
}





/* Plugin Spacer */

.pb-spacer{
    display: block;
    width: 100%;
    height: var(--pb_spacing_1);
}

.pb-spacer.pb_h_0{
    height: 0px;
}
.pb-spacer.pb_h_1{
    height: var(--pb_spacing_1);
}
.pb-spacer.pb_h_2{
    height: var(--pb_spacing_2);
}
.pb-spacer.pb_h_3{
    height: var(--pb_spacing_3);
}
.pb-spacer.pb_h_4{
    height: var(--pb_spacing_4);
}
.pb-spacer.pb_h_5{
    height: var(--pb_spacing_5);
}



@media all and (max-width: 991px) {
    
    .pb-spacer.pb_sm_h_1{
        height: var(--pb_spacing_1);
    }
    .pb-spacer.pb_sm_h_2{
        height: var(--pb_spacing_2);
    }
    .pb-spacer.pb_sm_h_3{
        height: var(--pb_spacing_3);
    }
    .pb-spacer.pb_sm_h_4{
        height: var(--pb_spacing_4);
    }
    .pb-spacer.pb_sm_h_5{
        height: var(--pb_spacing_5);
    }
    
}