/* ============================================
   BOUTON ENCOCHE VERT
   ============================================ */

[class*="is-style-bouton-encoche"] {
  background:
    linear-gradient(to bottom right, transparent calc(50% - 0.5px), #C3FC12 calc(50% - 0.5px), #C3FC12 calc(50% + 0.5px), transparent calc(50% + 1px)) bottom right / 20px 20px no-repeat,
    linear-gradient(#C3FC12, #C3FC12) left bottom / calc(100% - 20px) 1px no-repeat,
    linear-gradient(#C3FC12, #C3FC12) top / 100% 1px no-repeat,
    linear-gradient(#C3FC12, #C3FC12) left / 1px 100% no-repeat,
    linear-gradient(#C3FC12, #C3FC12) top right / 1px calc(100% - 20px) no-repeat !important;
}

[class*="is-style-bouton-encoche"] .wp-block-button__link {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%) !important;
  background-image: none !important;
  white-space: nowrap !important;
  width: 100% !important;
  text-align: center !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
}

:root [class*="is-style-bouton-encoche"] .wp-block-button__link:hover,
:root [class*="is-style-bouton-encoche"] .wp-block-button__link.force-hover {
  background-color: #C3FC12 !important;
  background-image: none !important;
  color: #000000 !important;
}


/* ============================================
   BOUTON CHECK
   ============================================ */

[class*="is-style-bouton-check"] {
  background: transparent !important;
}

[class*="is-style-bouton-check"] .wp-block-button__link {
  clip-path: none !important;
  background-image: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  white-space: nowrap !important;
  width: 100% !important;
  text-align: center !important;
}

[class*="is-style-bouton-check"] .wp-block-button__link::before {
  content: '' !important;
  display: inline-block !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  border: 1px solid currentColor !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpolyline points='4,12 9,17 20,6' stroke='%2300B5FF' stroke-width='2.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 60% !important;
}


/* ============================================
   BOUTON OUTLINED VERT
   ============================================ */

[class*="is-style-bouton-outlined-vert"] {
  width: 100% !important;
}

[class*="is-style-bouton-outlined-vert"] .wp-block-button__link {
  clip-path: none !important;
  background-image: none !important;
  white-space: nowrap !important;
  width: 100% !important;
  text-align: center !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
}

:root [class*="is-style-bouton-outlined-vert"] .wp-block-button__link:hover {
  background-color: #C3FC12 !important;
  background-image: none !important;
  color: #000000 !important;
  border-color: #C3FC12 !important;
}


/* ============================================
   BOUTON OUTLINED GRIS avec biseau
   ============================================ */

[class*="is-style-bouton-outlined-gris"] {
  background:
    linear-gradient(to bottom right, transparent calc(50% - 0.5px), #E9E9E9 calc(50% - 0.5px), #E9E9E9 calc(50% + 0.5px), transparent calc(50% + 1px)) bottom right / 20px 20px no-repeat,
    linear-gradient(#E9E9E9, #E9E9E9) left bottom / calc(100% - 20px) 1px no-repeat,
    linear-gradient(#E9E9E9, #E9E9E9) top / 100% 1px no-repeat,
    linear-gradient(#E9E9E9, #E9E9E9) left / 1px 100% no-repeat,
    linear-gradient(#E9E9E9, #E9E9E9) top right / 1px calc(100% - 20px) no-repeat !important;
  width: 100% !important;
}

[class*="is-style-bouton-outlined-gris"] .wp-block-button__link {
  border: 1px solid transparent !important;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%) !important;
  background-image: none !important;
  white-space: nowrap !important;
  width: 100% !important;
  text-align: center !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
}

:root [class*="is-style-bouton-outlined-gris"] .wp-block-button__link:hover {
  background-color: #E9E9E9 !important;
  background-image: none !important;
  color: #000000 !important;
}

/* ============================================
   BOUTON OUTLINED NOIR avec biseau
   ============================================ */

[class*="is-style-bouton-outlined-noir"] {
  background:
    linear-gradient(to bottom right, transparent calc(50% - 0.5px), #000000 calc(50% - 0.5px), #000000 calc(50% + 0.5px), transparent calc(50% + 1px)) bottom right / 20px 20px no-repeat,
    linear-gradient(#000000, #000000) left bottom / calc(100% - 20px) 1px no-repeat,
    linear-gradient(#000000, #000000) top / 100% 1px no-repeat,
    linear-gradient(#000000, #000000) left / 1px 100% no-repeat,
    linear-gradient(#000000, #000000) top right / 1px calc(100% - 20px) no-repeat !important;
  width: 100% !important;
}

[class*="is-style-bouton-outlined-noir"] .wp-block-button__link {
  border: 1px solid transparent !important;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%) !important;
  background-image: none !important;
  white-space: normal !important;
  width: 100% !important;
  text-align: center !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
}

:root [class*="is-style-bouton-outlined-noir"] .wp-block-button__link:hover {
  background-color: #C3FC12 !important;
  background-image: none !important;
  color: #000000 !important;
  border-color: #000000 !important;
}

/* ============================================
   Boutons responsives
   ============================================ */

.wp-block-button__link {
  border-radius: 0 !important;
  white-space: nowrap !important;
}

/* ============================================
   Infos tarifs
   ============================================ */
 
.wp-block-button.is-style-infos-tarifs .wp-block-button__link {
  display: inline-flex;
  align-items: flex-start;
  gap: 12px;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  padding: 0 !important;
  cursor: default !important;
  pointer-events: none !important;
  text-decoration: none !important;
  text-transform: none !important;
  text-align: left !important;
  white-space: normal !important;
  word-break: break-word;
  width: 100%;
}
 
.wp-block-button.is-style-infos-tarifs .wp-block-button__link::before {
  content: "";
  display: inline-block;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='14' r='12.5' fill='none' stroke='%23C6F135' stroke-width='1'/%3E%3Cpath d='M8 14l4 4 8-8' fill='none' stroke='%23C6F135' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}
 
.wp-block-button.is-style-infos-tarifs .wp-block-button__link:hover,
.wp-block-button.is-style-infos-tarifs .wp-block-button__link:focus,
.wp-block-button.is-style-infos-tarifs .wp-block-button__link:active {
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
  outline: none !important;
}