/* ADH_V2_ARTICLES.CSS : définitions de style pour les articles éditoriaux et les annonces (public et adhérents)
/* CSS 3
/* Auteur : Hugues Sturbois (85)
/* Dernière mise-à-jour : 14/02/2025
*/

/*------------- Commun (en savoir plus / masquer les détails) -------------*/
a.icone-plus {
   color: var(--gpx-black);
   text-decoration: none; }

a.icone-plus:hover {
   color: var(--gpx-darkblue); }
   
span.icone-plus {
   background-color: var(--gpx-black);
   color: white;
   font-weight: bold;
   margin-right: 10px;
   padding: 0px 5px 5px 5px; }

a.icone-plus:hover span.icone-plus {
   background-color: var(--gpx-darkblue); }

/*------------- Commun (style des articles éditoriaux /annonces de manifestation) -------------*/
p.article-text {
   text-align: justify; }

p.article-text-c {
   text-align: center; }

p.article-text-r {
   text-align: right; }

.article-collapse {
   display: none;
   width: 80%;
   margin: 10px auto; }

span.like-a {
   text-decoration: none;
   color: var(--gpx-darkblue); }

span.like-a:hover {
   text-decoration: underline; }

hr.article-text {
   border-top: 1px solid var(--gpx-darkblue);
   border-bottom: 0px;
   width: 70%; }

/*------------- Articles de l'éditorial -------------*/
.hp-article {
   display: none;
   width: 80%;
   background-color: white;
   margin: 10px auto;
   border-top: 1px var(--gpx-grey) solid;
   border-bottom: 1px var(--gpx-grey) solid; }

.hp-article h3 {
   color: var(--gpx-darkblue);
   text-align: center; }

.hp-article a {
   text-decoration: none;
   color: var(--gpx-darkblue); }

.hp-article a:hover {
   text-decoration: underline; }
   
.hp-article img {
   max-width: 95%;
   height: auto;
   margin: 5px 10px; }

p.hp-art-header {
   text-align: center;
   color: var(--gpx-darkblue); }

/*------------- Annonce d'une manifestation (page programme et page détail + inscription) -------------*/
 .event-teaser {
   display: flex;
   flex-direction: row;
   background-color: white;
   max-width: 1000px;
   margin: 30px auto; }

.event-teaser img {
   display: box;
   margin: 10px 20px;
   /* height: 450px; */ }

.event-shortdescr {
   display: flex;
   flex-direction: column;
   margin: 10px 20px;
   border-left: 4px var(--gpx-darkblue) solid;
   box-shadow: 8px 8px 20px 3px rgba(0,0,0,0.2); }
   /* commun activité / manifestation */
  
.event-shortdescr-evtype {
   min-height: 450px;
   min-width: 459px;
   padding: 0px 20px; }
   /* dans la page d'une activité */
  
.event-shortdescr-event {
   background-color: white;
   margin: auto 20px auto -150px;
   padding: 0px 20px 10px 20px; }
   /* dans la page détail d'une manifestation */

.event-shortdescr-event p {
   text-align: left; }

.event-shortdescr h2 {
   margin-left: 15px;
   margin-bottom: 10px; }

.event-date-place {
   color: var(--gpx-darkblue);
   text-align: left;
   font-size: 18px;
   font-weight: bold;
   margin: 5px 15px; }

.event-date-place img {
   float: left;
   margin: 0px 20px 10px 0px;
   width: 18px;
   height: 18px;  /* ne pas dépasser la taille de police */
   filter: invert(17%) sepia(22%) saturate(4859%) hue-rotate(173deg) brightness(97%) contrast(101%); }

.event-deadline {
   color: var(--gpx-darkblue);
   font-size: 18px;
   font-weight: bold; }

/*------------- Annonces et formulaire d'inscription des manifestations -------------*/
.event-register {
   display: flex;
   flex-direction: row;
   background-color: white;
   max-width: 1000px;
   margin: 0px auto;
   padding: 30px 0px; }

.register-info {
   display: flex;
   flex-direction: column;
   margin: 10px 10px; }

.register-info div {
   display: flex;
   flex-direction: column;
   margin: auto 0px; }

p.register-info-note {
   padding-top: 10px;
   border-top: 1px solid var(--gpx-grey); }

.event-longdescr {
   background-color: var(--gpx-lightblue);
   width: 66%;
   margin: 0px auto;
   padding: 20px 30px; }

.event-longdescr h2 {
   width: 100%;
   text-align: center; }

.event-longdescr img {
   margin: 5px 15px; }