/*
FontAwesome is used so it should be loaded globaly:
In child Function by adding or using the wordpress plugin:
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome_global' );
function enqueue_font_awesome_global() {
    // Using the official Font Awesome CDN for v5/v6
    wp_enqueue_style( 'font-awesome', 'https://use.fontawesome.com/releases/v6.4.0/css/all.css', array(), '6.4.0' );
}   
*/
  
:root {
    --corps-fonts: 1.3rem;
}

body {
    font-family: "Sora", sans-serif;
  font-optical-sizing: auto;
}
/* Badge récurrent */
.recurrence-badge {
    display: inline-block;
    background: linear-gradient(135deg, #4a7bd0, #3a66b3);
    color: #fff;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    margin: 10px 0 6px 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    letter-spacing: 0.3px;
}

/* Description de récurrence */
.recurrence-description {
    margin-top: 6px;
    font-size: 14px;
    color: #444;
    line-height: 1.4;
}

/* Dates de récurrence */
.recurrence-dates {
    margin-top: 4px;
    font-size: 14px;
    color: #222;
    font-weight: 600;
}
.dates-sticker::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url('../img/calendar.svg') no-repeat center/contain;
    margin-right: 8px;
    vertical-align: middle;
}



.inter-h2 {
    width: 100% !important;
    text-align: center;
    margin: 20px 0 20px 0 !important;
    font-weight: 800;
    font-size: 1.3rem;
}

.event-title {
    font-weight: 900;
    font-size: 30px;
    color: #d46e24;
}

img.calendar {
    margin-right: 5px;
    width: 20px;
}

.description {
    padding: 20px;
    text-align: justify;
    line-height: 1.3rem;
    margin: 0 auto;
    max-width: 80vw !important;
}

.eventid {
    text-align: center;
    border-radius: 10px;
    background: #fff;
    border: none;
    display: block;
    width: 100% !important;
    font-size: 28px;
    color: #000;
}

.pad-10 {
    padding: 10px;
}

.events {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}
.event-card {
    max-width: 97%;
    overflow: hidden;
    margin: 5px auto;
}
.event {
    margin-bottom: 10px;
    grid-template-columns: repeat(auto-fit, minmax(320px, 2fr)) !important;
    transition: transform 0.5s ease-in-out;
    border-radius: 10px;
    box-shadow: 0px 0px 4px 0px #835318;
}

.event:hover {
    transform: scale(1.05);
}

.event-thumb {
  overflow: hidden; 
    max-width: 300px;
    border-radius: 6px;
    display: block;
}

.eventthumb img {
    display: block;
    margin: 0 auto;
    height: 200px;
    object-fit: contain;
    border-radius: 6px;
}

a.file {
    text-decoration: underline;
    text-underline-offset: 3px;
}

a.file:before {
    font-family: FontAwesome !important;
    display: inline-block;
    /* Prevents inheritance of underline */
    text-decoration: none;
    /* Explicitly removes underline */
    font-weight: 900;
    /* Required for solid icons in FA6 */
    content: "\f0c1";
    /* Unicode for the icon */
    margin-right: 8px;
    /* Space between icon and text */
    vertical-align: middle;
    /* Align icon with text baseline */
}

.lieu-before {
    width: 1.2em;
    height: 1.2em;
    vertical-align: -0.125em;
    color: rgb(120, 5, 5);
}

.lieu {
    font-size: var(--corps-fonts);
}

.itemInfo {
    text-align: center;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.button-class {
    font-size: 25px;
    font-weight: 900;
    width: 400px;
    margin: 40px auto 0 auto;
    display: block !important;
    align-items: center;
    background-color: #3d1104;
    border: none;
    color: white;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border-radius: 10px;
}

@media (max-width: 800px) {
    .events {
        display: block;
    }


}