@media (max-width: 576px) {
    .ls-hide-xs,
    .ls-hide-sm-smaller,
    .ls-hide-md-smaller,
    .ls-hide-lg-smaller,
    .ls-hide-xl-smaller
    {
        display: none !important;
    }
}

@media (min-width: 576px) and (max-width: 768px) {
    .ls-hide-sm,
    .ls-hide-md-smaller,
    .ls-hide-lg-smaller,
    .ls-hide-xl-smaller,
    .ls-hide-xs-bigger
    {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 992px) {
    .ls-hide-md,
    .ls-hide-lg-smaller,
    .ls-hide-xl-smaller,
    .ls-hide-xs-bigger,
    .ls-hide-sm-bigger
    {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .ls-hide-lg,
    .ls-hide-xl-smaller,
    .ls-hide-xs-bigger,
    .ls-hide-sm-bigger,
    .ls-hide-md-bigger
    {
        display: none !important;
    }
}

@media (min-width: 1200px){
    .ls-hide-xl,
    .ls-hide-xs-bigger,
    .ls-hide-sm-bigger,
    .ls-hide-md-bigger,
    .ls-hide-lg-bigger
    {
        display: none !important;
    }
}


.popover {
    max-width: min(50rem, 90%)!important;
}

[class^="ls-opac-icon-"], [class*=" ls-opac-icon-"]::before {
    text-align: center;
    vertical-align: middle;
}

#jaklcp-chat-container{
    right: 70px !important;
    z-index: 1000!important;
}

.scrollup{
    right: 10px;
    bottom: 12px;
    height: 63px!important;
    width: 63px!important;
    opacity:1;
    position:fixed;
    display:none;
    z-index: 1000;
}

/*orejime boite*/
.orejime-Notice{
    background-color: #fefefe;
    font-size: var(--md-font-size-base);
    position: fixed;
    bottom: 1rem;
    left: 1rem;
    width: 90%;
    max-width: 800px;
    padding: 1rem;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    z-index: 1000;
    border-left: 4px solid  var(--lsOpac-admin-background);
}

.orejime-Notice-description{
    color: #666;
}

/*orejime bouton accepter*/
.orejime-Button--save, .orejime-Button--accept{
    padding: var(--md-spacing-xs) var(--md-spacing-md);
    border-radius: var(--md-border-radius);
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: var(--md-spacing-xs);
    transition: all var(--md-transition-speed);
    border: none;
    cursor: pointer;
    font-size: var(--md-font-size-base);
    border: 2px solid var(--md-button-primary-color);
    background-color: var(--md-button-primary-color);
    color: var(--md-button-primary-text-color);
}

.orejime-Button--save:hover, .orejime-Button--accept:hover {
    background-color: var(--md-button-primary-darker);
}

/*orejime bouton refuser*/
.orejime-Button--decline{
    padding: var(--md-spacing-xs) var(--md-spacing-md);
    border-radius: var(--md-border-radius);
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: var(--md-spacing-xs);
    transition: all var(--md-transition-speed);
    border-style: solid;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: transparent;
    color: var(--md-button-primary-color);
    border: 2px solid var(--md-button-primary-color);
}

.orejime-Button--decline:hover {
    color: var(--md-button-primary-darker);
    border: 2px solid var(--md-button-primary-darker);
}

/*orejime bouton en savoir plus*/
.orejime-Button--info{
    background-color: transparent;
    border: 2px solid var(--md-link-secondary-color);
    color: var(--md-link-secondary-color);
    cursor: pointer;
}

.orejime-Button--info:hover{
    color: var(--md-link-secondary-colorover);
}

@media (min-width: 990px) {
    .orejime-Notice {
        max-width: 40%;
    }
}

/* orejime modal */
.orejime-Modal {
    background-color: #fefefe;
    color: #0c0c0c;
}

.orejime-Modal .orejime-Button--info{
    padding: var(--md-spacing-xs) var(--md-spacing-md);
    border-radius: var(--md-border-radius);
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: var(--md-spacing-xs);
    transition: all var(--md-transition-speed);
    border-style: solid;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: transparent;
    color: var(--md-button-primary-color);
    border: 2px solid var(--md-button-primary-color);
}

.orejime-Modal .orejime-Button--info:hover {
    color: var(--md-button-primary-darker);
    border: 2px solid var(--md-button-primary-darker);
}

.orejime-AppItem-input:checked + .orejime-AppItem-label .orejime-AppItem-slider {
    background-color: var(--lsOpac-active-button-bg);
}

/* overrride mega menu */
.mm-page { 
    display: flex;
    flex: 1;
}

#menu.ls-flex {
    display: flex;
}

