/* Styles pour FullCalendar */
#ae-calendar {
    width: 100%; /* Pleine largeur */
    height: auto; /* Hauteur dynamique gérée par FullCalendar */
    margin: 0 auto 15px; /* Marge réduite pour optimisation */
}

.fc {
    font-family: Roboto, sans-serif; /* Police moderne */
}

/* Boutons de navigation du calendrier */
.fc-button {
    background-color: #ff5733 !important; /* Orange pour boutons */
    color: white !important;
    font-size: 11px !important; /* Police réduite */
    padding: 5px 8px !important; /* Boutons compacts */
    border-radius: 6px !important; /* Coins arrondis */
}
.fc-button:hover {
    background-color: #cc4400 !important; /* Orange foncé au survol */
}

/* Textes du calendrier (jours, en-têtes) */
.fc-daygrid-day-number, .fc-col-header-cell, .fc-timegrid-slot-label {
    font-size: 9px !important; /* Police plus petite */
}

/* Styles des événements */
#ae-calendar .fc-event,
#ae-calendar .fc-daygrid-event,
#ae-calendar .fc-timegrid-event,
#ae-calendar .fc-event[style],
#ae-calendar .fc-daygrid-event[style],
#ae-calendar .fc-timegrid-event[style] {
    border-radius: 3px !important;
    cursor: pointer; /* Cliquable */
    padding: 5px !important; /* Padding réduit */
    min-height: 22px !important; /* Hauteur minimale pour mobile */
    display: flex !important;
    align-items: center !important; /* Centrer verticalement */
    justify-content: center !important; /* Centrer horizontalement */
    white-space: nowrap !important; /* Pas de retour à la ligne */
    overflow: hidden !important;
    text-overflow: ellipsis !important; /* Points de suspension */
    border: 1mm solid !important; /* Bordure de 3mm */
}

/* Conteneur principal de l'événement */
#ae-calendar .fc-event-main {
    color: #ffffff !important; /* Texte noir pour lisibilité */
    font-size: 12px !important; /* Police compacte */
    width: 100%; /* Pleine largeur */
    text-align: center; /* Centrer le texte */
}

/* Supprimer le point de couleur et l'heure */
.fc-daygrid-event-dot {
    display: none !important; /* Supprimer le rond */
}
.fc-timegrid-event .fc-event-time {
    display: none !important; /* Masquer l'heure */
}

/* Lien pour afficher/masquer le formulaire */
.ae-form-toggle {
    text-align: center;
    margin-bottom: 15px;
}
.ae-toggle-link {
    display: inline-block;
    padding: 8px 16px;
    background-color: #ff5733; /* Orange */
    color: white;
    text-decoration: none;
    border-radius: 6px;
    font-size: 13px;
}
.ae-toggle-link:hover {
    background-color: #cc4400; /* Orange foncé */
}

/* Formulaire d'ajout d'événement */
#ae-form-container {
    max-width: 500px; /* Réduit pour mobile */
    margin: 0 auto;
    padding: 15px;
    background: #f9f9f9; /* Fond clair */
    border-radius: 6px;
}
#ae-event-form {
    display: flex;
    flex-direction: column;
    gap: 12px; /* Espacement réduit */
}
#ae-event-form label {
    font-weight: bold;
    font-size: 13px;
}
#ae-event-form input, #ae-event-form textarea, #ae-event-form select {
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 13px;
}
#ae-event-form button {
    padding: 8px;
    background: #ff5733; /* Orange */
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
#ae-event-form button:hover {
    background: #cc4400; /* Orange foncé */
}
#ae-message {
    margin-top: 8px;
    color: green;
}
#ae-message.error {
    color: red;
}

/* Détails de l'événement (clic sur événement) */
#ae-event-details {
    max-width: 500px;
    margin: 15px auto;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 6px;
    text-align: center;
}
#ae-event-details button {
    background-color: #ff5733;
    color: white;
    padding: 8px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin: 4px;
    font-size: 12px;
}
#ae-event-details button:hover {
    background: #cc4400;
}
#ae-event-details img {
    max-width: 100%;
    height: auto;
    margin: 8px 0;
}
#ae-event-details a {
    color: #ff5733;
    text-decoration: underline;
}
#ae-event-details a:hover {
    color: #cc4400;
}

