/* Source and licensing information for the line(s) below can be found at https://www.catlante-catamarans.com/themes/custom/catlante/templates/repetitivetheme/custom-catlante.css. */
nav.local-tasks ul.nav-fill{display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}nav.local-tasks ul.nav-fill .nav-item{flex:1 1 auto!important;text-align:center!important}nav.local-tasks ul.nav-tabs li.nav-item a.nav-link{background-color:#f4f4f4;color:#a3a1a1;border-radius:0;border-color:#fff}nav.local-tasks ul.nav-tabs li.nav-item a.nav-link:hover{background-color:#a3a1a1;color:#fff}nav.local-tasks ul.nav-tabs li.nav-item a.active{background-color:#0474b6!important;color:#fff!important}div.region-local-tasks .alert{margin-top:1rem}div.block-local-tasks-block{padding-top:0;margin-top:1rem;margin-bottom:2rem}.page-maintenance{margin-top:50px!important;text-align:center!important}.page-maintenance header,.page-maintenance main{padding:50px!important}#toolbar-administration{z-index:99999;position:relative}.alert-danger,.alert-success{margin-top:75px}.alert.alert-danger{position:relative}.alert.alert-danger button.close{position:absolute;right:1.25rem;top:10px}body.toolbar-icon-9.toolbar-tray-open.toolbar-horizontal.toolbar-fixed.transition-page.user-logged-in .header-white{top:75px}body.toolbar-icon-9.toolbar-tray-open.toolbar-horizontal.toolbar-fixed.transition-page.user-logged-in .header-white+div+main{padding-top:80px}body.toolbar-icon-9.toolbar-tray-open.toolbar-horizontal.toolbar-fixed.transition-page.user-logged-in .header-white+div+main .page-title{margin-top:0}.content-error-404{height:100vh;display:flex;align-items:center;text-align:center}.password-suggestions ul{display:none!important}#block-catlante-annonce,.login-page.path-user .header-top__right .menu .menu-item.se-connect,.login-page.path-user .header-top__right .menu .menu-item:last-child:before{display:none}.select2-results__option--selected{background:#f16846;border-color:#f16846}.select2-results__option--selected.selecteditem{background:transparent!important;border-color:hsla(0,0%,100%,.6)!important}.show-form-actions{display:block!important}.testadd{background:#f16846!important;border-color:#f16846!important}.modal{z-index:10000}.modal-fullscreen{max-width:90%;height:90%;margin:0}.modal-fullscreen .modal-content{height:90vh}.modal-body{overflow-y:auto}.modal-dialog{display:flex;align-items:center;justify-content:center;height:90%}/* Cartes cliquables : .figure-animate-zoom rendu en <a> (ancre = libelle visible). */.figure-animate-zoom{display:block;color:inherit;text-decoration:none}.call-to-action__item .stretched-link{text-decoration:none}.zoom-img a{display:block;height:100%}
.list-items .category a.stretched-link{color:inherit;text-decoration:none}
.list-items .distenation__right .arrow-icon{display:inline-flex;align-items:center}
.list-items .distenation__right .arrow-icon i{background:#003849;padding:12px;border-radius:50%;display:inline-block;transition:.15s all ease}
.list-items .distenation__right .arrow-icon i::before{color:#fff}
.btn-horaire .horaire-link{display:flex;align-items:center;justify-content:center;width:100%;color:inherit;text-decoration:none}
.cruise-for-you__item>a.stretched-link{display:block;color:inherit;text-decoration:none}
a.stretched-link{color:inherit;text-decoration:none}
.idee-croisiere__content-bloc>a.stretched-link{display:block}
/* Couleurs des messages Drupal (alertes Bootstrap). Classes .alert-success/-danger injectees dynamiquement par Drupal (status messages, concat Twig 'alert-'~type) -> invisibles au scan PurgeCSS -> la regle de base .alert{background-color:var(--bs-alert-bg);...} a ete PURGEE de split/core.css (le fichier reellement charge en mode split). On ne peut donc PAS s'appuyer sur les variables --bs-alert-* : on declare les couleurs en dur ici (fichier non purge, charge partout). Palette subtle Bootstrap 5.3. Selecteur .alert.alert-X (0,2,0) pour gagner sur tout reste de .alert{}. */
/* Padding/marge de base de .alert : en prod (hors #modal-annonce) l'espacement du bandeau vient de la regle de base Bootstrap .alert{padding:1rem;margin-bottom:1rem}, qui a ete purgee de core.css (les regles .messages .alert-success{padding:15px} restantes sont scopees #modal-annonce uniquement). Restaure ici, scope .messages. */
.messages .alert{padding:1rem 1rem;margin-bottom:1rem;border-radius:.375rem}
.alert.alert-success{background-color:#d1e7dd;color:#0a3622;border:1px solid #a3cfbb;border-radius:.375rem}
.alert.alert-danger{background-color:#f8d7da;color:#58151c;border:1px solid #f1aeb5;border-radius:.375rem}
.alert.alert-warning{background-color:#fff3cd;color:#664d03;border:1px solid #ffe69c;border-radius:.375rem}
.alert.alert-info{background-color:#cff4fc;color:#055160;border:1px solid #9eeaf9;border-radius:.375rem}
.alert.alert-success a,.alert.alert-danger a,.alert.alert-warning a,.alert.alert-info a{color:inherit;text-decoration:underline}
/* Bouton de fermeture (.btn-close) des messages : la regle .alert-dismissible .btn-close{position:absolute;top:0;right:0} a ete purgee de core.css (classe alert-dismissible absente) -> le X retombait en flux (bas-gauche) au lieu du coin haut-droit. Restaure ici, scope .messages (spec. 0,3,0) pour ne pas affecter les X des modales/popups. */
.messages .alert.alert-dismissible{position:relative;padding-right:3rem}
.messages .alert.alert-dismissible .btn-close{position:absolute;top:0;right:0;left:auto;bottom:auto;z-index:2;width:1em;height:1em;padding:1.25rem 1rem;margin:0;border:0;border-radius:.375rem;background-color:transparent;box-sizing:content-box}
/* Throbber AJAX Drupal injecte au clic sur submit. La classe .ajax-progress est ajoutee en JS -> invisible au scan -> PurgeCSS a retire la regle qui le masquait. Sans elle, le throbber s'insere dans .form-actions (width:min-content), passe a la ligne et fait grandir le pseudo ::before (height:100%) du bouton -> hauteur doublee. On le re-masque ici (hors purge). */
form .form-actions input[type=submit]+div.ajax-progress,form .form-actions .ajax-progress-throbber{display:none}
/* Cases a cocher du formulaire de reservation CDC (cdc_reservation/CDCBookingForm) : privacy_consent + newsletter. HTML rendu (theme base=false -> templates core + form-element--type--checkbox.html.twig) : <div class="...js-form-type-checkbox form-item-NAME..."><input type=checkbox class=form-check-input><label>texte</label></div>. Le wrapper a un style inline display:inline-flex qui ne colle pas case+label sur ce gabarit. On force la disposition, ciblage chirurgical sur les 2 wrappers (classe form-item-NAME generee par core, fiable). !important pour battre le style inline. align-items:flex-start car le label fait plusieurs lignes (case alignee sur la 1re ligne, comme la prod). */
.form-item-privacy-consent,.form-item-newsletter{display:flex!important;align-items:flex-start;gap:.5rem;margin-top:10px}
.form-item-privacy-consent>input[type=checkbox],.form-item-newsletter>input[type=checkbox]{flex:0 0 auto;width:1em;height:1em;margin:.25em 0 0;float:none}
.form-item-privacy-consent>label,.form-item-newsletter>label{flex:1 1 auto;margin:0;padding:0;text-align:left}
/* Lisibilite du titre sur TOUTES les bannieres : le voile par defaut (.banner::after = $overly-gradient-color = linear-gradient 180deg fonce en HAUT seulement, transparent des ~50%) laisse le titre (positionne a top:58%) sur la partie claire des images lumineuses -> illisible. On remplace par un degrade qui assombrit le HAUT (menu) ET le BAS (titre + fil d'Ariane), en gardant le centre lumineux. Charge partout (fichier non purge). */
.banner::after{background:linear-gradient(180deg,rgba(43,44,62,.55) 0%,rgba(43,44,62,.1) 28%,rgba(43,44,62,.4) 62%,rgba(43,44,62,.72) 100%)!important}
.banner .banner--content-title h1,.banner .breadcrumbs-banner .breadcrumbs-item,.banner .breadcrumbs-banner a{text-shadow:0 1px 6px rgba(0,0,0,.5)}
/* Intro du bloc « Nos croisieres » (hub destination) : texte lead plus grand que le corps. */
.hub-croisieres__intro{font-size:20px!important;line-height:1.7}
@media (max-width:767.98px){.hub-croisieres__intro{font-size:17px!important}}
/* Menu mobile : la classe 'open-menu' est ajoutee en JS (menu.js -> toggleClass('open-menu')) au clic sur le burger. Invisible au scan -> PurgeCSS a supprime de core.css les regles qui AFFICHENT le panneau (.open-menu ...mainnav{display:block;position:fixed;background:#fff} + positionnement mobile) -> le burger passait en croix mais le menu restait invisible. Regles restaurees ci-dessous depuis la prod (fichier non purge). */
body.open-menu{overflow:hidden}
.open-menu header .header-navbar__content .mainnav{display:block;margin:0 auto;width:100%;background-color:#fff;z-index:99999;position:fixed;left:0;top:130px;overflow-y:auto;height:calc(100vh - 130px)}
@media (max-width:1199.98px){.open-menu header .header-navbar__content .mainnav{top:100px;height:calc(100vh - 100px);overflow:hidden}}
.open-menu header .header-navbar__content .mainnav .menu{display:block;list-style:none;margin:0;padding:20px 0;position:relative;height:100%;text-align:center;margin:auto;background:#fff}
@media (max-width:1199.98px){.open-menu header .header-navbar__content .mainnav .menu{padding-top:0}}
.open-menu header .header-navbar__content .mainnav .menu .menu-item a::after,.open-menu header .header-navbar__content .mainnav .menu .menu-item span::after{content:none}
.open-menu header .header-navbar__content .mainnav .menu .menu-item .sub-menu{height:auto;border:none;transition:none}
.open-menu header .header-navbar__content .mainnav .menu .menu-item .sub-menu .smenu .item__img{display:none}
.open-menu header .header-navbar__content .mainnav .menu .menu-item .sub-menu__img{display:none}
.open-menu header .header-navbar__content .mainnav .menu .menu-item.mm-active{margin:0;position:relative;cursor:pointer;display:block;padding:0}
.open-menu header .header-navbar__content .mainnav .menu .menu-item.mm-active span{color:#fff}
.open-menu header .header-navbar__content .mainnav .menu .menu-item.mm-active .sub-menu{display:block!important;position:relative;visibility:visible;opacity:1!important;box-shadow:none;padding:0;margin-top:0}
.open-menu header .header-navbar__content .mainnav .menu .menu-item.mm-active .sub-menu .smenu{width:100%;padding:10px 0}
.open-menu header .header-navbar__content .mainnav .menu .menu-item.mm-active .sub-menu .smenu.mm-show .item{width:100%;display:flex;justify-content:center}
.open-menu header .header-navbar__content .mainnav .menu .menu-item.mm-active .sub-menu .smenu.mm-show .item::before{content:none}
.open-menu header.fixed .header-navbar__content .mainnav{top:183px;height:calc(100vh - 183px)}
@media (max-width:1199.98px){.open-menu header.fixed .header-navbar__content .mainnav{top:90px;height:calc(100vh - 90px)}}
/* Offre « Croisiere Mystere » (node 188, type croisieres_successives). Les autres offres ont des retouches CSS par noeud (.node-id-128, .node-id-124...). Ici : empecher l'etirement/rognage des images. .zoom-img a height:100% -> quand le texte du bloc est plus haut que l'image, le conteneur s'etire et l'image parait coupee. On force la hauteur naturelle (image entiere) + alignement haut. Idem pour la grande image brochure (.parallax-bg). Fichier non purge. */
.node-id-188 .inspiration__content-row{align-items:flex-start}
.node-id-188 .inspiration__content-img .zoom-img,.node-id-188 .inspiration__content-img .zoom-img img{height:auto!important}
.node-id-188 .catlante-choisir-bateaux.successives .parallax-bg,.node-id-188 .catlante-choisir-bateaux.successives .parallax-bg img{height:auto!important}
/* Hero mobile : le bloc contenu (.slider__content, absolute top:211px) collait au bouton "Decrire un projet" (.topDemandeCroisiere, bottom ~216px) -> le titre h1 chevauchait le bouton. On decale le contenu vers le bas sur mobile pour degager ~35px. Bouton en position px fixe -> l'ecart reste constant quelle que soit la largeur. Fichier non purge. */
@media (max-width:767.98px){.slider .slider__content{top:250px}}
/* Menu : la petite vague (glyph icomoon \e913) devant les SOUS-ITEMS du mega-menu (.menu-level-2) ne doit jamais s'afficher. MAIS on GARDE le glyph (content) car sa boite reserve la hauteur de ligne (34px) = l'espacement entre sous-items (comme la PROD, ecart ~44px). On force donc juste opacity:0 y compris au survol (la regle .item:hover a:before{opacity:1} revelait la vague). NE PAS vider content ("" -> boite hauteur 0 -> sous-items tasses) ni display:none (-> chevrons categories decales). Prefixe body pour la specificite. Fichier non purge. */
body .header li.menu-item.menu-item--expanded .menu_link_content .menu-level-2 .item a::before{content:"\e913"!important;opacity:0!important}
body .header li.menu-item.menu-item--expanded .menu_link_content .menu-level-2 .item:hover a::before{opacity:0!important}
/* Facade video (bloc "Pourquoi choisir Catlante") : vignette + bouton play affiches tout de suite ; le player Vimeo/Cloudflare (iframe) n'est charge qu'au clic (main.js -> .video-facade). Visuellement equivalent a l'etat "avant clic" du player. Fichier non purge. */
.video-facade{position:relative;display:block;cursor:pointer;width:100%;max-width:265px;aspect-ratio:9/16;margin-left:auto;margin-right:auto;border-radius:20px;overflow:hidden}
.video-facade img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.video-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-facade__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:50%;background:rgba(0,56,73,.85);transition:background .2s ease}
.video-facade__play::before{content:"";position:absolute;top:50%;left:56%;transform:translate(-50%,-50%);border-style:solid;border-width:13px 0 13px 21px;border-color:transparent transparent transparent #fff}
.video-facade:hover .video-facade__play,.video-facade:focus .video-facade__play{background:#f16846}

/* Source and licensing information for the above line(s) can be found at https://www.catlante-catamarans.com/themes/custom/catlante/templates/repetitivetheme/custom-catlante.css. */