/* Design repris de calendrier-365.com (mêmes couleurs, mêmes composants) */
:root {
  --pcolor: #690B22;
  --linkcolor: #0d6efd;
  --bs-primary: #690B22;
  --bs-primary-rgb: 105, 11, 34;
  --bs-link-color: #0d6efd;
}
body {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 17px;
  line-height: 1.8;
  color: #111;
  background: #fff;
}
a { color: var(--linkcolor); }
img { height: auto; max-width: 100%; }
li { margin: 10px 0; }
a.bold, .bold { font-weight: bold; }

/* ---------- En-tête ---------- */
.navbar-header {
  min-height: 56px;
  width: 100%;
  background: #fff;
  z-index: 20;
  box-shadow: 0 0 7px rgba(0, 0, 0, .1);
}
.nav { display: flex; align-items: center; flex-wrap: nowrap; position: relative; min-height: 56px; }
.site-logo { padding: 10px 0; }
.site-logo a {
  font-size: 22px;
  font-weight: 800;
  color: var(--pcolor);
  text-decoration: none;
  letter-spacing: -.3px;
  white-space: nowrap;
}
.site-logo a span { color: #111; }
#nav-check { display: none; }
.nav-btn { display: none; }
.primary-menu { margin-left: auto; }
ul.menu-principal { list-style: none; margin: 0; padding: 0; display: flex; }
li.menu-item { position: relative; margin: 0; }
li.menu-item > a {
  display: block;
  color: var(--pcolor);
  padding: 14px 12px;
  text-decoration: none;
  font-weight: bold;
}
li.menu-item > a:hover, li.menu-item.active > a { color: #000; }
.dropdown-menu {
  position: absolute;
  background: #fff;
  list-style: none;
  top: 100%;
  left: 0;
  min-width: 260px;
  display: none;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .3);
}
.dropdown-menu li { margin: 0; border-bottom: 1px solid #f1f1f1; }
.dropdown-menu li a { padding: 8px 15px; display: block; color: var(--pcolor); text-decoration: none; font-weight: 600; font-size: 15px; }
.dropdown-menu li a:hover { background: #f6f8fd; color: #000; }
.dropdown:hover .dropdown-menu, .dropdown:focus-within .dropdown-menu { display: block; }

@media (max-width: 1000px) {
  .site-logo { margin: auto; }
  .site-logo a { font-size: 19px; }
  .nav-btn { display: inline-block; position: absolute; left: 0; top: 6px; }
  .nav-btn label { display: inline-block; width: 50px; height: 44px; padding: 12px; cursor: pointer; }
  .nav-btn label span { display: block; width: 25px; height: 10px; border-top: 4px solid var(--pcolor); }
  .primary-menu {
    position: absolute;
    width: 100%;
    background: #fff;
    height: 0;
    overflow: hidden;
    top: 56px;
    left: 0;
    transition: all .3s ease-in;
  }
  #nav-check:checked ~ .primary-menu { height: calc(100vh - 56px); overflow-y: auto; }
  ul.menu-principal { display: block; padding: 10px 0; }
  li.menu-item > a { padding: 8px 10px; }
  .dropdown-menu { position: static; display: block; box-shadow: none; padding-left: 15px; min-width: 0; }
  .dropdown-menu li { border: 0; }
}

/* ---------- Sections ---------- */
.section { padding: 20px 0; }
.section2 { padding: 0; }
.bg1 { background: #f6f8fd !important; }
.h1home {
  font-size: clamp(1.2rem, .7423rem + 1.9531vw, 2.5rem);
  font-weight: bold;
  margin: 20px 0;
  letter-spacing: .5px;
  line-height: 1.5;
  word-spacing: 2px;
}
.h1title {
  font-size: clamp(1.375rem, .6111rem + 2.4444vw, 2.75rem);
  font-weight: 700;
  margin: 20px 0;
  line-height: 1.3;
}
h2.h2title, .h2title {
  font-size: clamp(1.05rem, .7859rem + 1.1268vw, 1.8rem);
  font-weight: bold;
  margin: 30px 0;
}
.barh2::after {
  content: "";
  display: block;
  width: 150px;
  height: 5px;
  background-color: var(--pcolor);
  margin: 8px 0 10px;
}
.text-center.barh2::after { margin-left: auto; margin-right: auto; }
h3.deschome { font-weight: bold; font-size: 20px; margin: 0; padding: 20px 0 10px; text-align: left; }
.spases { padding: 20px 10px; }

/* Onglets (barre de catégories) */
.tabs-wrapper { width: 100%; overflow-x: auto; overflow-y: hidden; white-space: nowrap; padding-bottom: 10px; }
.tabs-container { display: inline-flex; gap: 9px; padding-top: 10px; }
.tab-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  color: var(--pcolor);
  text-decoration: none;
  min-width: 120px;
  border: solid 2px var(--pcolor);
  padding: 5px 14px;
  border-radius: 25px;
  background: #fff;
  transition: color .3s ease;
}
.tab-item svg { width: 22px; height: 22px; fill: var(--pcolor); }
.tab-item.active, .tab-item:hover { color: #fff; background: var(--pcolor); }
.tab-item.active svg, .tab-item:hover svg { fill: #fff; }
.tabs-wrapper::-webkit-scrollbar { height: 8px; }
.tabs-wrapper::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 10px; }
.tabs-wrapper::-webkit-scrollbar-thumb { background-color: var(--pcolor); border-radius: 10px; }

/* ---------- Grille de modèles ---------- */
.panel-default { position: relative; }
.panel-default img { display: block; margin: auto; }
.margnt {
  box-shadow: 2px 2px 6px 1px rgba(1, 91, 145, .17);
  display: block;
  margin: auto;
}
.buttondown {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--pcolor);
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  padding: 10px 20px;
  width: 150px;
  border-radius: 50px;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease, visibility 0s linear .1s;
}
a:hover .buttondown, a:focus .buttondown { opacity: 1; visibility: visible; transition: opacity .5s ease, visibility 0s; }
p.nameposte, h3.nameposte { margin: 15px 0; line-height: 1.4; }
.nameposte a { color: #000; font-size: 15px; font-weight: bold; padding: 5px 0; text-decoration: none; }
.nameposte a:hover { color: var(--pcolor); }

/* ---------- Article ---------- */
.postblog h2 {
  color: #000;
  font-size: clamp(1.05rem, .7859rem + 1.1268vw, 1.8rem);
  font-weight: bold;
  margin: 30px 0;
}
.postblog h2::before {
  content: "";
  display: block;
  width: 80px;
  height: 3px;
  background-color: var(--pcolor);
  margin: 8px 0 10px;
}
.postblog h2.h2title::before, .postblog h2.no-bar::before { content: none; }
.postblog h3 {
  color: #000;
  font-size: clamp(1rem, .8239rem + .7512vw, 1.5rem);
  font-weight: bold;
  margin: 30px 0 20px;
}
.postblog h3::before { content: "■"; color: var(--pcolor); margin-right: .5em; }
.postblog h3.nameposte::before, .postblog h3.mt-0::before { content: none; }
.postblog h4 { color: #000; font-size: 18px; font-weight: bold; margin: 30px 0; }
.postblog ul li::marker, .postblog ol li::marker { color: var(--pcolor); }
hr.achr { background: var(--pcolor); border: 1px solid var(--pcolor); opacity: 1; }

/* Image à la une : carrée (900 x 900), servie en 400 / 600 / 900 selon l'écran */
.featured {
  width: 100%;
  max-width: 460px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 6px;
}
@media (max-width: 767px) {
  .featured { max-width: 100%; }
}

/* Tableau d'informations */
.wp-block-table.tablee { clear: both; margin: 0 0 1rem; }
.wp-block-table.tablee table { width: 100%; border: 0; }
.wp-block-table.tablee tbody tr:nth-child(odd) { background-color: #f4f7ff; }
.wp-block-table td, .wp-block-table th { border: 0; padding: .55em .7em; vertical-align: middle; }
.wp-block-table th { font-weight: 600; width: 42%; }
.custom-listes .icon { color: var(--pcolor); margin-right: 6px; }

/* Boutons de téléchargement (couleurs de calendrier-365.com) */
.downexcel, .downpdf, .downword, .downjpg, .downall {
  border-radius: 5px;
  color: #fff;
  padding: 8px 12px;
  text-align: center;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 600;
  margin: 4px 2px;
  line-height: 1.3;
}
.downexcel { background-color: #1e6d41; }
a.downexcel:hover { color: #fff; background-color: #2e8555; }
.downpdf { background-color: #c40404; }
a.downpdf:hover { color: #fff; background-color: #fa1717; }
.downword { background-color: #3d46ed; }
a.downword:hover { color: #fff; background-color: #474feb; }
.downjpg { background-color: #464646; }
a.downjpg:hover { color: #fff; background-color: #5e5e5e; }
.downall { background-color: var(--pcolor); }
a.downall:hover { color: #fff; background-color: #8a1230; }

/* Bloc « télécharger » */
.downblock { background: #2c395c; padding: 20px; border-radius: 15px; margin: 10px 0 30px; color: #fff; }
.downblock .h2title { color: #fff; margin: 10px 0; }

/* Cartes des modèles (bas de l'article) */
.modele-card {
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 8px;
  padding: 15px;
  height: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
  box-shadow: 2px 2px 6px 1px rgba(1, 91, 145, .08);
}
.modele-card img { border: 1px solid #eee; margin: 0 auto 10px; }
.modele-card h3 { font-size: 18px !important; margin: 10px 0 !important; }
.modele-card h3::before { content: none !important; }
.modele-card .texte { font-size: 15px; color: #464646; text-align: left; }
.modele-card .boutons { margin-top: auto; }
.modele-card .poids { font-size: 13px; color: #6c6c6c; margin: 4px 0 0; }

/* Encadrés */
.intro { border-left: 5px solid var(--pcolor); padding-left: 15px; }
.alert-primary { background: #f3e6e9; border-color: #e3c5cc; color: #3d0614; }
.alert-primary a { color: var(--pcolor); }
.table-primary, .table-primary > th, .table-primary > td { --bs-table-bg: #f3e6e9; }
.breadcrumb { font-size: 14px; margin: 15px 0 0; }
.breadcrumb a { color: var(--pcolor); text-decoration: none; }
.btn-primary { --bs-btn-bg: var(--pcolor); --bs-btn-border-color: var(--pcolor); --bs-btn-hover-bg: #8a1230; --bs-btn-hover-border-color: #8a1230; --bs-btn-active-bg: #4d0818; }
.btn-outline-primary { --bs-btn-color: var(--pcolor); --bs-btn-border-color: var(--pcolor); --bs-btn-hover-bg: var(--pcolor); --bs-btn-hover-border-color: var(--pcolor); }

/* Questions / Réponses */
.collapsible {
  margin: 0;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  background: none;
  text-align: left;
  font-size: 18px;
  font-weight: bold;
  color: #000;
  border-radius: 0;
}
.collapsible::before { content: "+ "; color: #000; margin-left: .5em; }
.collapsible.active::before { content: "- "; color: var(--pcolor); }
.collapsible:hover { color: var(--pcolor); }
.faq-content {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height .1s ease-out;
  border-left: 2px solid var(--pcolor);
}

/* Pagination */
.pagination2 a {
  color: var(--pcolor);
  padding: 5px 16px;
  text-decoration: none;
  border: solid 2px var(--pcolor);
  margin: 1px;
  border-radius: 5px;
}
.pagination2 a:hover { color: #fff; background-color: var(--pcolor); }

/* ---------- Pied de page ---------- */
footer { border-top: 0; }
.footrone { background: #1D1616; border-bottom: 3px solid #000; padding: 50px 5px; color: #fff; }
.footrone .site-logo a { color: #fff; }
.footrone .site-logo a span { color: #e9b9c5; }
.footrtwo { background: #464646; padding: 10px; }
.textcopyrightfooterone { font-size: 14px; color: #fff; text-align: justify; }
.textcopyright { font-size: 12px; color: #fff; text-align: center; margin: 5px 0; }
h3.subtitleh3 { font-size: 18px; font-weight: bold; color: #fff; }
ul.dlight { list-style-type: square; color: #fff; padding-left: 18px; }
ul.dlight li { margin: 6px 0; }
.linkfooter a { text-decoration: none; color: #fff; font-size: 14px; transition: .2s color; }
.linkfooter a:hover { color: #e2e1e1; }

/* Cartes du blog : format 16:9 (1280 x 720), comme l'image en haut des articles */
.img-blog { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }
.pagination2 a.current { background-color: var(--pcolor); color: #fff; }

/* Introduction à côté de l'image à la une */
.intro-article h2 { margin-top: 0; }
.intro-article h2::before { margin-top: 0; }
@media (min-width: 768px) { .wp-block-table th { width: 30%; } }
.intro-article .wp-block-table th { width: 45%; }

/* Section des modèles dans le texte de l'article */
.section-modeles { scroll-margin-top: 70px; }

/* ---------- Mode maintenance : seul le message, au centre de la page ---------- */
.maintenance { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; text-align: center; }
.maintenance p { margin: 0; font-size: clamp(1.1rem, .9rem + 1vw, 1.6rem); font-weight: 600; color: var(--pcolor); max-width: 640px; }