/* Détails d'un événement partagé (via URL) */
#ae-single-event-details {
    max-width: 500px;
    margin: 15px auto;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 6px;
    text-align: center;
}
#ae-single-event-details img {
    max-width: 100%;
    height: auto;
    margin: 8px 0;
}
#ae-single-event-details a {
    color: #ff5733;
    text-decoration: underline;
}
#ae-single-event-details a:hover {
    color: #cc4400;
}

/* Formulaire de rappel */
#ae-reminder-submit {
    margin-top: 12px;
}
#ae-reminder-submit label {
    font-weight: bold;
    font-size: 12px;
}
#ae-reminder-submit input[type="email"] {
    width: 100%;
    padding: 7px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 12px;
}
#ae-reminder-submit button {
    background-color: #ff5733;
    color: white;
    font-size: 12px;
    padding: 6px 10px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 8px;
}
#ae-reminder-submit button:hover {
    background: #cc4400;
}

/* Bouton de partage général */
#ae-share-btn {
    background-color: #007bff; /* Bleu */
    color: white;
    padding: 8px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin: 4px;
    font-size: 12px;
}
#ae-share-btn:hover {
    background: #0056b3; /* Bleu foncé */
}
#ae-share-btn i {
    margin-right: 4px;
}

/* Boutons de partage spécifiques */
.ae-share-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 8px 0;
}
.ae-share-btn {
    padding: 7px 10px;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 11px;
    display: flex;
    align-items: center;
}
.ae-share-btn i {
    margin-right: 4px;
}
.ae-share-btn:hover {
    opacity: 0.8;
}
#ae-share-telegram {
    background-color: #0088cc; /* Bleu Telegram */
}
#ae-share-whatsapp {
    background-color: #25D366; /* Vert WhatsApp */
}
#ae-share-facebook {
    background-color: #3b5998; /* Bleu Facebook */
}
#ae-share-signal {
    background-color: #3a76f0; /* Bleu Signal */
}
#ae-share-linkedin {
    background-color: #0077b5; /* Bleu LinkedIn */
}
#ae-share-email {
    background-color: #666; /* Gris email */
}
#ae-share-copy {
    background-color: #17a2b8; /* Cyan copier */
}

/* Légende */
.ae-legend {
    max-width: 500px;
    margin: 15px auto;
    padding: 8px;
    background: #f9f9f9;
    border-radius: 6px;
    text-align: center;
}
.ae-legend h3 {
    margin: 0 0 8px;
    font-size: 14px;
    color: #333;
}
.ae-legend-item {
    display: inline-flex;
    align-items: center;
    margin: 4px 8px;
    font-size: 11px;
    color: #333;
}
.ae-legend-item span {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 4px;
    border-radius: 3px;
}



/* Optimisation pour petits écrans (mobile/tablette) */
@media (max-width: 768px) {
    #ae-calendar {
        height: auto;
    }
    .fc-button {
        font-size: 7px !important; /* Boutons encore plus petits */
        padding: 2px 5px !important;
    }
    .fc-daygrid-day-number, .fc-col-header-cell, .fc-event-main {
        font-size: 3px !important; /* Police très petite */
    }
    .fc-event {
        padding: 3px !important; /* Padding minimal */
        min-height: 18px !important; /* Hauteur ultra-compacte */
    }
    #ae-form-container, #ae-event-details, #ae-single-event-details {
        max-width: 100%;
        padding: 8px;
    }
    .ae-share-buttons {
        flex-direction: column; /* Boutons en colonne */
        gap: 4px;
    }
    .ae-legend {
        max-width: 100%;
        padding: 8px;
    }
    .ae-legend-item {
        display: block; /* Légende en colonne */
        margin: 4px 0;
    }
	 .fc-toolbar-title {
        font-size: 9px !important; /* Taille réduite pour le titre du mois en mode mobile */
    }
}