/*  FD Clothing CSS3 Ver. 0.1.0
    Copyright 1999 - 2026 JAM Studio
    Visit Us (https://www.jamstudio.it/)    */

/*  =====================================================
    =   Font utilizzati                                 =
    =   font-family: "Montserrat", sans-serif;          =
    =   font-family: "Figtree", sans-serif;             =
    =====================================================   */

/*  =====================================================
    =   PALETTE E TYPOGRAPHY                            =
    =====================================================   */
:root {
/*      --> Fonts sito                                      */
    --shop-header-font      : "Montserrat", sans-serif;
    --shop-text-font        : "Figtree", sans-serif;
/*      --> Main Colors                                     */
    --shop-main             : #1F2A44;
    --shop-main-l           : #222F4C;
    --shop-secondary        : #FF5A7D;
    --shop-main-rgb         : 31,42,68;
    --shop-main-l-rgb       : 34,47,76;
    --shop-secondary-rgb    : 255,90,125;
    --shop-merx-signature   : #F4F6FA;
/*      --> Colori Aggiuntivi                               */
    --fd-gold               : #D1BC36;
    --fd-grey               : #F4F6FA;
    --fd-gold-rgb           : 209,188,54;
    --fd-grey-rgb           : 244,246,250;
}
/*  =====================================================
    =   BUTTONS                                         =
    =====================================================   */
