/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */

/* ===========================
   Tokens
=========================== */
:root { --tcs-radius: 14px; }

/* ===========================
   Bloc Résumé 30s (lien ou div)
=========================== */
.resume-30s,
.resume-30s * { color: #fff !important; }

.resume-30s,
.resume-30s--link {
  display: block;
  background: #a8977b !important;
  border-radius: var(--tcs-radius);
  padding: 16px 18px;
  margin: 20px 0 40px;
  text-decoration: none !important;
  filter: none !important;
  box-shadow: none !important;
}
.resume-30s--link::before,
.resume-30s--link::after { content: none !important; }
.resume-30s--link:hover,
.resume-30s--link:focus,
.resume-30s--link:active {
  background: #a8977b !important;
  color: #fff !important;
  text-decoration: none !important;
  filter: none !important;
  box-shadow: none !important;
  outline: 2px solid rgba(255,255,255,.5);
  outline-offset: 2px;
}

/* Titre (espagnol), responsive */
.resume-30s__header {
  display: flex; align-items: center; gap: 8px;
  font-size: 20px; line-height: 1.3; margin-bottom: 8px;
}
@media (min-width: 768px) { .resume-30s__header { font-size: 22px; } }
.resume-30s__icon { font-size: 18px; }

/* ===========================
   Images — arrondies, sans ombre
=========================== */
.entry-content .wp-block-image,
.page .entry-content .wp-block-image,
.entry-content figure,
.page .entry-content figure {
  border-radius: var(--tcs-radius);
  overflow: hidden;
  box-shadow: none !important;
}
.entry-content img,
.page .entry-content img,
.entry-content .wp-block-gallery img,
.page .entry-content .wp-block-gallery img,
.entry-content .blocks-gallery-item img,
.page .entry-content .blocks-gallery-item img {
  border-radius: var(--tcs-radius);
  box-shadow: none !important;
}
.single-post .wp-post-image,
.page .wp-post-image {
  border-radius: var(--tcs-radius);
  box-shadow: none !important;
}
/* Exceptions : logos/header/widgets */
.site-branding img,
.ct-header img,
.widget img { border-radius: 0 !important; box-shadow: none !important; }

/* ===========================
   Accordéons — design carte unifié
   (numérotation via .tcs-acc__badge, fond unifié, filet vertical)
=========================== */

/* Fil vertical (contient uniquement les accordéons, pas l’end card) */
.tcs-acc-wrap { position: relative; }
.tcs-acc-wrap::before {
  content: "";
  position: absolute;
  left: 36px; top: 0; bottom: 0;
  width: 2px;
  background: rgba(168,151,123,.35); /* #a8977b clair */
  pointer-events: none;
}

/* Carte */
.tcs-acc {
  position: relative;
  background: #fff; /* header + panel même fond */
  border: 1px solid rgba(168,151,123,0.35);
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
  margin: 16px 0 24px;
  overflow: hidden;
  transition: transform .2s, box-shadow .2s, border-color .2s, background .2s;
}
.tcs-acc:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
  border-color: rgba(168,151,123,0.5);
}
.tcs-acc h2 { margin: 0; font-size: 1em; line-height: 1.35; }

/* Header (grid: badge | titre | caret) */
.tcs-acc__btn {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 18px 20px;
  background: #fff;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-size: clamp(17px, 1rem + .25vw, 20px);
  line-height: 1.35;
}
/* on neutralise le soulignement uniquement dans le header */
.tcs-acc__btn, .tcs-acc__btn * { text-decoration: none !important; }

.tcs-acc__badge {
  width: 36px; height: 36px; border-radius: 9999px;
  display: grid; place-items: center;
  background: #fff; color: #111; font-weight: 700;
  border: 2px solid rgba(168,151,123,.45);
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
}
.tcs-acc__title { line-height: 1.25; }
.tcs-acc__caret::before { content: '+'; font-weight: 700; font-size: 22px; line-height: 1; }
.tcs-acc.is-open .tcs-acc__caret::before { content: '–'; }

/* Panel animé (height) */
.tcs-acc__panel {
  padding: 0 20px 18px;
  height: 0; overflow: hidden;
  transition: height .28s ease;
  background: #fff; border-top: none;
}
/* contenu propre */
.tcs-acc__panel > *:first-child { margin-top: 18px; }
.tcs-acc__panel > *:last-child  { margin-bottom: 0; }

