#selfAd_DescriptionView {
    width: 100%;
    height: 100%;
    min-height: 80px;
    display: flex;
    flex-wrap: wrap;
    padding: 1rem;
    padding-bottom: 1.35rem;
    outline: none;
    font-family: inherit;
}

.selfAdStandardBorder {
    border-radius: 20px;
    overflow: hidden;
}

#descPreview {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    overflow: visible;
}

.descriptionFull.show {
    display: -webkit-box !important;
}

.description {
    margin-top: 7px;
}

.PubNeomediaBigBlockData .description {
    display: -webkit-box;
    font-size: 16px;
    padding-bottom: 20px;
    word-break: break-word;
}
.SelfAdDescWebkitClamp {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}
.PubNeomediaBigBlock {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    margin-bottom: 30px;
    overflow: hidden;
    width: 100%;
    background-color: #fff;
}

.PubNeomediaBigBlockData {
    position: relative;
    width: 100%;
    padding: 5px;
}
.PubNeomediaBigBlock .userData {
    display: flex;
    flex-wrap: wrap;
}

.pastilleCompagnie {
    margin-right: 10px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.picker-zone {
    display: flex !important;
    width: 100%;
    font-size: 18px;
    gap: 10px;
    margin-top: 10px;
    align-items: center;
    height: 60px;
}

.fa-paintbrush:before {
    content: "\f53f";
}

.emojiPicker, .backgroundPicker {
    display: none;
    justify-content: end;
    width: 100%;
    position: relative;
}



.annonce-tool-button {
    height: 35px;
    margin-bottom: 0;
    margin-top: 15px;
}
.annonce-tool-file-input-label {
    position: relative;
    display: flex;
    border-radius: 25px;
    text-decoration: none !important;
    font-size: 18px;
    color: inherit !important;
    cursor: pointer;
}

.emojiPickerIcon {
    position: absolute;
    right: 10px;
    font-size: 18px;
}

.backgroundPickerIcon {
    position: absolute;
    left: 10px;
    font-size: 18px;
}

.selfad-FormDateFields-wrapper>* {
    flex-basis: 320px;
    max-width: 48%;
}

.tbCalendrier {
    outline: none;
    font-size: 16px;
    font-family: Lato;
    color: #3E3E3E;
    background: transparent;
}


.selfad-FormButton-wrapper {
    flex-basis: 410px;
    justify-content: space-between;
}

.selfad-FormButton-wrapper * {
    width: 50%;
    max-width: 200px;
    
    height: 30px;
    line-height: 15px;
}

.emojiPicker.shown, .backgroundPicker.shown {
    display: flex;
}

.background-selector {
    justify-content: space-between;
}

.background-selector .backgroundTemplateItem {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    overflow: hidden;
}
.selfAdBackground-Template-0 {
    display: flex
;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    background-color: #dcdcdc;
}

.selfAdBackground-Template-1 {
    background-color: #c90034;
    color: #fff;
}

.selfAdBackground-Template-2 {
    background-color: #691182;
    color: white;
}
.selfAdBackground-Template-3 {
    background-color: #0C0C0C;
    color: white;
}
.selfAdBackground-Template-4 {
    background-color: #3771B9;
    color: white;
}
.selfAdBackground-Template-5 {
    background-image: linear-gradient(237deg, #181DA4, #AF0638);
    color: white;
}
.selfAdBackground-Template-6 {
    background-image: linear-gradient(#FFEE00, #E09800, #E25D18);
    color: white;
}
.selfAdBackground-Template-7 {
    background-image: linear-gradient(#67D1B8, #3BA88E, #1F8E73);
    color: white;
}
.selfAdBackground-Template-8 {
    background-image: linear-gradient(#F5C43D, #AC31AC);
    color: white;
}
.selfAdBackground-Template-9 {
    background-image: linear-gradient(244deg, #1470D9, #209E42);
    color: white;
}
.selfAdBackground-Template-10 {
    background-image: linear-gradient(#5B06Af, #E93DDE);
    color: white;
}

input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
}

#AnnonceurPanelListing .PanelItemImage {
    flex-basis: 74px;
    flex-grow: 0;
}
#AnnonceurPanelListing .PanelItemDescription {
    flex-basis: 200px;
    word-break: break-word;
    padding-left: 10px;
    flex-grow: 3;
}
#AnnonceurPanelListing .PanelItemDate {
    flex-basis: 185px;
    padding-left: 10px;
    flex-grow: 3;
}
#AnnonceurPanelListing .PanelItemActiveToggler {
    flex-basis: 50px;
    flex-grow: 1;
    display: flex;
    justify-content: center
}
#AnnonceurPanelListing .PanelItemStat {
    flex-basis: 65px;
    flex-grow: 1;
    display: flex;
    justify-content: center
}

#AnnonceurPanelListing .statSeparator, #AnnonceurPanelListing .mobileLabelZone, #AnnonceurPanelListing .labelDateMobile {
    display: none;
}
@media screen and (max-width: 1199px) {
    #AnnonceurPanelListing .mobileLabelZone {
        display: flex !important;
        width: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    #AnnonceurPanelListing .statSeparator {
        display: flex;
        width: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    #AnnonceurPanelListing .PanelItemActiveToggler {
        flex-basis: 70px;
    }

    #AnnonceurPanelListing .PanelItemDate {
        align-items: start;
        align-content: start;
    }
    #AnnonceurPanelListing .AnnonceurPanel-Annonces-header{
        display:none;
    }
    #AnnonceurPanelListing .labelDateMobile {
        display: block;
    }
}

