.colorreverse{
    filter: invert(1);
}
.payment-option {
    border: 1px solid #ccc;
    transition: all 0.3s ease;
}
.payment-option.active {
    border: 2px solid #28a745; /* vert */
    background-color: #246555; /* vert clair */
    color: #fff; /* texte blanc */
}
*{
    letter-spacing: 1px;
    outline: none !important;
    font-family:'poppins';
}
.fontfamillyheader{
    font-family: 'Belleza';
}
body,html,#goo-map{
    width: 100%;
    height: 100%;
}
body{
}
body.no-scroll {
  overflow: hidden;   /* disables scrolling */
  height: 100vh;      /* ensures body doesn’t extend */
}
#preloadFrame {
  position: fixed;
  top: 0; left: 0;
  bottom: 0; right: 0;

  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

#preloadFrame.active {
  opacity: 1;
  visibility: visible;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0 !important;
    font-family: 'Belleza';
}

h1 span{
    font-family: 'Belleza';
}h2 span{
    font-family: 'Belleza';
}
.headertext{
    font-size: clamp(35px, 8.5vw, 70px);
    font-family: 'Belleza';
}

h1 {
  font-size: clamp(1.75rem, 2.5vw + 1rem, 3rem);
  line-height: 1.2;
}

h2 {
  font-size: clamp(1.5rem, 2vw + 0.5rem, 2.25rem);
  line-height: 1.25;
}

h3 {
  font-size: clamp(1.25rem, 1.5vw + 0.5rem, 2rem);
  line-height: 1.3;
}

h4 {
  font-size: clamp(1.125rem, 1.25vw + 0.25rem, 1.25rem);
  line-height: 1.35;
}

h5 {
  font-size: clamp(1rem, 1vw + 0.25rem, 1.20rem);
  line-height: 1.4;
}

h6 {
  font-size: clamp(0.875rem, 0.75vw + 0.25rem, 1.15rem);
  line-height: 1.45;
}

p {
    font-size: clamp(1rem, 0.9vw + 0.5rem, 1.02rem);
    line-height: 1.6;
    margin:0;
    padding:0;
    color:#707070;
}
.first-letter-cap::first-letter {
  text-transform: uppercase;
}

small{
  font-size: clamp(0.875rem, 0.75vw + 0.25rem, 1rem);
  line-height: 1.4;
}

