/* ============================================================
   Logo Manager — Front-end Styles
   ============================================================ */

/* ---- Grille logos ----------------------------------------- */
.lm-logos-grid {
    display: grid;
    grid-template-columns: repeat(var(--lm-cols, 4), 1fr);
    gap: 24px;
    align-items: center;
    margin: 20px 0;
}
@media (max-width: 768px) { .lm-logos-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
@media (max-width: 480px) { .lm-logos-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } }

.lm-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    border-radius: 10px;
    transition: transform .25s ease, box-shadow .25s ease;
}
.lm-logo-item--bg {
    background-color:    var(--lm-logo-bg, transparent);
    background-image:    var(--lm-logo-bg-img, none);
    background-repeat:   var(--lm-logo-bg-rep, no-repeat);
    background-size:     var(--lm-logo-bg-sz, cover);
    background-position: center;
}
.lm-logo-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0,0,0,.1);
}
.lm-logo-item a { display: block; }
.lm-logo-item img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    filter: grayscale(30%);
    transition: filter .25s ease;
    display: block;
}
.lm-logo-item:hover img { filter: grayscale(0%); }

/* ---- Carte article [logo_card] ---------------------------- */
.lm-article-card {
    display: flex;
    align-items: stretch;
    width: 100%;
    border: 1px solid var(--lm-card-border, #e2e8f0);
    border-radius: var(--lm-card-radius, 12px);
    overflow: hidden;
    margin: 20px 0;
    font-family: inherit;
    box-sizing: border-box;
}

/* Zone logo — largeur fixe définie inline via image_width */
.lm-article-card__logo {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--lm-card-padding, 20px);
    border-right: 1px solid var(--lm-card-border, #e2e8f0);
    box-sizing: border-box;
}
.lm-article-card__logo--bg {
    background-color:    var(--lm-logo-bg, transparent);
    background-image:    var(--lm-logo-bg-img, none);
    background-repeat:   var(--lm-logo-bg-rep, no-repeat);
    background-size:     var(--lm-logo-bg-sz, cover);
    background-position: center;
}
.lm-article-card__logo img {
    width: 100%;
    height: auto;
    object-fit: contain;
    display: block;
}

/* Zone info — prend tout l'espace restant */
.lm-article-card__info {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: var(--lm-card-padding, 20px);
    box-sizing: border-box;
}
    font-size: 1.05em;
    font-weight: 700;
    color: inherit;
    display: block;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lm-article-card__link {
    font-size: .85em;
    color: #2563eb;
    text-decoration: none;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color .2s;
}
.lm-article-card__link:hover { color: #1d4ed8; text-decoration: underline; }

/* Responsive */
@media (max-width: 540px) {
    .lm-article-card { flex-direction: column; }
    .lm-article-card__logo {
        border-right: none;
        border-bottom: 1px solid var(--lm-card-border, #e2e8f0);
        width: 100% !important;
        min-width: unset !important;
    }
    .lm-article-card__info {
        width: 100% !important;
    }
    .lm-article-card__name,
    .lm-article-card__link {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
    }
}