/* Sito per i clienti da PC, dal 1100 px in su: testata in alto al posto della barra laterale, così le pagine hanno
   tutta la larghezza; nella ricerca delle barche, la mappa vera accanto ai risultati. Sul telefono non cambia niente. */
html.cd-on .dnav { display: none !important; }
html.cd-on .screen-wrap { top: calc(64px + var(--cd-su, 0px)) !important; height: calc(100% - 64px - var(--cd-su, 0px)) !important; }
html.cd-on .cd-testa { position: absolute; top: var(--cd-su, 0px); left: 0; right: 0; height: 64px; z-index: 50; box-sizing: border-box; display: flex; align-items: center; gap: 26px; padding: 0 clamp(20px, 3.4vw, 48px); background: #fff; border-bottom: 1px solid #e3e9ea; font-family: "Plus Jakarta Sans", sans-serif; }
html.cd-on .cd-testa button { background: none; border: 0; padding: 8px 2px; font: 600 14.5px "Plus Jakarta Sans", sans-serif; color: #0c2a33; cursor: pointer; white-space: nowrap; }
html.cd-on .cd-testa button:hover { color: #126f83; }
html.cd-on .cd-testa button:focus-visible { outline: 2px solid #157d92; outline-offset: 2px; border-radius: 6px; }
html.cd-on .cd-testa .cd-logo { font: 600 27px "Playfair Display", serif; color: #0a3a48; padding: 0 10px 0 0; }
html.cd-on .cd-testa .cd-spazio { flex: 1 1 auto; }
html.cd-on .cd-testa .cd-entra { background: #0a3a48; color: #fff; padding: 10px 18px; border-radius: 999px; font-weight: 700; }
html.cd-on .cd-testa .cd-entra:hover { background: #0c4c5e; color: #fff; }

/* Le pagine si centrano su una larghezza da scrivania. */
html.cd-on #home .hm-wrap, html.cd-on #home .hm-sez, html.cd-on #home .h-sech { max-width: 1344px; margin-left: auto; margin-right: auto; }

/* Ricerca: risultati a sinistra, mappa a destra. */
html.cd-ric #search { padding-right: var(--cd-mappa); }
html.cd-ric #search #results { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important; gap: 22px 18px; padding: 0 24px 40px; width: auto !important; box-sizing: border-box; }
html.cd-ric #search #results > * { margin: 0 !important; width: auto !important; }
html.cd-ric #search .maptoggle { display: none !important; }
html.cd-ric .cd-mappa { display: block; position: fixed; right: 0; bottom: 0; top: var(--cd-mappa-su); width: var(--cd-mappa); z-index: 5; background: #bfdfe6; border-left: 1px solid #dfe6e8; }
html:not(.cd-ric) .cd-mappa { display: none; }
html.cd-ric .cd-pin { display: inline-block; transform: translate(-50%, calc(-50% + var(--cd-sposta, 0px))); background: #fff; color: #0c2a33; font: 700 13px "Plus Jakarta Sans", sans-serif; padding: 6px 10px; border-radius: 999px; box-shadow: 0 3px 10px rgba(6, 34, 44, .28); white-space: nowrap; cursor: pointer; }
html.cd-ric .cd-pin:hover, html.cd-ric .cd-pin.cd-su { background: #0a3a48; color: #fff; }

/* Logo, «Hai una barca?» e avatar li ha già la testata. */
html.cd-on #home .h-htx, html.cd-on #home .hm-pill.hm-solopc, html.cd-on #home #heroAvatar { display: none !important; }

/* Scheda dell'annuncio e I miei viaggi: pagine da scrivania. */
html.cd-on #detail, html.cd-on #expdetail { background: #fff; }
html.cd-on #detail #dgallery.gallery { border-radius: 16px; overflow: hidden; }
html.cd-on #detail #dgallery .gslide img { object-fit: cover !important; }
html.cd-on #detail #dgallery.gallery.glv::before { display: none !important; }
html.cd-on #trips, html.cd-on #cprofile, html.cd-on #s33inbox { background: #fff; }
html.cd-on #trips > * { max-width: 1040px; margin-left: auto; margin-right: auto; box-sizing: border-box; }

/* Ricerca: le categorie in una colonna a sinistra, come un elenco di filtri. */
html.cd-ric #search { padding-left: 256px; }
html.cd-ric #search .subhead { margin-left: -256px; width: calc(100% + 256px) !important; box-sizing: border-box; }
html.cd-ric #search #s38cats { position: absolute; left: 0; top: var(--cd-cat-su, 170px); width: 240px; display: flex !important; flex-direction: column; flex-wrap: nowrap !important; overflow: visible !important; gap: 4px; padding: 0 0 24px 20px; box-sizing: border-box; }
html.cd-ric #search #s38cats > * { width: 100% !important; justify-content: flex-start; flex: 0 0 auto; margin: 0 !important; }

/* Fuori dalle pagine da PC la testata non c'è. */
html:not(.cd-on) .cd-testa { display: none !important; }

/* Modalità notte. */
html.cd-on:has(#app.luxdark) .cd-testa { background: #0e1a22; border-color: #1a2e3b; }
html.cd-on:has(#app.luxdark) .cd-testa button { color: #e2e8f0; }
html.cd-on:has(#app.luxdark) .cd-testa .cd-logo { color: #fff; }
html.cd-on:has(#app.luxdark) .cd-testa .cd-entra { background: #14a3b6; color: #06222c; }
html.cd-on:has(#app.luxdark) #detail, html.cd-on:has(#app.luxdark) #expdetail, html.cd-on:has(#app.luxdark) #trips, html.cd-on:has(#app.luxdark) #cprofile, html.cd-on:has(#app.luxdark) #s33inbox { background: #0b161d; }
html.cd-ric:has(#app.luxdark) .cd-pin { background: #0e1a22; color: #e2e8f0; }

/* Scheda dell'annuncio: mosaico di foto al posto del carosello, se ce ne sono almeno tre. */
html.cd-on .cd-mosaico { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 210px 210px; gap: 8px; border-radius: 16px; overflow: hidden; margin-bottom: 18px; position: relative; }
html.cd-on .cd-mosaico button { padding: 0; border: 0; background: #e3e9ea; cursor: zoom-in; min-width: 0; min-height: 0; overflow: hidden; }
html.cd-on .cd-mosaico button:first-child { grid-column: span 2; grid-row: span 2; }
html.cd-on .cd-mosaico img { width: 100%; height: 100%; object-fit: cover; display: block; }
html.cd-on .cd-mosaico button:focus-visible { outline: 3px solid #157d92; outline-offset: -3px; }
html.cd-on #dgallery.cd-col-mosaico { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0; pointer-events: none; }
html:not(.cd-on) .cd-mosaico { display: none; }
html.cd-on #detail.cd-ha-mosaico > .cd-mosaico { grid-column: 1; grid-row: 1; margin: 0; align-self: start; }

/* I miei viaggi: il prossimo in grande, gli altri in griglia. */
html.cd-on body .app .screen#trips { padding-left: max(32px, calc((100% - 1120px) / 2)) !important; padding-right: max(32px, calc((100% - 1120px) / 2)) !important; }
html.cd-on #trips > * { max-width: none; }
html.cd-on #trips > .subhead { background: none !important; box-shadow: none !important; border: 0 !important; padding: 28px 0 8px !important; position: static !important; }
html.cd-on #trips > .subhead .backrow > .iconbtn:first-child { display: none; }
html.cd-on #trips > .subhead .ti b { font: 500 34px/1.15 "Playfair Display", serif; }
html.cd-on #tripsBody { padding: 8px 0 40px !important; }
html.cd-on #tripsBody .vc-hero { min-height: 380px; border-radius: 18px; }
html.cd-on #tripsBody .trips-seg { max-width: 360px; margin-top: 22px; }
html.cd-on #tripsBody .trips-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; align-items: start; }
html.cd-on #tripsBody .trips-list > :not(.rcard) { grid-column: 1 / -1; }
html.cd-on #tripsBody .trips-list > .rcard { margin: 0; width: auto; max-width: none; }
html.cd-on #tripsBody .trips-list:empty, html.cd-on #tripsBody #myMoorings:empty { display: none; }
html.cd-on #tripsBody .emptytrip { max-width: 520px; margin: 40px auto; }
html.cd-on #tripsBody #s13TripBtn { max-width: 520px; }

/* I filtri aperti nella colonna della ricerca. */
html.cd-ric #search .cd-filtri { position: absolute; left: 16px; width: 224px; box-sizing: border-box; font-size: 13.5px; padding-bottom: 28px; }
html.cd-ric #search .subhead [onclick*="openAdv"] { display: none !important; }
html.cd-ric .cd-filtri #advSheet { position: static !important; display: block !important; inset: auto !important; opacity: 1 !important; visibility: visible !important; transform: none !important; pointer-events: auto !important; background: none !important; backdrop-filter: none !important; padding: 0 !important; z-index: auto !important; width: auto !important; height: auto !important; }
html.cd-ric .cd-filtri .authcard { position: static !important; width: auto !important; max-width: none !important; max-height: none !important; overflow: visible !important; transform: none !important; padding: 0 !important; margin: 0 !important; background: none !important; box-shadow: none !important; border: 0 !important; border-radius: 0 !important; animation: none !important; }
html.cd-ric .cd-filtri :is(.grip, .eyebrow2, h2, .authclose, .cta), html.cd-ric .cd-filtri #adv-type, html.cd-ric .cd-filtri #adv-type { display: none !important; }
html.cd-ric .cd-filtri .flabel:has(+ #adv-type) { display: none; }
html.cd-ric .cd-filtri .flabel { margin: 14px 0 6px; font-size: 12.5px; }
html.cd-ric .cd-filtri .choices { gap: 5px; flex-wrap: wrap; }
html.cd-ric .cd-filtri .choice { padding: 5px 10px; font-size: 12.5px; }
html.cd-ric .cd-filtri .toggle { padding: 8px 0; gap: 8px; border: 0; background: none; box-shadow: none; }
html.cd-ric .cd-filtri .toggle .ic { display: none; }
html.cd-ric .cd-filtri .tt small { display: none; }
html.cd-ric .cd-filtri .tt b { font-size: 13px; }
html.cd-ric .cd-filtri .authalt { width: 100%; }
html.cd-ric .cd-filtri .stepper { opacity: 1 !important; transform: none !important; }