.AnnonceurPanel-search-tool {
    flex-grow: 1;
    display: flex;
    flex-wrap: wrap;
    max-width: 500px;
}
@media screen and (max-width: 1200px) {
    .AnnonceurPanel-search-tool {
        max-width: 420px;
        min-width: 420px;
    }
}
@media screen and (max-width: 992px) {
    .AnnonceurPanel-search-tool {
        max-width: none;
        width: 100%;
        max-width: none;
        min-width: 0px;
    }
}

.annonceur-panel-search-input {
    width: 0px;
    flex-grow: 1;
    height: 36px;
}
.annonceur-panel-search-input + div>button{
    height:36px;
}


/*Mobile Mini*/
@media screen and (min-width: 768px) and (max-width: 991px) {
    #AnnonceurPanelListing .mobileLabelZone {
        display: flex !important;
        width: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
        order: 4;
    }

    #AnnonceurPanelListing .statSeparator {
        display: flex;
        width: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
        order: 4;
    }

    #AnnonceurPanelListing .AnnonceurPanel-Annonces-header {
        display: none;
    }

    #AnnonceurPanelListing .labelDateMobile {
        display: block;
    }

    #AnnonceurPanelListing .PanelItemDescription {
        order: 3;
        padding: 10px;
    }

    #AnnonceurPanelListing .PanelItemDate {
        width: 100%;
        flex-basis: auto;
        order: 1;
        padding: 0px;
    }

    #AnnonceurPanelListing .PanelItemActiveToggler {
        order: 4;
    }

    #AnnonceurPanelListing .PanelItemStat {
        order: 4;
    }

    #AnnonceurPanelListing .PanelItemImage {
        order: 2;
    }
}
@media screen and (max-width: 560px) {
    #AnnonceurPanelListing .mobileLabelZone {
        display: flex !important;
        width: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
        order: 4;
    }

    #AnnonceurPanelListing .statSeparator {
        display: flex;
        width: 100%;
        margin-top: 5px;
        margin-bottom: 5px;
        order: 4;
    }

    #AnnonceurPanelListing .AnnonceurPanel-Annonces-header {
        display: none;
    }

    #AnnonceurPanelListing .labelDateMobile {
        display: block;
    }

    #AnnonceurPanelListing .PanelItemDescription {
        order: 3;
        padding: 10px;
    }

    #AnnonceurPanelListing .PanelItemDate {
        width: 100%;
        flex-basis: auto;
        order: 1;
        padding: 0px;
    }

    #AnnonceurPanelListing .PanelItemActiveToggler {
        order: 4;
    }

    #AnnonceurPanelListing .PanelItemStat {
        order: 4;
    }

    #AnnonceurPanelListing .PanelItemImage {
        order: 2;
    }
}

/*Fin tailles des élément du panel*/

.AnnonceurPanelItem>*{
    flex-grow:1;
}

.AnnonceurPanelItem:hover {
    background-color: #EAE9EE
}
.PanelItemDescriptionMobile {
    font-weight: bold;
}
@media screen and (max-width: 374px) {
    .PanelItemDescriptionMobile {
        font-size: 11px;
    }
}

.annonceurPanel-form input[type=text] {
    min-height: 35px;
    width: 80%;
}

.annonceurPanel-form .loginManagementIcon {
    border: none;
    font-size: 20px;
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    border: 1px solid black;
}