/* H3 plus petits que H2 */
/* H3 dans les panneaux : souffle de 15px au-dessus et en dessous */
.tcs-acc__panel h3 {
  font-size: clamp(16px, 0.95rem + .10vw, 18px);
  line-height: 1.3;
  padding: 15px 0;     /* <-- l'espace demandé */
  margin: 0;           /* on évite de cumuler marge + padding */
}

/* Si un H3 est le premier élément du panneau, ne lui ajoute pas la marge générique */
.tcs-acc__panel > h3:first-child {
  margin-top: 0 !important;  /* écrase .tcs-acc__panel > *:first-child */
}


/* Vire toutes “barres/overlays” que le thème pourrait ajouter */
.tcs-acc::before,
.tcs-acc::after,
.tcs-acc__btn::after {
  content: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.tcs-acc hr,
.tcs-acc .wp-block-separator { display: none !important; }

/* ===========================
   End card (dernier H2, toujours ouverte)
=========================== */
.tcs-endcard {
  position: relative;
  border-radius: 20px;
  padding: 24px clamp(20px, 3vw, 48px) 22px clamp(24px, 3vw, 48px);
  background: linear-gradient(180deg, #1f5147 0%, #15433a 100%);
  color: #fff;
  border: 1px solid rgba(168,151,123,.45);
  box-shadow: 0 18px 36px rgba(0,0,0,.18);
  margin: 22px 0 24px;
}
.tcs-endcard::before {
  content: "";
  position: absolute;
  left: 16px; top: 16px; bottom: 16px;
  width: 4px; border-radius: 2px;
  background: rgba(168,151,123,.9);
}
.tcs-endcard__title {
  margin: 0 0 14px;
  padding-left: 14px;
  color: #fff; font-weight: 700;
  font-size: clamp(22px, 1.1rem + .6vw, 30px);
  line-height: 1.25;
}
.tcs-endcard__content p { margin: 0 0 12px; }
.tcs-endcard__content h3 {
  font-size: clamp(17px, 1rem + .15vw, 19px);
  line-height: 1.3; margin: 18px 0 10px; color: #fff;
}
/* pas de séparateurs / modules newsletter dans l’endcard */
.tcs-endcard hr,
.tcs-endcard .wp-block-separator { display: none !important; }
.tcs-endcard .ct-newsletter-subscribe-container,
.tcs-endcard .ct-newsletter-subscribe { display: none !important; }

/* End card full-bleed sur desktop (sort du container) */
@media (min-width: 1024px) {
  .tcs-endcard {
    margin-left: calc(50% - 50vw + 24px);  /* 24px = gutter, ajuste si besoin */
    margin-right: calc(50% - 50vw + 24px);
  }
}


/* Ne cache les éventuels fantômes qu'une fois le script terminé */
.tcs-ready .tcs-acc:not([data-tcs="1"]) { display: none !important; }
.tcs-ready .tcs-acc[data-tcs="1"]:empty { display: none !important; }



/* 1) Image à la une : ombre sur le conteneur direct */
.single .ct-media-container,
.page  .ct-media-container {
  border-radius: var(--tcs-radius);
  overflow: hidden;                               /* pour des coins propres */
  box-shadow: 0 10px 24px rgba(0,0,0,.12) !important; /* force l’ombre */
}

/* 2) Certains layouts Blocksy utilisent d'autres wrappers : couvre-les aussi */
.single .post-thumbnail,
.page  .post-thumbnail,
.single .ct-image-container,
.page  .ct-image-container,
.single .ct-media,
.page  .ct-media {
  border-radius: var(--tcs-radius);
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0,0,0,.12) !important;
}

/* 3) Empêche le parent immédiat de couper l’ombre si c’est le cas */
.single .entry-header,
.page  .entry-header {
  overflow: visible !important;
}

/* 4) L'image elle-même reste sans ombre (on la garde propre) */
.single .wp-post-image,
.page  .wp-post-image {
  box-shadow: none !important;
  border-radius: var(--tcs-radius);
}


/* neutralise la taille du heading dans la carte, H2 ou H3 */
.tcs-acc h2, .tcs-acc h3 { margin: 0; font-size: 1em; line-height: 1.35; }



/* ===========================
   Callouts Pros / Contras
=========================== */
:root {
  --tcs-card-radius: 16px;
  --tcs-card-shadow: 0 8px 18px rgba(0,0,0,.06);

  --tcs-good-bg:    #eaf6f1;  /* vert clair */
  --tcs-good-border:#2d7d66;  /* vert plus soutenu */
  --tcs-bad-bg:     #fdeeee;  /* rouge clair */
  --tcs-bad-border: #b83a3a;  /* rouge plus soutenu */
}

.tcs-callouts {
  display: grid;
  gap: 16px;
  margin: 12px 0 20px;
}
@media (min-width: 860px) {
  .tcs-callouts { grid-template-columns: 1fr 1fr; }
}

.tcs-callout {
  border-radius: var(--tcs-card-radius);
  box-shadow: var(--tcs-card-shadow);
  padding: 18px 18px 16px;
  background: #fff; /* sécurité */
  transition: transform .2s ease, box-shadow .2s ease;
}
.tcs-callout:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0,0,0,.08); }

