/**
 * Tuiles cours page d'accueil — fill liquide complétion
 * Déployer vers : moodle/theme/adaptable/style/frontpage_tiles_custom.css
 *
 * Charger via <link> dans « Quand la balise BODY est ouverte »
 * OU coller dans Adaptable → CSS personnalisé (partie 2 de adaptable_custom_complet.css)
 *
 * Nécessite aussi : theme/adaptable/classes/output/core/course_renderer.php
 * (injecte --course-fill et la classe cimbox-completion)
 */

/* Masquer le bouton "Course" d'origine */
.coursebox .coursebtn,
.frontpage-course-list-all .coursebtn {
    display: none !important;
}

/* Tuile : clic, survol, bordures */
.coursebox.hover {
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    overflow: hidden;
}

.coursebox.hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.coursebox.hover .cimbox {
    transition: transform 0.5s ease;
}

/* Mode produit : image centrée sur fond blanc (photos machines sur fond blanc) */
.frontpage-course-list-all .coursebox.hover .cimbox,
.frontpage-course-list-all .coursebox.covtiles .cimbox {
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: #ffffff !important;
}

.coursebox.hover:hover .cimbox {
    transform: scale(1.1);
}

.coursebox .boxfooter {
    min-height: 0;
    padding: 0;
}

/* Fill complétion : calque par-dessus image + titre (teinte aussi le blanc des photos) */
.frontpage-course-list-all .coursebox.hover .panel-body.course-tile-completion,
.frontpage-course-list-all .coursebox.covtiles .panel-body.course-tile-completion {
    position: relative;
    overflow: hidden;
}

.frontpage-course-list-all .coursebox.hover .panel-body.course-tile-completion::after,
.frontpage-course-list-all .coursebox.covtiles .panel-body.course-tile-completion::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(
        to top,
        rgba(22, 112, 204, 0.14) 0%,
        rgba(22, 112, 204, 0.14) var(--course-fill, 0%),
        transparent var(--course-fill, 0%)
    );
    transition: background 0.9s ease-in-out;
}

.frontpage-course-list-all .coursebox.hover .panel-body.course-tile-completion .cimbox,
.frontpage-course-list-all .coursebox.covtiles .panel-body.course-tile-completion .cimbox {
    position: relative;
    z-index: 1;
}

.frontpage-course-list-all .coursebox.hover .panel-body.course-tile-completion .coursebox-content,
.frontpage-course-list-all .coursebox.hover .panel-body.course-tile-completion .boxfooter,
.frontpage-course-list-all .coursebox.covtiles .panel-body.course-tile-completion .coursebox-content,
.frontpage-course-list-all .coursebox.covtiles .panel-body.course-tile-completion .boxfooter {
    position: relative;
    z-index: 3;
}

.frontpage-course-list-all .panel-body {
    position: relative;
    padding-bottom: 0;
    overflow: hidden;
}

.frontpage-course-list-all .panel-body.clearfix {
    position: relative !important;
    cursor: pointer;
    transition: transform 0.2s;
}

.frontpage-course-list-all .panel-body.clearfix:hover {
    transform: scale(1.02);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.frontpage-course-list-all .coursebox-content {
    position: relative;
    padding: 0 !important;
}

.frontpage-course-list-all .coursebox-content h3 a::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

.coursebox.panel .panel-body {
    border: 1px solid #9ca7ad !important;
    box-shadow: 5px 5px 5px #cbcbcba8;
    border-radius: 5px;
}

#adaptable-page-header-wrapper #main-navbar {
    background-color: #fff;
    border-bottom: 3px solid #082f6f;
}