@media screen and (max-width: 767px) {
    .selfAdPanelSideSectionLeft {
        order:2;
        margin-right:0px!important;
        margin-top:50px!important;
    }
}

.SelfAdvertiser-UpdateWidgetPlaceholder {
    min-width: 300px;
    max-width: 350px;
    flex-basis: 300px;
    flex-grow: 1;
}
.SelfAdvertiser-UpdateWidgetPlaceholder .sticky-side-content{    
    min-width: 300px;
}

.SelfAdvertiser-UpdateWidget {
    position: relative;
    overflow: visible;
    padding: 20px;
    background-color: white;
    min-width: 300px;
    max-width: 350px;
}
.SelfAdvertiser-UpdateWidget .companyNameHeader {
    font-weight: bold;
    text-align: center;
    font-size: 16px;
}
.SelfAdvertiser-UpdateWidget .updateWidgetLogo {
    display:flex;
    justify-content:center;
    width:100%;
    position:absolute;
    top:-25px;
    left:0px;
}
.SelfAdvertiser-UpdateWidget .updateWidgetLogo input{
    position:absolute;
    transform:scale(0);
}
.SelfAdvertiser-UpdateWidget.deactivated .updateWidgetLogo .editLogoIcon{
    display:none;
}
    .SelfAdvertiser-UpdateWidget .updateWidgetLogo .editLogoIcon {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        -moz-box-shadow: 0 0 5px #FFFFFF;
        -webkit-box-shadow: 0 0 5px #FFFFFF;
        box-shadow: 0 0 5px #FFFFFF;
        background-color: #FFFFFFCC;
        padding: 2px;
        border-radius: 5px;
    }
.SelfAdvertiser-UpdateWidget .updateWidgetLogo .pastilleCompagnie, .SelfAdvertiser-UpdateWidget .updateWidgetLogo .LetterAv{
    margin:0px;
}
.SelfAdvertiser-UpdateWidget label {
    font-weight: bold;
    font-size: 14px;
}
.SelfAdvertiser-UpdateWidget input {
    font-size: 14px;
    background-color: transparent;
    color: black;
    padding:0px;
}
.SelfAdvertiser-UpdateWidget.deactivated input {
    border: none !important;
}
.SelfAdvertiser-UpdateWidget.deactivated .scheduleManagementIcon {
    display:none;
}
.scheduleManagementIcon{
    margin-left:5px;
}
.SelfAdvertiser-UpdateWidget .editIcon {
    position: absolute;
    right: 0px;
}

.scheduleDays {
    width: 75px;
    font-size: 14px;
}
.scheduleHours{
    width:125px;
}
.scheduleHours input {
    font-size: 14px;
    width: 44px;
    text-align: center;
}
.tempus-dominus-widget {
    border-radius: 20px!important;
    box-shadow: 0px 0px 20px #0000001A!important;
    overflow: hidden!important;
}

.TempusTimeOnlyPicker {
    width: 8rem !important;
}

.selfAdPanelNavigation {
    background-color: white;
    padding: 5px;
    min-width: 300px;
    max-width: 350px;
    display: flex;
    justify-content: center;
    font-weight: bold;
    margin-top: 20px;
    align-items: center;
    font-size: 14px;
}
.selfAdPanelNavigation.active{
    background-color:#3071B9;
    color:white;
}

.SelfAdDescWebkitClamp:hover .DescCompl {
    display: block;
}

.selfad-DataSection-Title{
    font-size:20px;
    font-weight:bold;
}


.DescCompl {
    display: none;
    background: #FFFFFF;
    border-radius: 15px;
    margin-left: 28px;
    padding: 10px;
    position: fixed;
    z-index: 1000;
    width: 300px;
    box-shadow: 0px 0px 1px 1px #CCC;
}

.annonce-tool .annonce-padding {
    padding: 10px!important;
}

.annonce-tool a.pastilleCompagnie-wrapper {
    position: relative;
    display: flex;
}