.btn-icon.social {--bs-btn-bg: var(--fd-grey); --bs-btn-disabled-bg: var(--fd-grey); }
.btn-icon.social .icon { background-color: var(--main); }
.btn-icon.social:hover .icon, .btn-icon.social:active .icon, .btn-icon.social.active .icon { background-color: var(--white); }
.btn-preferiti { --bs-btn-padding-x: 1rem; --bs-btn-padding-y: .938rem; --bs-btn-font-size: 1rem; --bs-btn-font-weight: 500; --bs-btn-color: var(--grey-d); --bs-btn-hover-color: var(--red); --bs-btn-active-color: var(--red); --bs-btn-disabled-color: var(--grey-d); --bs-btn-border-width: 0; display: flex; align-items: center; justify-content: center; gap: .5rem; }
.btn-filtri { --bs-btn-color: var(--main); --bs-btn-hover-color: var(--main-l); --bs-btn-active-color: var(--main-l); --bs-btn-disabled-color: var(--main); --bs-btn-font-weight: 500; }
.btn-filtri .icon { background-color: var(--main); }
.btn-filtri:hover .icon, .btn-filtri:active .icon, .btn-filtri.active .icon { background-color: var(--main-l); }
/*      --> Menu Navbar                                     */
.menu-link { padding: .438rem .5rem; color: var(--main-l); font-family: var(--header-font); font-size: 1.125rem; font-weight: 500; line-height: 1; text-decoration: none; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-radius: 0; display: flex; align-items: center; white-space: nowrap; -webkit-transition: 400ms ease; -moz-transition: 400ms ease; -o-transition: 400ms ease; -ms-transition: 400ms ease; transition: 400ms ease; transition-property: all; }
#homepagebar.scrolled .menu-link, #pagebar.scrolled .menu-link { padding: .5rem; font-size: 1rem; -webkit-transition: 400ms ease; -moz-transition: 400ms ease; -o-transition: 400ms ease; -ms-transition: 400ms ease; transition: 400ms ease; transition-property: all; }
.menu-link:hover, .menu-link.active, .menu-link:active, .menu-link.show { color: var(--main); text-decoration: none; border-bottom-color: var(--secondary); -webkit-transition: 400ms ease; -moz-transition: 400ms ease; -o-transition: 400ms ease; -ms-transition: 400ms ease; transition: 400ms ease; transition-property: all; }
.menu-link:focus { box-shadow: none; }
.menu-link.in-evidenza, .menu-link:hover.in-evidenza { color: var(--white); background-color: var(--secondary); border: 0; border-radius: .25rem; }
/*      --> Bottoni Carousel                                */
.ico-carousel-chevron-right, .ico-carousel-chevron-left { min-width: 1rem; height: 4rem; background-color: var(--secondary); -webkit-mask: url("../images/icons/carousel-chevron.svg") no-repeat center; mask: url("../images/icons/carousel-chevron.svg") no-repeat center; }
.ico-carousel-chevron-left { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
/*  =====================================================
    =   ELEMENTI COMUNI                                 =
    =====================================================   */
/*      --> Typografy                                       */
.page-title, .section-title { font-weight: 300; }
/*      --> Breadcrumb                                      */
.page-breadcrumb-container { background-color: var(--fd-grey); border-radius: 0; }
.page-breadcrumb { width: 100%; align-self: center; }
/*      --> Cards                                           */
.home-carousel .card-prodotto, .carousel-suggeriti .card-prodotto { width: 100%; background-color: var(--fd-grey); align-self: center; border-radius: .5rem; }
.card-badge, .prezzo-prodotto .sconto, .scheda-prodotto .prezzo-prodotto .sconto { background-color: var(--secondary); }
.card-carrello-sm .card-img-container .btn-icon, .card-carrello-sm .card-img-container .btn-icon-sm { --bs-btn-color: var(--main); --bs-btn-bg: rgba(255, 255, 255, 0); --bs-btn-hover-color: var(--main); --bs-btn-hover-bg: rgba(255, 255, 255, 0.75); --bs-btn-active-color: var(--main); --bs-btn-active-bg: rgba(255, 255, 255, 0.75); --bs-btn-disabled-color: var(--main); --bs-btn-disabled-bg: rgba(255, 255, 255, 0); }
.card-carrello-sm .card-img-container .btn-icon p, .card-carrello-sm .card-img-container .btn-icon-sm p { font-weight: 600; }
/*  =====================================================
    =   HEADER                                          =
    =====================================================   */
/*      --> Top Banner                                      */
.container-topbar { color: var(--secondary); background-color: var(--fd-grey); }
.container-topbar .icon { background-color: var(--secondary); }
.container-topbar p { font-size: 1rem; font-weight: 500; }
/*      --> Navbar                                          */
.navbar-logo img { height: 3rem; }
#homepagebar.scrolled .navbar-logo img, #pagebar.scrolled .navbar-logo img { height: 2rem; }
/*      --> Hero image                                      */
.container-hero .page-img-frame .page-img { object-position: top center; }
.hero-label { font-weight: 500; }
.hero-title { font-weight: 200; }
@media (max-width: 991.98px) {
    .navbar-logo img, #homepagebar.scrolled .navbar-logo img, #pagebar.scrolled .navbar-logo img { height: 2rem; }
}
@media (max-width: 575.98px) {
    .container-topbar p { font-size: .875rem; }
}
/*  =====================================================
    =   FOOTER                                          =
    =====================================================   */
.container-payments { background: var(--fd-grey); background: -webkit-linear-gradient(0deg, rgba(var(--fd-grey-rgb), 1) 75%, rgba(213, 213, 213, 1) 100%); background: -moz-linear-gradient(0deg, rgba(var(--fd-grey-rgb), 1) 75%, rgba(213, 213, 213, 1) 100%); background: linear-gradient(0deg, rgba(var(--fd-grey-rgb), 1) 75%, rgba(213, 213, 213, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="var(--fd-grey)", endColorstr="#D5D5D5", GradientType=0); }
.container-footer { color: var(--grey-c); }
.footer-label { color: var(--fd-grey); font-weight: 500; }
.footer-link { --bs-btn-font-family: var(--header-font); --bs-btn-color: var(--grey-c); --bs-btn-disabled-color: var(--grey-c); }
.footer-link.in-evidenza { --bs-btn-color: var(--secondary); }
.dropdown .footer-link .btn-dropdown-icon { background-color: var(--grey-c); }
.footer-bottom p { color: var(--fd-grey); line-height: 1; display: flex; align-items: center; gap: .25rem; flex-wrap: wrap; }
.footer-bottom-logo { margin-left: .25rem; font-family: var(--header-font); font-size: 1.125rem; line-height: 1; letter-spacing: .0435em; text-transform: uppercase; display: flex; align-items: center; gap: .25rem; white-space: nowrap; }
.footer-bottom-logo b { font-size: 1.5rem; font-weight: 800; }
/*  =====================================================
    =   OPZIONI DI RICERCA                              =
    =====================================================   */
.sidebar-header { color: var(--main); background-color:rgba(var(--fd-grey-rgb), 1); }
.lista-filtri, .lista-faq { --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231F2A44' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FF5A7D' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
@media (min-width: 575.98px) {
    .container-sidebar { box-shadow: none; }
}
/*  =====================================================
    =   HOMEPAGE                                        =
    =====================================================   */
/*      --> Homepage Reparti                                */
.overlay-reparti { width: 100%; height: 100%; border-radius: .25rem; background-color: rgba(var(--main-rgb), 0); display: flex; position: absolute; top: 0; }
.overlay-reparti:hover { background-color: rgba(var(--main-rgb), 0.25); }
.label-reparti-container { width: 48px; height: 100%; writing-mode:vertical-rl; text-orientation: mixed; display: block; position: absolute; top: 0; left: auto; bottom: auto; right: 0; }
.label-reparti { margin: 1.5rem 1rem; color: var(--white); font-family: var(--header-font); font-size: 3.5rem; font-weight: 200; line-height: 1; text-transform: uppercase; }
/*      --> Homepage Banner                                 */
.page-img-frame.homepage-banner { padding-top: 40%; }
.container-banner-text { width: 50%; color: var(--white); display: flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; top: 0; right: 0; bottom: 0; left: auto; }
.banner-sconto, .banner-title { margin-bottom: 0; font-family: var(--header-font); line-height: 1; text-align: center;  text-shadow: 0 0.25rem 0.5rem rgba(var(--shop-main-rgb), 0.1); }
.banner-sconto {  font-size: 18rem; font-weight: 300; }
.banner-sconto small {  font-size: 100%; font-weight: 100; }
.banner-title {  font-size: 6rem; font-weight: 200; }
.container-banner-text .btn-white { --bs-btn-color: var(--main); --bs-btn-disabled-color: var(--main); }
/*      --> Calousel Marchi                                 */
.link-marchi { width: 100%; max-width: 240px; text-decoration: none; display: block; opacity: .5;}
.link-marchi:hover { opacity: .75;}
@media (max-width: 1920.98px) {
    .banner-sconto {  font-size: 15vw; }
    .banner-title {  font-size: 5vw; }
}
@media (max-width: 1199.98px) {
    .label-reparti { margin: 1rem .75rem; font-size: 3rem;}
}
@media (max-width: 768.98px) {
    .label-reparti { font-size: 2.5rem;}
    .page-img-frame.homepage-banner { padding-top: 60%; }
    .container-banner-text { width: auto; justify-content: flex-start; }
}
@media (max-width: 575.98px) {
    .container-fluid.reparti { padding-right: 0!important;}
    .label-reparti { margin: .75rem .5rem; font-size: 2rem;}
    .page-img-frame.homepage-banner { padding-top: 70%; }
    .homepage-banner .page-img { border-radius: 0; }
    .banner-sconto {  font-size: 5.5rem; }
    .banner-title {  font-size: 1.875rem; }
}