/* =====================================================================
   m-storefront.css — RESTYLING m.italianmoda.com, GRUPPO E (vetrine aziende)
   Caricato SOLO da _storefronts_rewrite/_included_new.cfm, DOPO m-restyle.css
   (che porta token, font, barra promo). Le vetrine non includono _header.cfm.
   Testi invariati (titoli inglesi scritti nel file + Google Translate).
   ===================================================================== */

/* --- base: via Nunito/Michroma, stessi font del resto di m. --- */
body{font-family:var(--font-b) !important;background:#FFFFFF;color:var(--text);} /* v2: fondo bianco (richiesta Maurizio) */
/* v2: niente barra promo nelle vetrine (solo qui; nelle pagine della piattaforma resta) */
#im_top_notification_bar{display:none !important;}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5{font-family:var(--font-h) !important;font-weight:600 !important;letter-spacing:-.005em;}
.lead{font-size:1.05rem;line-height:1.6;}
a{color:var(--accent);}
section.container,section.container-fluid,div.container.my-5{margin-top:2.25rem !important;margin-bottom:2.25rem !important;}
.py-1:empty{padding:0 !important;}

/* --- barra menu: non piu' fissa (copriva la copertina), ma "sticky" in alto --- */
.navbar-expand-lg.fixed-top{position:sticky !important;top:0;opacity:1 !important;background:var(--surface) !important;border-bottom:1px solid var(--hairline) !important;box-shadow:var(--shadow) !important;z-index:1030;min-height:58px;}
header.container-fluid.header-img{margin-top:0 !important;}
#navbar-toggler-icon{font-size:1.2rem !important;color:var(--text);}
#topmenu .nav > .btn{color:var(--text);box-shadow:none !important;}
#topmenu .nav > .btn .h3{font-family:var(--font-b) !important;font-weight:600 !important;margin:0;}
#topmenu .nav > .btn.border-primary{border-color:transparent !important;}
/* v2 telefono/tablet: elenco ben spaziato, una voce per riga con freccia */
@media (max-width:991.98px){
  .navbar-expand-lg.fixed-top .navbar-toggler{width:44px;height:44px;margin:7px 12px !important;padding:0;border:1px solid var(--hairline-strong) !important;border-radius:var(--r) !important;background:var(--surface) !important;display:inline-flex;align-items:center;justify-content:center;}
  #topmenu .nav{padding:6px 16px 14px;}
  #topmenu .nav > .btn{display:flex;align-items:center;justify-content:space-between;margin:0 !important;padding:16px 6px !important;border:0 !important;border-top:1px solid var(--hairline) !important;border-radius:0 !important;text-align:left;}
  #topmenu .nav > .btn:first-child{border-top:0 !important;}
  #topmenu .nav > .btn .h3{font-size:1.05rem !important;letter-spacing:.005em;}
  #topmenu .nav > .btn::after{content:"\203A";font-size:1.35rem;line-height:1;color:var(--accent);}
}
/* v2 schermi larghi: niente bottone menu, voci come schede a pillola centrate e distanziate */
@media (min-width:992px){
  .navbar-expand-lg.fixed-top .navbar-toggler{display:none !important;}
  #topmenu{flex:1 1 auto;}
  #topmenu .nav{flex:1 1 auto;width:100%;justify-content:center;flex-wrap:wrap;gap:8px;padding:10px 200px 10px 200px;}
  #topmenu .nav > .btn{flex:0 0 auto !important;margin:0 !important;padding:9px 20px !important;border:0 !important;border-radius:var(--r-btn) !important;}
  #topmenu .nav > .btn .h3{font-size:.95rem !important;}
  #topmenu .nav > .btn:hover,#topmenu .nav > .btn:focus{background:var(--accent-soft);color:var(--accent);}
}
#google_translate_element{margin-top:12px;}
/* v2: traduzione automatica Google (lingua del visitatore) invariata; quando e' attiva
   la sua barra (39px, fissa in alto) non deve coprire il menu */
html.translated-ltr body{padding-top:39px;}
html.translated-ltr .navbar-expand-lg.fixed-top{top:39px !important;}

/* --- copertina azienda: foto con angoli arrotondati; il pannello semitrasparente resta
       (v2: leggibile anche su copertine chiare) ma verde scuro e arrotondato (foto mai sfocata) --- */
header.header-img{margin:12px 12px 0 !important;width:auto;border-radius:var(--r-card);overflow:hidden;position:relative;}
header.header-img > .row{position:relative;z-index:1;width:100%;}
header.header-img .rounded{background:rgba(21,43,28,.70) !important;border:1px solid rgba(255,255,255,.14);border-radius:14px !important;padding:14px 18px !important;margin:0 4px !important;box-shadow:0 8px 24px rgba(0,0,0,.18);}
/* v3: dimensioni di titolo e slogan come in origine (regole del file della vetrina: 2rem telefono, 2.5rem tablet, 4.5rem schermi larghi) */
header.header-img h1.display-3{font-weight:700 !important;line-height:1.1;letter-spacing:-.01em;margin-bottom:.35rem;text-shadow:0 1px 12px rgba(0,0,0,.25);}
header.header-img p.h3{font-family:var(--font-b) !important;font-weight:500 !important;line-height:1.35;opacity:.95;}
@media (min-width:769px){header.header-img .rounded{padding:22px 40px !important;}}
/* v4: su schermi larghi il pannello ha larghezza fissa: quando Google traduce lo slogan
   (testo piu' lungo o piu' corto) il pannello non cambia misura */
@media (min-width:992px){header.header-img .rounded{flex:0 0 auto;width:min(88%,880px);max-width:none;}}
@media (max-width:768px){header.header-img{min-height:260px !important;}}

/* --- titoli di sezione --- */
h2.h1{font-size:1.5rem !important;line-height:1.25;margin-bottom:.5rem !important;}
h2.h1 + p.lead,.w-100 > p.lead{color:var(--text-soft);font-size:.98rem;}
section h3{font-size:1.15rem !important;}
#social h1,#social h2{font-size:1.5rem !important;}

/* --- bottoni --- */
.btn{border-radius:var(--r-btn);font-family:var(--font-b);font-weight:600;}
.btn .h3{font-family:var(--font-b) !important;font-size:1rem !important;font-weight:600 !important;margin:0;}
.btn-primary,.btn-primary:not(:disabled):not(.disabled):active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:none !important;}
.btn-primary:hover,.btn-primary:focus{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff;}
.btn-lg{padding:12px 24px;}
.btn-light{background:var(--surface);border:1px solid var(--hairline-strong);color:var(--text);box-shadow:none !important;}
.btn-light:hover{background:var(--bg-alt);border-color:var(--hairline-strong);}
#backtotop_button{bottom:20px !important;right:16px !important;width:44px;height:44px;background:var(--surface) !important;border:1px solid var(--hairline-strong) !important;color:var(--accent);box-shadow:var(--shadow-lg);}

