/* ==========================================================================
   42TV — Habillage « premium » de Fluid Player
   Chargé APRÈS fluidplayer.min.css (voir layout/container.html).
   Ne touche qu'à l'apparence : le moteur, les sources, la qualité, la vitesse et la pub restent ceux de Fluid Player.
   Palette : émeraude du site (#10b981 / #34d399), fonds très sombres teintés de vert.
   ========================================================================== */
.fluid_video_wrapper.fluid_player_layout_default {
    --pp-accent: #10b981;
    --pp-accent-2: #34d399;
    --pp-bg: rgba(4, 14, 9, .94);
    border-radius: 18px;
    overflow: hidden;
    background: #000;
    box-shadow: 0 30px 70px -28px rgba(0, 0, 0, .85), 0 0 0 1px rgba(255, 255, 255, .06), 0 0 60px -20px rgba(16, 185, 129, .35);
    font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
}
.embed-responsive-item, .embed-responsive-item > .fluid_video_wrapper { border-radius: 18px; }

/* --- Barre de contrôles : voile dégradé plus haut, légèrement teinté --- */
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container {
    height: 70px;
    background: linear-gradient(to top, rgba(2, 8, 5, .92) 0%, rgba(2, 8, 5, .55) 55%, rgba(2, 8, 5, 0) 100%);
}