.caption {
  font-size: clamp(0.75rem, 0.5vw + 0.25rem, 0.875rem);
  line-height: 1.3;
}
span{
    margin:0;
    padding:0;
}
ul{
    list-style-type: none;
}
ol, ul {
    padding-left: 0rem !important;
    font-size: clamp(1rem, 0.9vw + 0.5rem, 1.25rem);
}
a{
    color: inherit;
    text-decoration: none;
}
a span{
    color: inherit;
    text-decoration: none;
}
a:hover{
    color: inherit;
}
a:hover i{
    cursor:pointer
}
.row{
    margin: 0 !important;
    padding-right: 0 ;
    padding-left: 0 ;
}
form{
    outline: none !important;
}
img{
    margin: 0;
    padding: 0;
}
section{
    margin: 0% 0% 0% 0%;
    padding: 05% 0% 0% 0%;
}
.primaryColor{
    color:#fafafa}
.secondColor{
    color:#000000}
.thirdColor{
    color:#246555}
.fourthColor{
    color:#F2FC8F}
.fifthColor{
    color:#E3CC0F}
.sixthColor{
    color:#976951}
.seventhColor{
    color:#FCDDCB}
.eighthColor{
    color:#FAF0E0}
.nineColor{
    color:#A73725}
.tenthColor{
    color:#707070}
.eleventhColor{
    color:#8261FA}

.primaryBgColor{
    background-color:#fafafa}
.secondBgColor{
    background-color:#000000}
.thirdBgColor{
    background-color:#246555}
.fourthBgColor{
    background-color:#F2FC8F}
.fifthBgColor{
    background-color:#E3CC0F}
.sixthBgColor{
    background-color:#976951}
.seventhBgColor{
    background-color:#FCDDCB}
.eighthBgColor{
    background-color:#FAF0E0}
.nineBgColor{
    background-color:#A73725}
.tenthBgColor{
    background-color:#707070}
.eleventhBgColor{
    background-color:#8261FA}
@keyframes moving-left-tight-sixthColor{
    0% {
        transform: translateX(0px) translateY(0px);
    }
    40% {
        transform: translateX(100px) translateY(-200px);
    }
    75% {
        transform: translateX(-500px);
    }
    100% {
        transform: translateY(0px) translateX(0px);
    }
}
.Box{
    width:40px;
    height:40px;
}
.Box50{
    width:50px;
    height:50px;
}
.Box70{
    width:70px;
    height:70px;
}
.Box90{
    width:90px;
    height:90px;
}
.Box100{
    width:100px;
    height:100px;
}
.Box150{
    width:150px !important;
    height:150px !important;
}
.Box200{
    width:200px;
    height:200px;
}
.Box250{
    width:250px;
    height:250px;
}
.Box10030{
    width:100px;
    height:50px;
}
.borderradius10px{
    border-radius:10px
}
.borderradius5px{
    border-radius:5px
}
.h-xl-100{
    height:100%
}
.btnshapeprimaryColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#fafafa;
    color:#000000;
    border-radius: 5px;
}
.btnshapeprimaryColor:hover{
    background-color:#E3CC0F;
    color:#fafafa !important;
}

.btnshapesecondColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#000000;
    color:#fafafa;
    border-radius: 5px;
}
.btnshapesecondColor:hover{
    background-color:#A73725;
    color:#fafafa !important;
}

.btnshapethirdColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#246555;
    color:#fafafa;
    border-radius: 5px;
}
.btnshapethirdColor:hover{
    background-color:#E3CC0F;
    color:#000000 !important;
}
.btnshapefourthColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#F2FC8F;
    color:#000000;
    border-radius: 5px;
}
.btnshapefourthColor:hover{
    background-color:#E3CC0F;
    color:#000000 !important;
}
.btnshapefifthColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#E3CC0F;
    color:#000000;
    border-radius: 5px;
}
.btnshapefifthColor:hover{
    background-color:#F2FC8F;
    color:#000000 !important;
}
.btnshapeseventhColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#FCDDCB;
    color:#000000;
    border-radius: 5px;
}
.btnshapeseventhColor:hover{
    background-color:#F2FC8F;
    color:#000000 !important;
}
.btnshapeeighthColor{
    text-transform:uppercase;
    display: inline-block;
    text-align: center;
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 10px;
    background-color:#FCDDCB;
    color:#000000;
    border-radius: 5px;
}
.btnshapeeighthColor:hover{
    background-color:#F2FC8F;
    color:#000000 !important;
}

.cardhover:hover{
    background-color:#976951;
    color:#fafafa;
    -webkit-appearance: none;
    -webkit-box-shadow: 0px 0px 10px rgb(223 223 223) !important;
    -moz-box-shadow: 0px 0px 10px rgb(223 223 223) !important;
    box-shadow: 0px 0px 10px rgb(223 223 223) !important;
}
.btnfont{
    font-size: clamp(13px, 0.9vw, 16px);
    padding: 15px 20px;
}
.card{
    padding:10px 8px;
    border:0px
}
.card:hover{
    background-color:#976951;
    -webkit-appearance: none;
}
.card:hover *{
    font-weight:bold;
}
.border0_1px{
    border: 0.1px solid;
}
.border1px{
    border: 1px solid;
}
.border0_5px{
    border: 0.5px solid;
}
.border2px{
    border: 2px solid;
}
.borderCorlorprimaryColor{
    border-color:#fafafa}
.borderCorlorsecondColor{
    border-color:#000000}
.borderCorlorthirdColor{
    border-color:#246555}
.borderCorlorfourthColor{
    border-color:#F2FC8F}
.borderCorlorfifthColor{
    border-color:#E3CC0F}
.borderCorlorsixthColor{
    border-color:#976951}
.borderCorloreighthColor{
    border-color:#FCDDCB}
.borderCorlornineColor{
    border-color:#A73725}
.borderCorlortenthColor{
    border-color: #dfdfdf
}
.marginstartnegative10{
    margin-left:-10%
}
.marginendnegative10{
    margin-right:-10%
}

.margintopnegative10{
    margin-top:-10%
}
.margintopnegative15{
    margin-top:-15%
}
.marginbottomnegative10{
    margin-bottom:-10%
}
.marginstartnegative5{
    margin-left:-5%
}
.marginbottomnegative5{
    margin-bottom:-5%
}
.margintopnegative5{
    margin-top:-5%
}
.marginendnegative25{
    margin-right:-25%
}
.marginstartnegative25{
    margin-left:-25%
}
.margintopnegative25{
    margin-top:-25%
}
.margintopnegative20{
    margin-top:-20%
}
.margintopnegative46{
    margin-top:-46%
}
.margintopnegative100{
    margin-top:-100%
}
.paddingbottom5{
    padding-bottom:5%
}
.paddingtop5{
    padding-top:5%
}
.paddingtop6{
    padding-top:6%
}
.paddingtop10{
    padding-top:10%
}
.paddingbottom10{
    padding-bottom:10%
}
.paddingtop15{
    padding-top:15%
}
.paddingbottom15{
    padding-bottom:15%
}
.transformleft{
    transform: rotate(350deg);
}
.transformright{
        transform: rotate(375deg);
}
.cursor_pointer{
    cursor:pointer
}
.borderbottom{
    border-style:solid;
    border-left:0px;
    border-right:0px;
    border-top:0px;
}
.borderright{
    border-style:solid;
    border-left:0px;
    border-bottom:0px;
    border-top:0px;
}
.borderleft{
    border-style:solid;
    border-right:0px;
    border-bottom:0px;
    border-top:0px;
}
.secondcolor_Box_Shadow_0_3_6 {
    -webkit-appearance: none;
    -webkit-box-shadow: 0px 3px 6px #000000 !important;
    -moz-box-shadow: 0px 3px 6px #000000 !important;
    box-shadow: 0px 3px 6px #000000 !important;
}

.bgImageSetCenter{
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
.bgImageSetTop{
    background-repeat:no-repeat;
    background-position:top;
    background-size:cover;
}
.bgImageSetCenterContain{
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
}
.bgImageSetCenter100{
    background-repeat:no-repeat;
    background-position:center;
    background-size:100%;
}

.polygonLeft{
    width: 50%;
    clip-path: polygon(0 0, 67% 0, 100% 100%, 0 100%);
}
.polygonRight{
    width: 65%; 
    clip-path: polygon(0 0, 100% 0, 100% 100%, 26% 100%);
    margin-left: -15%;
}
.h-0{
    height:0
}
.h100vh{
    height:100vh;
}
.numbertext{
    font-size: clamp(45px, 1.5vw, 65px);
}
@media (max-width:640px) {
    .polygonRight{
        display: block;
        width: 100%;clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    } 
    .h-50{
        height: initial !important;
    }
    .h-0-initial{
        height:initial !important;
    }
}
@media (max-width:1024px) {
        .h100vh{
        height:70vh;
    }
}
.top-20{
    top:20% !important;
}
.start-90{
    left:90% !important;
}
.separatorline1px{
    height:1px;
}
.separatorline2px{
    height:2px;
}
.separatorline3px{
    height:3px;
}
.separatorline4px{
    height:4px;
}
.separatorline5px{
    height:5px;
}
.roundBox{
    border-radius:100px;
    width:40px;
    height:40px
}
.roundBox70{
    border-radius:100px;
    width:70px;
    height:70px
}


.marquee{--gap: 1em;--speed: 10s;display:flex;flex-direction:column;position:relative;width:100%}
.marquee__row{display:flex;flex-direction:row;flex-shrink:0;animation:marqueeMoveX var(--speed) linear infinite;will-change:transform;backface-visibility:hidden;transform-style:preserve-3d}
.marquee__row__pause:hover{animation-play-state:paused}
.marquee[data-direction=right]
.marquee__row{animation-direction:reverse}
.marquee[data-direction=left]
.marquee__row{animation-direction:normal}
.marquee__row__item{display:flex;align-items:center;flex-shrink:0;min-width:fit-content}
.marquee__row__item__text{display:flex;align-items:center;flex-shrink:0;}
@keyframes marqueeMoveX{from{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}
@supports (-webkit-overflow-scrolling: touch){.marquee__row{-webkit-transform:translate3d(0,0,0)}}
.masked-element{--_mask-start-percentage: 10%;--_mask-end-percentage: 10%;--_mask-direction: 90deg;overflow:hidden;--_linear-gradient: linear-gradient( var(--_mask-direction), transparent, white calc(var(--_mask-start-percentage) * .5), white calc(100% - var(--_mask-end-percentage) * .5), transparent );-webkit-mask:var(--_linear-gradient);mask:var(--_linear-gradient);width:100%;height:auto;background-color:transparent;transition:-webkit-mask .3s ease,mask .3s ease}
.MoveUpDownanimation{
    animation: MoveUpDown 1s linear infinite;
    position: absolute;
    bottom: 5%;
}
@keyframes MoveUpDown {
  0%, 100% {
    bottom: 5%;
  }
  50% {
    bottom: 10%;
  }
}
.btnshapefillbackgroundsecondary{
    text-transform: uppercase;
    padding: 25px 3.1em;
    display: inline-block;
    text-align: center;
    background-color:#976951;
    border: 5px solid #976951;
    color:#fafafa;
    font-weight:bold;
    text-transform:uppercase;
}
.btnshapefillbackgroundsecondary:hover{
    background-color:#A73725;
    border: 5px solid #A73725;
    color:#fafafa;
    -webkit-appearance: none;
    -webkit-box-shadow: 0px 0px 10px #A73725 !important;

}
.accordion-item{
    border-width: initial;
    border: 0px !important;
    border-bottom: 1px;
    padding:0px;
    outline:none !important;
    background-color:transparent !important;
}
.accordion-button:not(.collapsed) {
    color: #000;
    background-color: rgba(255, 255, 255, 0) !important;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
    outline:none !important;
}
.accordion-header{
    outline:none !important;
}
.accordion-button{
    background-color:transparent !important;
    outline:none !important;
}
.showElementOnHover:hover .ElementToShow{
    display:block;
}
.showElementOnHover:hover .zoomBackgroundOnHover{
    background-size: 110%;/* End state (fully visible) */
    animation: zoomBackground .5s ;
}
.showElementOnHover:hover .ElementToHide{
    display:none;
}
.ElementToHide{
    display:block;
}
.ElementToShow{
    display:none;
}
.ElementToShow:hover .transitionease03s{
    display:block;
    height:initial;
}
@keyframes zoomBackground {
  0% {
    background-size: 100%;/* Initial state */
  }
  100% {
    background-size: 110%;/* End state (fully visible) */
  }
}

@keyframes fadeInAnimation {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@keyframes inversefadeInAnimation {
  0% {
    opacity:1;
  }
  100% {
    opacity:0;
  }
}
@keyframes fadeInHeightAnimation {
  0%{
    width:0%;
  }
  100% {
    width:100%;
  }
}
.activatefadeInHeightAnimation{
    -webkit-animation-name: fadeInHeightAnimation;
    animation-name: fadeInHeightAnimation;
    animation-duration:0.8s;
}
.activateFadeInAnimation{
    -webkit-animation-name: fadeInAnimation;
    animation-name: fadeInAnimation;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    visibility: visible !important;
}
.removeFadeInAnimation{
    -webkit-animation-name: inversefadeInAnimation;
    animation-name: inversefadeInAnimation;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    visibility: collaspe !important;
}
.offcanvas-backdrop.show{
    z-index:1000000 !important;
}

.slick-slide{
    opacity: 1;
    transition: opacity 800ms cubic-bezier(0.165, 0.84, 0.44, 1), transform 800ms cubic-bezier(0.165, 0.84, 0.44, 1);
    transform: scaleX(1);
    transform: scaleY(.85);
    outline: none;
    border: none;
}
.slick-initialized.slick-slide {
    display: block;
}
.slick-slide.slick-center{
    opacity: initial ;
    transform: scale(1);
    z-index: -100;
    cursor: -webkit-grab;
}
.slick-track {
    cursor: grab;
}
.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

input,select,textarea{
  background-color: #f9f9f900; /* exemple de couleur */
  color:#707070;
  padding: 20px 10px;
  border-radius:5px;
}

/* Chrome, Safari, Edge */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.input-group .btn {
  z-index: unset !important;
}

/* box shadow formating*/
.box_shadow_0_0_6_black{
    -webkit-appearance: none;

    -webkit-box-shadow: 0px 0px 6px #838b86ae !important;
    -moz-box-shadow: 0px 0px 6px #838b86ae !important;
    box-shadow: 0px 0px 6px #838b86ae !important;
}
.box_shadow_0_3_6_black{
    -webkit-appearance: none;

    -webkit-box-shadow: 0px 3px 6px #838b86ae !important;
    -moz-box-shadow: 0px 3px 6px #838b86ae !important;
    box-shadow: 0px 3px 6px #838b86ae !important;
}
.box_shadow_0_0_26_black{
    -webkit-appearance: none;

    -webkit-box-shadow: 0px 0px 26px #838b86ae !important;
    -moz-box-shadow: 0px 0px 26px #838b86ae !important;
    box-shadow: 0px 0px 26px #838b86ae !important;
}
.box_shadow_6_7_10_black{
    -webkit-appearance: none;

    -webkit-box-shadow: 6px 7px 10px #838b86ae !important;
    -moz-box-shadow: 6px 7px 10px #838b86ae !important;
    box-shadow: 6px 7px 10px #838b86ae !important;
}
.box_shadow_8_8_15_black{
    -webkit-appearance: none;

    -webkit-box-shadow: 8px 8px 15px #838b86ae !important;
    -moz-box-shadow: 8px 8px 15px #838b86ae !important;
    box-shadow: 8px 8px 15px #838b86ae !important;
}
.box_shadow_0_0_10_black{
    -webkit-appearance: none;

    -webkit-box-shadow: 0px 0px 10px #838b86ae !important;
    -moz-box-shadow: 0px 0px 10px #838b86ae !important;
    box-shadow: 0px 0px 10px #838b86ae !important;
}
.box_shadow_0_0_10_green{
    -webkit-appearance: none;

    -webkit-box-shadow: 0px 0px 10px #246555 !important;
    -moz-box-shadow: 0px 0px 10px #246555 !important;
    box-shadow: 0px 0px 10px #246555 !important;
}
.box_shadow_0_0_10_oranhge{
    -webkit-appearance: none;

    -webkit-box-shadow: 0px 0px 10px #000000 !important;
    -moz-box-shadow: 0px 0px 10px #000000 !important;
    box-shadow: 0px 0px 10px #000000 !important;
}

/* tracting formating*/
.tracking{
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*tracking_successfull formating*/
.tracking_successfull{
    background-color: #246555;
    box-shadow: 0 0 10 #246555;
}
.tracking_successfull_text, .tracking_rejected_text{
    font-weight:bold;
}
.tracking_successfull_icon, .tracking_processing_icon{
    color: #fff;
}

/*tracking_processing formating*/
.tracking_processing{
    background-color: #E3CC0F;
    box-shadow: 0 0 10 #000000;
}

/*tracking_pending*/
.tracking_pending{
    background-color: #fff;
    box-shadow: 0 0 10 #838B86;
}
.tracking_pending_icon{
    color: #000000;
}
.tracking_pending_text{
    color: #000;
}

/*tracking_rejected*/
.tracking_rejected{
    background-color: #D53C51;
    box-shadow: 0 0 10 #838B86;
}
.tracking_rejected_icon{
    color: #fff;
}

/*Opacity*/
.opacity_20{
    opacity: .20;
}
.opacity_60{
    opacity: .50;
}
/*padding*/
.padding_20{
    padding: 15%;
}
.padding_30{
    padding: 25%;
}
.border_radius_100{
    border-radius: 100%;
}
.w_75px_h_75px{
    width: 50px;
    height: 50px;
}
.w_40px_h_40px{
    width: 30px;
    height: 30px;
}
.background_color_orange{
    background-color: #000000;
}
.h_2px{
    height: 10px;
}
.mt_5{
    margin-top: 5%
}
.mt_4{
    margin-top: 4%
}
.background_color_green{
    background-color: #246555;
}
.play-overlay i {
  transition: transform 0.3s ease;
}
.play-overlay:hover i {
  transform: scale(1.5) !important;
  color: #246555 !important; /* léger changement de couleur */
}
.highlight-update {
  animation: fadeHighlight 0.8s ease-in-out;
}

@keyframes fadeHighlight {
  from { background-color: #d4edda; }
  to { background-color: transparent; }
}

.fade-out {
  animation: fadeOut 0.4s ease forwards;
}

@keyframes fadeOut {
  from { opacity: 1; }
  to { opacity: 0; transform: scale(0.95); height: 0; margin: 0; padding: 0; }
}
#loadingarticle {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(255,255,255,0.9);
    z-index: 9999;
    display: flex; /* caché par défaut */
    align-items: center;
    justify-content: center;
     transition: transform 0.8s ease, opacity 0.8s ease;
}

.fade-in {
    animation: fadeIn 0.5s forwards;
}

.fade-out {
    animation: fadeOut 0.5s forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to   { opacity: 0; }
}

.flying-img {
    border-radius: 5px;
    pointer-events: none;
}
.zoom-out {
    transform: scale(1.5);
    opacity: 0;
}
.updown {
  display: inline-block;
  animation: upDown 1.5s ease-in-out infinite;
}

@keyframes upDown {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-10px); } /* monte */
  100% { transform: translateY(0); }     /* redescend */
}

.delivery-label {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    position: relative;
    padding: 6px 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    margin-bottom: 6px;
    transition: all 0.3s ease;
}

/* Icône check cachée par défaut */


/* Quand le radio est sélectionné */
input[type="radio"]:checked + .delivery-label {
    border-color: #28a745;
    background-color: #e6ffe6;
}

/* Animation de l’icône check */
input[type="radio"]:checked + .delivery-label::after {
    opacity: 1;
    transform: scale(1);
}

/* Bouton info */
.info-btn {
    margin-left: 8px;
    color: #0d6efd;
    cursor: pointer;
}