/* variantes */
.tcs-callout--good { background: var(--tcs-good-bg); border: 1px solid rgba(45,125,102,.45); }
.tcs-callout--bad  { background: var(--tcs-bad-bg);  border: 1px solid rgba(184,58,58,.45);  }

/* titre + icône */
.tcs-callout__title {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 10px;
  font-size: clamp(18px, 1rem + .25vw, 20px);
  line-height: 1.3;
}
.tcs-callout__ico {
  width: 28px; height: 28px; border-radius: 9999px;
  display: grid; place-items: center;
  font-size: 16px; font-weight: 800; color: #fff;
}
.tcs-callout--good .tcs-callout__ico { background: var(--tcs-good-border); }
.tcs-callout--bad  .tcs-callout__ico { background: var(--tcs-bad-border); }

/* listes: puce ronde ✓ / ✕ */
.tcs-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.tcs-list li { position: relative; padding-left: 28px; }
.tcs-list li::before {
  content: "";
  position: absolute; left: 0; top: .3em;
  width: 20px; height: 20px; border-radius: 9999px;
  display: inline-grid; place-items: center;
  font-size: 12px; color: #fff;
}
.tcs-list--good li::before { content: "✓"; background: var(--tcs-good-border); }
.tcs-list--bad  li::before { content: "✕"; background: var(--tcs-bad-border); }



/* Supprime le préfixe "Categoría" dans les H1 des pages Catégorie */
body.category .ct-title-label {
  display: none !important;
}




/* ===========================
   Sticky CTA bas d'écran (centré)
=========================== */
:root { --tcs-sticky-pad: 0px; }

.has-tcs-stickycta body { padding-bottom: var(--tcs-sticky-pad); }

.tcs-sticky-cta {
  position: fixed;
  left: 0; right: 0;
  bottom: max(0px, env(safe-area-inset-bottom));
  z-index: 9999;

  /* fond + ombre */
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 -10px 24px rgba(0,0,0,.10);

  /* gros padding latéral pour éloigner des bords */
  padding: 12px clamp(20px, 5vw, 40px);

  /* animation d’apparition après scroll */
  transform: translateY(100%);
  opacity: 0;
  transition: transform .25s ease, opacity .25s ease;

  text-decoration: none !important;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}

.tcs-sticky-cta.is-visible {
  transform: translateY(0);
  opacity: 1;
}

/* inner centré & limité en largeur */
.tcs-sticky-cta__inner {
  width: min(1120px, 100%);
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 14px;
}

.tcs-sticky-cta__left {
  display: flex; align-items: center; gap: 12px;
  min-width: 0; /* ellipsis */
}

.tcs-sticky-cta__thumb {
  width: 44px; height: 44px;
  border-radius: 10px;
  object-fit: cover;
  flex: 0 0 auto;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}
.tcs-sticky-cta__thumb--fallback {
  display: inline-grid; place-items: center;
  background: #f3f2ef;
  font-size: 20px;
}

.tcs-sticky-cta__title {
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tcs-sticky-cta__btn {
  background: #000;
  color: #fff;
  font-weight: 700;
  padding: 10px 16px;
  border-radius: 9999px;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
  flex: 0 0 auto;
}

.tcs-sticky-cta:hover .tcs-sticky-cta__btn,
.tcs-sticky-cta:focus-visible .tcs-sticky-cta__btn { filter: brightness(0.95); }

@media (min-width: 768px) {
  .tcs-sticky-cta        { padding: 14px clamp(28px, 6vw, 56px); }
  .tcs-sticky-cta__thumb { width: 48px; height: 48px; }
}