/* --- Barre de progression --- */
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container {
    top: 12px; height: 20px; left: 18px; right: 18px; cursor: pointer;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container .fluid_controls_progress {
    top: 8px; height: 4px; border-radius: 4px; background-color: rgba(255, 255, 255, .22);
    transition: height .2s ease, top .2s ease;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container:hover .fluid_controls_progress {
    top: 6px; margin-top: 0; height: 8px;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container .fluid_controls_buffered {
    top: 8px; height: 4px; border-radius: 4px; background-color: rgba(255, 255, 255, .34); z-index: 0;
    transition: height .2s ease, top .2s ease;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container:hover .fluid_controls_buffered {
    top: 6px; height: 8px;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container .fluid_controls_progress .fluid_controls_currentprogress {
    border-radius: 4px; height: 100%;
    background-color: var(--pp-accent) !important;
    background-image: linear-gradient(90deg, var(--pp-accent), var(--pp-accent-2)) !important;
    box-shadow: 0 0 14px rgba(16, 185, 129, .75);
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container.fluid_slider .fluid_controls_progress .fluid_controls_currentprogress .fluid_controls_currentpos,
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container .fluid_controls_progress .fluid_controls_currentpos {
    width: 16px; height: 16px; top: 50%; margin-top: -8px; right: -8px; border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, .45), 0 4px 12px rgba(0, 0, 0, .5);
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_progress_container .fluid_timeline_preview,
.fluid_video_wrapper.fluid_player_layout_default .fluid_timeline_preview {
    background-color: var(--pp-bg); border: 1px solid rgba(16, 185, 129, .3); border-radius: 8px; padding: 6px 12px;
    font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; bottom: 22px;
}

/* --- Rangée de boutons : décalée sous la barre de progression --- */
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_left,
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right { top: 38px; }
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_left { left: 22px; }
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right { right: 22px; }

.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_button {
    opacity: .92;
    transition: transform .2s cubic-bezier(.34, 1.56, .64, 1), opacity .2s ease, filter .2s ease;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_button:hover {
    opacity: 1; transform: scale(1.18);
    filter: drop-shadow(0 0 7px rgba(52, 211, 153, .85));
}
/* Le téléchargement n'est pas proposé sur le site */
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_button_download { display: none !important; }

.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_fluid_control_duration {
    font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
    font-size: 12.5px; font-weight: 600; letter-spacing: .02em; font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, .88); text-shadow: 0 1px 6px rgba(0, 0, 0, .6);
}

/* --- Volume --- */
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right .fluid_control_volume_container .fluid_control_volume {
    height: 4px; margin-top: 10px; border-radius: 4px; background-color: rgba(255, 255, 255, .22);
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right .fluid_control_volume_container .fluid_control_volume .fluid_control_currentvolume {
    height: 4px; border-radius: 4px; background-color: var(--pp-accent) !important; box-shadow: 0 0 8px rgba(16, 185, 129, .7);
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right .fluid_control_volume_container .fluid_control_volume .fluid_control_currentvolume .fluid_control_volume_currentpos {
    background-color: #fff; width: 12px; height: 12px; top: -4px; border-radius: 50%; box-shadow: 0 0 0 3px rgba(16, 185, 129, .4);
}

/* --- Menus qualité / vitesse : verre sombre --- */
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right .fluid_button_video_source .fluid_video_sources_list,
.fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right .fluid_video_playback_rates {
    background-color: var(--pp-bg) !important; border: 1px solid rgba(16, 185, 129, .28); border-radius: 14px; overflow: hidden;
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .55); bottom: 34px;
}
.fluid_video_wrapper .fluid_video_source_list_item, .fluid_video_wrapper .fluid_video_playback_rates_item {
    transition: background .2s ease, color .2s ease;
}
.fluid_video_wrapper .fluid_video_source_list_item:hover, .fluid_video_wrapper .fluid_video_playback_rates_item:hover {
    background: rgba(16, 185, 129, .16); color: var(--pp-accent-2);
}
.fluid_video_wrapper .fluid_video_source_list_item .source_button_icon.source_selected,
.fluid_video_wrapper .fluid_video_playback_rates_item.fluid_video_playback_rates_item_active { color: var(--pp-accent-2); }

/* --- Gros bouton lecture central --- */
.fluid_video_wrapper.fluid_player_layout_default .fluid_initial_play {
    width: 88px; height: 88px; border-radius: 50%;
    background-color: rgba(4, 20, 13, .5) !important;
    border: 2px solid rgba(52, 211, 153, .75);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    box-shadow: 0 0 0 10px rgba(16, 185, 129, .12), 0 18px 44px rgba(0, 0, 0, .55), 0 0 40px rgba(16, 185, 129, .35);
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), background-color .3s ease, box-shadow .3s ease;
    animation: ppPulse 2.6s ease-in-out infinite;
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_initial_play:hover {
    transform: scale(1.1); background-color: rgba(16, 185, 129, .92) !important;
    box-shadow: 0 0 0 12px rgba(16, 185, 129, .2), 0 22px 50px rgba(0, 0, 0, .6), 0 0 60px rgba(16, 185, 129, .6);
}
.fluid_video_wrapper.fluid_player_layout_default .fluid_initial_play .fluid_initial_play_button {
    margin-top: 24px; margin-left: 33px; border-width: 20px 0 20px 30px; border-color: transparent transparent transparent #fff;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .35));
}
@keyframes ppPulse {
    0%, 100% { box-shadow: 0 0 0 10px rgba(16, 185, 129, .12), 0 18px 44px rgba(0, 0, 0, .55), 0 0 40px rgba(16, 185, 129, .35); }
    50% { box-shadow: 0 0 0 18px rgba(16, 185, 129, .05), 0 18px 44px rgba(0, 0, 0, .55), 0 0 60px rgba(16, 185, 129, .5); }
}

/* --- Menu contextuel (clic droit) --- */
.fluid_video_wrapper .fluid_context_menu {
    background-color: var(--pp-bg); border: 1px solid rgba(16, 185, 129, .25); border-radius: 12px; overflow: hidden;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .55);
}

/* --- Mobile : un peu plus compact --- */
@media (max-width: 575px) {
    .fluid_video_wrapper.fluid_player_layout_default { border-radius: 12px; }
    .embed-responsive-item, .embed-responsive-item > .fluid_video_wrapper { border-radius: 12px; }
    .fluid_video_wrapper.fluid_player_layout_default .fluid_initial_play { width: 68px; height: 68px; }
    .fluid_video_wrapper.fluid_player_layout_default .fluid_initial_play .fluid_initial_play_button { margin-top: 17px; margin-left: 25px; border-width: 17px 0 17px 25px; }
    .fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_left { left: 14px; }
    .fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_right { right: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .fluid_video_wrapper.fluid_player_layout_default .fluid_initial_play { animation: none; }
}