[class^="ls-opac-icon-"], [class*=" ls-opac-icon-"] {
    line-height: unset;
}


/* custom scrollbar */
::-webkit-scrollbar {
    width: 1rem;
}

::-webkit-scrollbar-thumb {
    background-color: var(--lsOpac-tags-bg);
    border-radius: 1rem;
    border: 0.25rem solid transparent;
    background-clip: content-box;
}


::-webkit-scrollbar-track {
    background: transparent;
}

#ls-page-wrapper:not(.ls-scrolled)::-webkit-scrollbar-button:vertical:start {
    display: block;
    height: var(--ls-bx-info-bar-height);
}

#ls-page-wrapper:not(.ls-scrolled)::-webkit-scrollbar-button:vertical:start:decrement {
    display: none;
}


#ls-page-wrapper {
    scrollbar-color: var(--lsOpac-tags-bg) transparent;
    scrollbar-width: thin;
}

.ls-notif-dot {
    width: 10px;
    height: 10px;
    background-color: red;
    border-radius: 50%; /* rend le cercle rond */
    animation: fadeInOut 1.8s ease-in-out infinite alternate;
}
/* fade-out puis fade-in (aller-retour) */
@keyframes fadeInOut{
    from { opacity: 1; }
    to   { opacity: 0.35; }
}

body .modal-backdrop {
    background-color: var(--ls-high-contrast-page);
}

@-moz-document url-prefix() {
    /* correction du problème d'image à hauteur 100% dans des conteneurs flex su firefox, solution en attente d'une meilleure proposition */
    .ls-main-logo-wrapper {
        display: contents;
    }

    .ls-main-logo-link {
        display: contents;
    }
}

/* label override */
label {
    margin-bottom: 0rem;
}

.search-api-autocomplete-suggestion {
    padding: 1rem;
    max-width: 100%;
}

.ls-bx-override-autocomplete {
    width: var(--ls-width-autocomplete) !important;
    left: var(--ls-left-autocomplete) !important;
    top: var(--ls-top-autocomplete) !important;
    z-index: 1000;
    max-height: 50%;
    overflow: auto;
}

body.toolbar-fixed .toolbar-oriented .toolbar-bar#toolbar-bar {
    position: initial;
}

ul{
    margin-block-start: 0rem;
    margin-block-end: 0rem;
}

.popover-body p {
    margin: 0;
}

#mm-0 {
    display: contents;
}

.popover{
    pointer-events: none;
}


.responsive-menu-toggle-icon span.label {
  color: var(--md-primary-text-color);
}

.responsive-menu-toggle-icon:before,
.responsive-menu-toggle-icon:after,
.responsive-menu-toggle-icon span.icon {
  background: var(--md-primary-text-color);
}

.mm-menu_opened{
  z-index: 1002;
}

.responsive-menu-toggle-icon::before, .responsive-menu-toggle-icon::after, .responsive-menu-toggle-icon span.icon{
  display: flex;
  align-items: center;
  justify-content: center;
}

.responsive-menu-toggle-icon span.label{
  height: 100%;
  margin-left: 40px;
  display: flex;
  align-items: center;
  position:unset;
}