/* --- schede prodotto e riquadri --- */
.card{border:1px solid var(--hairline);border-radius:var(--r-card);overflow:hidden;background:var(--surface);}
.card.shadow,.shadow{box-shadow:0 .5rem 1rem rgba(21,27,18,.15) !important;} /* v2: ombra attorno alle schede (come prima) */
.card-img-top{border-radius:0;}
.card-body{font-size:.9rem;}
.card-body h5,.card-body .h5,.card-title{font-size:1rem !important;}
.card-text.text-muted{color:var(--text-soft) !important;}
.card .btn-block{border-radius:var(--r-btn);font-size:.86rem;}
.card-header{background:var(--bg-alt);border-bottom:1px solid var(--hairline);}
.card-header h6{margin:0;font-size:.82rem !important;letter-spacing:.06em;text-transform:uppercase;}
.list-group-item{border-color:var(--hairline);}
.list-group-item.bg-light,.bg-light{background:var(--surface) !important;}
.progress{border-radius:var(--r-btn);background:var(--bg-alt);}
.progress-bar.bg-info{background:var(--accent) !important;font-size:.82rem !important;}

/* --- FAQ come schede apri/chiudi --- */
#accordionfaq .card{border-radius:var(--r) !important;margin-bottom:8px;border:1px solid var(--hairline) !important;}
#accordionfaq .card-header{background:var(--surface);border:0;padding:0;}
#accordionfaq .card-header .btn-link{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 16px;color:var(--text);text-decoration:none;border-radius:0;}
#accordionfaq .card-header .btn-link .lead{font-size:.98rem;font-weight:600;line-height:1.4;}
#accordionfaq .card-header .btn-link::after{content:"+";flex:none;width:24px;height:24px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:600;line-height:24px;text-align:center;}
#accordionfaq .card:has(.collapse.show) .card-header .btn-link::after{content:"\2212";}
#accordionfaq .card-header .btn-link:focus{box-shadow:none;}
#accordionfaq .card-body{padding:0 16px 14px;color:var(--text-soft);}

/* --- contatti: riquadri nei colori del sito --- */
#contactspanels .card.bg-primary{background:var(--accent-strong) !important;border:0;}
#contactspanels .card.bg-info{background:var(--accent) !important;border:0;}
#contactspanels .card a{color:#fff;text-decoration:underline;text-underline-offset:3px;}
#contactspanels .card .fa-2x{font-size:1.5rem;margin:12px !important;}

/* --- servizi: riga che usciva dallo schermo --- */
#services .row.mb-4.lead{margin-left:0;margin-right:0;}

/* --- v2 notizie (#blog): tabella e immagini non escono dallo schermo --- */
#blog .table{table-layout:fixed;width:100%;}
#blog .table td{overflow-wrap:anywhere;}
#blog img,#blog iframe,#blog video{max-width:100% !important;height:auto;}

/* --- v2 copertina con video (Plyr): niente spazio vuoto, bottone play misurato, colori del sito --- */
header.header-img .row{margin-left:0;margin-right:0;}
header.header-img > .row.d-block{margin-top:14px !important;}
header.header-img > .row.d-block h1.display-3{text-shadow:none;color:var(--text);}
header.header-img > .row.d-block p.h3{color:var(--text-soft);}
:root{--plyr-color-main:#1F5A36;}
.plyr--full-ui.plyr--video .plyr__control--overlaid{width:68px !important;height:68px !important;}
.plyr--full-ui.plyr--video .plyr__control--overlaid > svg{left:2px !important;width:26px !important;height:26px !important;}

/* --- footer --- */
footer.container-fluid > .row.bg-dark{margin:0;background:var(--accent-strong) !important;font-size:.9rem;padding:20px 16px !important;}
footer.container-fluid{padding:0;}
#backtotop_button .fa-3x{font-size:1.5rem;line-height:44px;}