/* ============================================================
   WRAPPER GLOBAL PREMIUM
============================================================ */
.lg-ticker {
    display: flex;
    align-items: center;
    width: 100%;
    overflow: hidden;
    font-family: "Lato", sans-serif;
    box-sizing: border-box;

    /* Variables dynamiques */
    --ticker-height: 48px;
    --ticker-title-bg: #800080;
    --ticker-title-text: #ffffff;
    --ticker-offset: 0px;

    height: var(--ticker-height);
    background: transparent;
    position: relative;
}

/* Force le box-sizing partout */
.lg-ticker *, .lg-ticker *::before, .lg-ticker *::after {
    box-sizing: inherit;
}

/* ============================================================
   TITRE PREMIUM
============================================================ */
.lg-ticker-title {
    position: relative;
    display: flex;
    align-items: center;
    padding-left: 42px;
    padding-right: 22px;

    font-weight: 700;
    font-size: 15px;

    background: var(--ticker-title-bg);
    color: var(--ticker-title-text);

    height: var(--ticker-height);
    line-height: var(--ticker-height);

    border-radius: 6px 0 0 6px;
    white-space: nowrap;
}

/* Flèche premium */
.lg-title-arrow {
    position: absolute;
    left: 0;
    top: 12px;

    border-style: solid;
    border-width: 20px 0 20px 22px;
    border-color: transparent transparent transparent rgba(255,255,255,0.28);

    transform: translateX(-22px);
}

/* ============================================================
   CONTENU DÉFILANT
============================================================ */
.lg-ticker-content {
    flex: 1;
    overflow: hidden;

    padding-left: calc((var(--ticker-height) * 0.30) + 14px);
    /*border-radius: 0 6px 6px 0;*/

    height: var(--ticker-height);
    line-height: var(--ticker-height);
    display: flex;
    align-items: center;

    white-space: nowrap;
    position: relative;
}

/* Pour custom theme */
.lg-ticker-content.custom-theme {
    transition: background 0.2s ease;
}

/* ============================================================
   MODE CONTINUOUS
============================================================ */
.ticker-continuous {
    display: inline-flex;
    white-space: nowrap;
    will-change: transform;
}

.ticker-item {
    display: inline-block;
    padding-right: 45px;
    font-size: 14px;
    white-space: nowrap;
}

/* Motifs */
.ticker-motif {
    padding: 3px 7px;
    border-radius: 3px;
    font-weight: 700;
    margin-right: 6px;
    font-size: 12px;
    color: #fff;
}

/* ============================================================
   MODE CAROUSEL
============================================================ */
.ticker-carousel {
    transition: opacity 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   STICKY (position:sticky)
============================================================ */
.lg-sticky {
    position: sticky !important;
    top: var(--ticker-offset, 0px) !important;
    z-index: 9999;
}

/* ============================================================
   FIXED GLOBAL
============================================================ */
.lg-fixed {
    position: fixed !important;
    top: var(--ticker-offset, 0px) !important;
    left: 0;
    width: 100%;
    z-index: 99999;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    background: inherit;
}

/* ============================================================
   SMART FIXED MODE (mode intelligent)
============================================================ */
.lg-smart-fixed {
    position: relative;
    transition: box-shadow 0.2s ease;
}

/* Quand JS active le fix */
.lg-smart-fixed.is-fixed {
    position: fixed !important;
    top: var(--ticker-offset, 0px) !important;
    left: 0;
    right: 0;
    width: 100% !important;
    z-index: 99999;
    box-shadow: 0 2px 12px rgba(0,0,0,0.18);
    background: inherit;
}

/* ============================================================
   THEMES OPTIONNELS
============================================================ */
.theme-cnn .lg-ticker-title {
    background: #CC0000;
}
.theme-cnn .lg-title-arrow {
    border-left-color: rgba(0,0,0,0.3);
}

.theme-bbc .lg-ticker-title {
    background: #000;
}
.theme-bbc .lg-title-arrow {
    border-left-color: rgba(255,255,255,0.25);
}

.theme-dark .lg-ticker-title {
    background: #222;
    color: #eee;
}

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width: 768px) {

    .ticker-item {
        padding-right: 25px;
        font-size: 13px;
    }

    .lg-ticker-title {
        font-size: 14px;
        padding-left: 36px;
    }
}
/* --- MODE STICKY BAS --- */
.lg-sticky-bottom {
    position: fixed !important;
    bottom: var(--ticker-offset, 0px) !important;
    left: 0;
    width: 100%;
    z-index: 99999;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.12);
    background: inherit;
}