.annonce-tool a.pastilleCompagnie-wrapper:hover::after {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 50px;
    height: 50px;
    background-color: #F0F0F0;
    opacity: 0.6;
    content: "";
    border-radius: 50%;
}
.annonce-tool a.pastilleCompagnie-wrapper .pastilleCompagnie {
    margin-right: 0px;
}
.annonce-tool .annonce-tool-input {
    position: relative;
    display: flex;
    border-radius: 10px;
    text-decoration:none!important;
    font-size:18px;    
    color:inherit!important;
}
.annonce-tool .annonce-tool-input * {
    border-radius:10px;
}
.annonce-tool .annonce-tool-input:hover::after {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: #F0F0F0;
    opacity: 0.6;
    content: "";    
    border-radius:10px;
}
.annonce-tool-file-input-label {
    position: relative;
    display: flex;
    border-radius: 25px;
    text-decoration: none !important;
    font-size: 18px;
    color: inherit !important;
    cursor:pointer;
}
.annonce-tool-file-input-label:hover::after {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: #F0F0F0;
    opacity: 0.6;
    content: "";
}
/*Règle de l'upload*/
:root {
    --upload-progress-background: linear-gradient(to right, #7EB1E2 0%, #F0F0F0 50%);
    --upload-progress-percent: 0%;
    --upload-progress-string: "0%";
}
.annonce-tool-file-input-label.complete {
    background-color: #319F4F !important;
}
/*
.annonce-tool-file-input-label.upload-going {
    background: var(--upload-progress-background)!important;
}
*/

.upload-going {
    padding: 3px 6px 0px 6px;
    display: block!important;
    position:relative;
}
.upload-going::before {
    content: var(--upload-progress-string);
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size:50px;
    color: #FFFFFF;
    z-index:2;
}
.upload-going:after {
    content: '';
    display: block;
    position: absolute;
    left: -3px;
    top: -3px;
    right: -3px;
    bottom: -3px;
    background-color: transparent;
    background-image: conic-gradient(#7EB1E2, #7EB1E2 var(--upload-progress-percent), transparent var(--upload-progress-percent));
    z-index: -100;
    border-radius: inherit;
}

.annonce-tool-button {
    height: 35px;
    margin-bottom: 0px;
    margin-top: 15px;
    border-radius: 25px;
    overflow: hidden;
}

.annonce-tool-input {
    width: 100%;
    height: 100%;
}
.annonce-tool-input input{
    width: 100%;
}

@media screen and (max-width: 1400px) {
    .selfAd-Form-layout #sidebar {
        display: none !important;
    }
}

@media screen and (max-width: 1199px) {
    .selfAd-Form-layout .selfAdSideSectionLeft .selfAdSideSectionLeftPublication{
        margin-top: 50px;
        order: 2;
        flex-grow:0!important;
    }
}

.backgroundPickerIcon {
    position: absolute;
    left: 10px;
    font-size: 18px;
}

.emojiPickerIcon {
    position: absolute;
    right: 10px;
    font-size: 18px;
}

.emojiPicker, .backgroundPicker {
    display: none;
    justify-content: end;
    width: 100%;
    position: relative;
}

.emojiPicker.shown, .backgroundPicker.shown {
    display: flex;
}

.background-selector{
    justify-content:space-between;
}

.background-selector .backgroundTemplateItem {
    width:32px;
    height:32px;
    border-radius:8px;
    overflow:hidden;
}

#selfAd_DescriptionView {
    width: 100%;
    height: 100%;
    min-height: 80px;
    display: flex;
    flex-wrap: wrap;
    padding: 1rem;
    padding-bottom: 1.35rem;
    outline: none;
    font-family: inherit;
}
#selfAd_DescriptionView * {
    width: 100%;
}

.selfAdBackground-TemplateBase, .PubNeomediaBigBlockData .description.selfAdBackground-TemplateBase {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 25px;
    font-size: 40px;
    font-weight: bold;
    text-align: center;
}
.selfAdBackground-Template-0 {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    background-color: gainsboro;
}
.selfAdBackground-Template-1 {
    background-color: #C90034;
    color: white;
}

