/* Kiosko Additional - Frontend */

.wp-block-woocommerce-customer-account[data-display-style="icon_only"] svg.icon{
  width: 1em;
  height: 1em;
}
.img-thumbnail {
  --c: #8a9b0f; /* couleur de la bordure */
  --b: 10px; /* épaisseur de la bordure */
  --g: 5px; /* espace au hover */

  padding: calc(var(--g) + var(--b));
  --_g: #0000 25%, var(--c) 0;
  
  background: conic-gradient(
    from 180deg at top var(--b) right var(--b),
    var(--_g)
  )
  var(--_i, 200%) 0 / 200% var(--i, var(--b)) no-repeat,
  conic-gradient(at bottom var(--b) left var(--b), var(--_g)) 0
  var(--_i, 200%) / var(--i, var(--b)) 200% no-repeat;
  
  transition: 0.3s, background-position 0.3s 0.3s;
  cursor: pointer;
}

.img-thumbnail:hover {
  --_i: 100%;
  transition: 0.3s, background-size 0.3s 0.3s;
}

.modal {
  display: none;
}

.modal.is-open {
  display: block;
}

.modal__overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.modal__container {
  background: #fff;
  max-width: 600px;
  width: 90%;
  padding: 1.5rem;
  border-radius: .5rem;
}

.modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal__close {
  background: none;
  border: 0;
  font-size: 1.5rem;
  cursor: pointer;
}

/* ===== CF7 – Style Bootstrap-like (scopé) ===== */
.wpcf7 form {
  max-width: 100%;
}


/* Labels */
.wpcf7 form label {
  display: block;
  margin-bottom: .5rem;
  font-weight: 500;
  color: #212529;
}

/* Champs texte / email / textarea */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
  display: block;
  width: 100%;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: .375rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/* Focus (Bootstrap-like) */
.wpcf7 input:focus,
.wpcf7 textarea:focus {
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}

/* Textarea */
.wpcf7 textarea {
  min-height: 120px;
  resize: vertical;
}

/* Espacement entre champs */
.wpcf7 form p {
  margin: 0;
  line-height:1;
}

/* Bouton submit – PRIMARY */
.wpcf7 input[type="submit"] {
  display: inline-block;
  padding: .5rem 1.25rem;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  color: #fff;
  background-color: #0d6efd; /* Bootstrap primary */
  border: 1px solid #0d6efd;
  border-radius: .375rem;
  cursor: pointer;
  transition: background-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/* Hover bouton */
.wpcf7 input[type="submit"]:hover {
  background-color: #0b5ed7;
  border-color: #0a58ca;
}

/* Disabled */
.wpcf7 input[type="submit"]:disabled {
  opacity: .65;
  cursor: not-allowed;
}

/* Messages CF7 */
.wpcf7-response-output {
  margin-top: 1rem;
  padding: .75rem 1rem;
  border-radius: .375rem;
  font-size: .95rem;
}

.wpcf7-mail-sent-ok {
  background: #d1e7dd;
  color: #0f5132;
  border: 1px solid #badbcc;
}

.wpcf7-validation-errors,
.wpcf7-mail-sent-ng {
  background: #f8d7da;
  color: #842029;
  border: 1px solid #f5c2c7;
}

/* Champs en erreur */
.wpcf7-not-valid {
  border-color: #dc3545 !important;
}

/* CF7 – corriger le wrapper des champs */
.wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

/* Sécurité supplémentaire */
.wpcf7-form-control {
  width: 100%;
  box-sizing: border-box;
}

/* ===== Bouton Contact – outline discret ===== */
.btn-content {
  display: inline-block;
}

.btn-contact {
  appearance: none;
  background: transparent;
  border: 1px solid rgba(13, 110, 253, 0.6); /* primary discret */
  color: #0d6efd;
  padding: .45rem 1.1rem;
  font-size: .95rem;
  font-weight: 500;
  border-radius: .375rem;
  cursor: pointer;
  transition: 
    color .15s ease-in-out,
    background-color .15s ease-in-out,
    border-color .15s ease-in-out,
    box-shadow .15s ease-in-out;
}

/* Hover élégant */
.btn-contact:hover {
  background-color: rgba(13, 110, 253, 0.08);
  border-color: #0d6efd;
  color: #0d6efd;
}

/* Focus accessible */
.btn-contact:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 .2rem rgba(13,110,253,.25);
}

/* Active (clic) */
.btn-contact:active {
  background-color: rgba(13, 110, 253, 0.15);
}

/* Variante sombre (si thème dark) */
@media (prefers-color-scheme: dark) {
  .btn-contact {
    color: #9ec5fe;
    border-color: rgba(158, 197, 254, 0.6);
  }

  .btn-contact:hover {
    background-color: rgba(158, 197, 254, 0.12);
  }
}

/* Bouton qui se comporte visuellement comme un lien */
.link-like-button {
  all: unset; /* reset total */
  cursor: pointer;
  color: inherit;
  text-decoration: none;
  font: inherit;
  display: inline;
}

/* Hover identique aux liens */
.link-like-button:hover {
  text-decoration: none;
}

/* Focus clavier (accessibilité) */
.link-like-button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

footer .btn-content {
    display: none;
}