@charset "utf-8";

/*  ==========================================================================
    Feuille de style pour impression
    ========================================================================== */

@media print {
    html, body {
        font-size: 14px;
    }
    
    #bandeau-ville,
    .menu-principal,
    section.suggestion-activites,
    #mobile-menu-btn,
    #footer-logos,
    footer nav,
    .btn,
    .btn-ajout-favoris,
    .autres-activites,
    .image-vedette figcaption,
    .item.annule,
    .section-lieu-info-liens,
    .page-accueil.header-banner .container .header-img,
    .page-lieu .section-activites,
    .page-recherche .search-form,
    .nav-alphabet {
        display: none;
    }
    .item.annule {
        display: none !important;
    }
    .header-banner.vert.page-accueil {
        padding-bottom: 0;
    }
    
    .grille-date,
    .section-contenu,
    .my-activities-shortcut.is-ajoute,
    .section-lieu,
    .section-accessibilite,
    .encadre-message-annulation,
    .encadre-meteo,
    .page-accueil h2,
    .flickity-button,
    #slider-en-vedette .carousel-cell {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    
    header,
    .header-banner.jaune,
    .header-banner.vert,
    .header-banner.rose,
    .form-select,
    .filtres,
    footer,
    footer #footer-copyright {
        background: transparent;
        
    }
    .remove-from-my-activities,
    .my-activities-shortcut:not(.is-ajoute) {
        visibility: hidden;
    }
    .section-contenu,
    .section-representations,
    .section-lieu-info,
    .section-lieu-carte,
    .a11y-groupe,
    .a11y-intro,
    .activites-a-venir,
    .page-accueil .section.expositions {
        break-inside: avoid;
    }
    .a11y-intro {
        page-break-before: avoid;
    }
    
    .page-accueil #flex-expositions { display: block; }
    .page-accueil #slider-expositions { display: none; }
    .page-accueil #slider-en-vedette .carousel-cell {
        width: 100%;
        display: grid;
        grid-template-columns: 1.15fr .85fr;
        gap: 2.5rem;
        min-height: auto;
    }
    .page-accueil  #slider-en-vedette .carousel-img {
        max-width: 30rem;
    }
    .page-accueil .carousel.wrap-around {
        margin-bottom: 0;
    }
    .page-accueil.header-banner .container {
        grid-template-rows: auto;
        grid-template-columns: 1fr;
        grid-template-areas: "logo";
    }
    .page-accueil.header-banner .container .logo-quebec-animee {
        margin-left: 1rem;
        width: 12rem;
    }
    .page-accueil .umb-block-grid {
        display: none;
    }
    .page-accueil #slider-en-vedette .carousel-description, .page-accueil #slider-en-vedette .carousel-savoirplus {
        display: block;
    }
    #slider-en-vedette  {
        margin-left: 0;
    }
    main {
        margin-top: 1rem;
        margin-bottom: 1rem;
        padding: 1rem;
    }
    main.page-accueil {
        margin-top: 0;
        padding-top: 0;
    }
    main.page-activite h1, main.page-lieu h1 {
        font-size: 30px;
    }
    main.page-activite .section-contenu {
        margin-top: 0;
    }
    
    .header-banner {
        height: auto !important;
    }
    
    .header-banner .container .logo-quebec-animee {
        place-self: end start;
        margin-bottom: 1rem;
        width: 12rem;
    }
    @media (min-width: 57.25rem) {
        .header-banner.page-activite .container .logo-quebec-animee {
            place-self: end end;
        }
    }
    .image-vedette {
        margin-top: -4.25rem;
        max-width: 300px;
    }
    @media (min-width: 57.25rem) {
        .image-vedette {
            margin-top: -10.7rem;
            max-width: none;
        }
    }
    
    .header-banner .container {
        padding: 0 0 0 1rem;
    }
    @media (max-width: 47.9375rem) {
        .header-banner .container h1 {
            background-color: transparent;
            color: black;
        }
    }
    .grille-date {
        font-size: inherit;
    }
    @media (min-width: 26.9375rem) {
        .items .item {
            flex-basis: calc(33.333333% - 1.168rem);
            break-inside: avoid;
        }
    }
    
    
    .encadre-message-annulation,
    .encadre-meteo {
        color: black;
    }
    
    .section-lieu {
        margin-top: 1rem;
    }
    .section-lieu-info {
        padding-top: 1rem;
        padding-bottom: 0rem;
    }
    #map {
        height: 15rem;
        border-top-left-radius: var(--radius);
        border-top-right-radius: var(--radius);
        border-bottom-right-radius: 0;
    }
    .a11y-titre {
        padding-top: 1rem;
    }
    .a11y-reponse {
        padding-bottom: 1rem;
    }
    
    .section-representations {
        margin-top: 2.1875rem;
    }
    
    .liste-representations li {
        grid-template-columns: .75fr 1fr 1fr;
        grid-template-areas: "rep-date rep-heure rep-lieu";
    }
    .section-separateur {
        border-top: none;
        margin-top: 1rem;
        padding-top: 1rem;
    }
    
    #logo-vdq {
        background-image: url(/media/odbb2m4x/logo-ville-quebec-accent-noir.svg) !important;
    }
    .form-select {
        border: none;
        padding: 0;
    }
    .filtres {
        border-bottom: 1px solid var(--gris);
    }
    .tiroir-toggle {
        display: none;
    }
    .tiroir {
        max-height: none;
    }
    
    footer #footer-copyright {
        color: black;
    }
    
    
 
    .filtres-form {
        gap: .75rem 10px;
        grid-template-columns: auto auto min-content min-content min-content;
        grid-template-areas: 
            "filtreTitreDate filtreTitreLieu filtreTitreLieu filtreTitreCategorie filtreTitrePrix"
            "filtre-dates filtre-localisation filtre-localisation filtre-categorie filtre-prix"
            "btns-container btns-container . btnReset btnReset";
        justify-content: space-between;
    }



      
      img { width:100%; }
      
}