.selfAdBackground-Template-2 {
    background-color: #691182;
    color: white;
}
.selfAdBackground-Template-3 {
    background-color: #0C0C0C;
    color: white;
}
.selfAdBackground-Template-4 {
    background-color: #3771B9;
    color: white;
}
.selfAdBackground-Template-5 {
    background-image: linear-gradient(237deg, #181DA4, #AF0638);
    color: white;
}
.selfAdBackground-Template-6 {
    background-image: linear-gradient(#FFEE00, #E09800, #E25D18);
    color: white;
}
.selfAdBackground-Template-7 {
    background-image: linear-gradient(#67D1B8, #3BA88E, #1F8E73);
    color: white;
}
.selfAdBackground-Template-8 {
    background-image: linear-gradient(#F5C43D, #AC31AC);
    color: white;
}
.selfAdBackground-Template-9 {
    background-image: linear-gradient(244deg, #1470D9, #209E42);
    color: white;
}
.selfAdBackground-Template-10 {
    background-image: linear-gradient(#5B06Af, #E93DDE);
    color: white;
}

.selfad-FormButton-wrapper {
    flex-basis: 410px;
    justify-content: space-between
}

.selfad-FormDateFields-wrapper > *{
    flex-basis:320px;
    max-width:48%;
}


@media screen and (max-width: 374px) {
    .selfad-FormButton-wrapper * {
        width: 100%;
        max-width: none;
        margin-bottom: 10px !important;
    }

    .selfad-FormDateFields-wrapper > * {
        width:100%;
        max-width: none;
    }
}

.mb22px {
    margin-bottom: 22px !important;
}

.urlCompany {
    overflow-wrap: break-word;
    word-break: break-all;
    white-space: normal;
    font-weight: normal;
}

.descriptionCompany {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Styles pour la grille d'annonces _AdsGrid.cshtml */

/* Suppression des bordures arrondies pour la grille d'annonces */
.selfad-grid .selfAdStandardBorder,
.selfad-grid .selfAdStandardBorder *,
.selfad-grid .PubNeomediaBigBlock,
.selfad-grid .PubNeomediaBigBlock * {
    border-radius: 0 !important;
}

/* Suppression du soulignement au survol */
.selfad-grid a,
.selfad-grid a:hover,
.selfad-grid a:focus,
.selfad-grid a:active {
    text-decoration: none !important;
}

/* VERSION DESKTOP */
.selfad-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    margin: 0 0 24px 0;
    padding: 0;
}

.selfad-grid .col-12 {
    padding: 0;
}

.selfad-grid .col-md-6 {
    flex: 0 0 calc(50% - 12px);
    max-width: calc(50% - 12px);
}

.selfad-grid .PubNeomediaBigBlock {
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
    margin: 0 !important;
    background-color: #FFFFFF;
    border: 1px solid #E8E8E8;
    border-radius: 0 !important;
    padding: 18px;
}

.selfad-grid .PubNeomediaBigBlock > * {
    margin-bottom: 0 !important;
}

.selfad-grid .annonce-padding {
    padding: 0;
}

.selfad-grid .listingAd-companyName {
    text-align: left;
    font: normal normal bold 22px/30px 'Segoe UI', sans-serif;
    letter-spacing: 0px;
    color: #060000;
    opacity: 1;
    padding-top: 0;
    margin-bottom: 0;
}

.selfad-grid .listingAd-companyName span {
    display: block;
}

.selfad-grid .description {
    text-align: left;
    font: normal normal normal 15px/20px 'Segoe UI', sans-serif;
    letter-spacing: 0px;
    color: #060000;
    opacity: 1;
    margin: 0;
}

/* Sélecteur de type d'affichage (grille / liste) pour la catégorie circulaires */
.selfad-view-toggle {
    display: flex;
    align-items: center;
}

.selfad-view-icon {
    width: 21px;
    height: 21px;
    font-size: 20px;
    line-height: 21px;
    margin-left: 6px;
    cursor: pointer;
    color: #70706F;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.selfad-view-icon-active {
    color: #7EB1E2;
}

.flyer-toolbar {
    gap: 0;
    align-items: center;
    justify-content: center;
}

.flyer-toolbar .selfad-view-toggle {
    margin-left: 12px;
    align-self: center;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
}

.flyer-category-pills {
    gap: 0;
}

.flyer-category-pill {
    border: 1px solid #70706F;
    background: transparent;
    color: #70706F;
    padding: 0 12px;
    height: 26px;
    margin: 6px 2px 6px 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    font: normal normal bold 13px/3px 'Inter', sans-serif;
    text-align: center;
    letter-spacing: 0;
    opacity: 1;
    cursor: pointer;
    transition: none;
    appearance: none;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
    box-shadow: none;
}

.flyer-category-pill:first-child {
    margin-left: 0;
}

.flyer-category-pill:hover,
.flyer-category-pill:focus,
.flyer-category-pill:focus-visible,
.flyer-category-pill:active {
    border-color: #70706F !important;
    color: #70706F !important;
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none;
    filter: none;
}

.flyer-category-pill-active,
.flyer-category-pill-active:hover,
.flyer-category-pill-active:focus,
.flyer-category-pill-active:focus-visible,
.flyer-category-pill-active:active {
    background: #7EB1E2 !important;
    color: #fff !important;
    border-color: #7EB1E2 !important;
    box-shadow: none !important;
    outline: none !important;
}

@media (max-width: 767.98px) {
    .flyer-toolbar {
        justify-content: center;
        padding-left: 14px;
        padding-right: 14px;
    }
    .selfad-view-toggle {
        margin-left: auto !important;
    }
    .flyer-category-pill {
        font: normal normal bold 11px/2px 'Inter', sans-serif;
        padding: 0 6px;
    }
    .flyer-category-pill-active {
        font: normal normal bold 11px/2px 'Inter', sans-serif;
    }
}

.selfad-grid .selfad-grid-content {
    display: grid;
    grid-template-rows: auto auto;
    gap: 12px;
}

.selfad-grid .selfad-grid-image-clip {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.selfad-grid .selfad-grid-image-wrapper {
    width: 100%;
    height: auto;
    overflow: visible;
    background-color: #000000;
    border-radius: 0 !important;
    position: relative;
}

.selfad-grid .selfad-grid-image-wrapper img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: left top;
    display: block;
    border-radius: 0 !important;
}

.selfad-grid .selfad-grid-info {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: 12px;
}

.selfad-grid .selfad-grid-text {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.selfad-grid .selfad-grid-share-cell {
    display: flex;
    justify-content: flex-end;
}

.selfad-grid .selfad-grid-share-icon {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: #060000;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

.selfad-grid .selfad-grid-share-icon:hover,
.selfad-grid .selfad-grid-share-icon:focus-visible {
    color: #1A1A1A;
}

@media screen and (min-width: 992px) {
    .selfad-grid .selfad-grid-share-icon {
        width: 20px;
        height: 21px;
        font-size: 20px;
    }
}

.selfad-grid .description p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
    word-break: break-word;
}

/* VERSION TABLET */
@media screen and (max-width: 991px) {
    .selfad-grid {
        gap: 20px;
        margin-bottom: 20px;
    }

    .selfad-grid .col-md-6 {
        flex: 0 0 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }

    .selfad-grid .PubNeomediaBigBlock {
        margin: 0 !important;
        padding: 7px;
    }

    .selfad-grid .annonce-padding {
        padding: 0;
    }

    .selfad-grid .listingAd-companyName {
        font-size: 18px;
        margin-bottom: 0;
    }

}

/* VERSION MOBILE */
@media screen and (max-width: 767px) {
    .selfad-grid {
        gap: 16px;
        margin-bottom: 16px;
    }

    .selfad-grid .col-12,
    .selfad-grid .col-md-6 {
        flex: 0 0 calc(50% - 8px);
        max-width: calc(50% - 8px);
    }

    .selfad-grid .selfad-grid-image-clip {
        aspect-ratio: 1 / 1;
    }

    .selfad-grid .PubNeomediaBigBlock {
        margin: 0 !important;
        padding: 7px;
        box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.08);
    }

    .selfad-grid .annonce-padding {
        padding: 0;
    }

    .selfad-grid .listingAd-companyName {
        text-align: left;
        font: normal normal bold 14px/19px 'Segoe UI', sans-serif;
        letter-spacing: 0px;
        color: #060000;
        opacity: 1;
        margin-bottom: 0;
    }

    .selfad-grid .description {
        text-align: left;
        font: normal normal normal 11px/15px 'Segoe UI', sans-serif;
        letter-spacing: 0px;
        color: #060000;
        opacity: 1;
    }
}

/* TRÈS PETITS ÉCRANS */
@media screen and (max-width: 480px) {
    .selfad-grid {
        gap: 12px;
        margin-bottom: 12px;
    }

    .selfad-grid .col-12,
    .selfad-grid .col-md-6 {
        flex: 0 0 calc(50% - 6px);
        max-width: calc(50% - 6px);
    }

    .selfad-grid .PubNeomediaBigBlock {
        margin: 0 !important;
        padding: 7px;
    }

    .selfad-grid .annonce-padding {
        padding: 0;
    }

    .selfad-grid .listingAd-companyName {
        font: normal normal bold 14px/19px 'Segoe UI', sans-serif;
        letter-spacing: 0px;
        color: #060000;
        opacity: 1;
        margin-bottom: 0;
    }

    .selfad-grid .description {
        text-align: left;
        font: normal normal normal 11px/15px 'Segoe UI', sans-serif;
        letter-spacing: 0px;
        color: #060000;
        opacity: 1;
    }
}