/* Témoignages vérifiés : affichage (accueil, références) et page de dépôt.
   Sobre : blanc/gris, bleu pour la structure, jaune uniquement pour les étoiles. */

.mqt-section { padding-block: clamp(3rem, 6vw, 5rem); background: var(--mq-white, #fff); }
.mqt-wrap { max-width: 1200px; margin-inline: auto; padding-inline: clamp(1.2rem, 4vw, 2.5rem); }
.mqt-head { text-align: center; margin-bottom: clamp(1.6rem, 3vw, 2.4rem); }
.mqt-title { font-family: var(--mq-font-heading, sans-serif); font-weight: 800; font-size: clamp(1.7rem, 3.4vw, 2.5rem); line-height: 1.1; letter-spacing: -0.02em; color: var(--mq-black, #1b1b1b); margin: 0 0 .8rem; }

/* Sceau de note global (repère : score en gros, étoiles, nombre d'avis) */
.mqt-seal { display: inline-flex; align-items: center; gap: .9rem; padding: .7rem 1.2rem; border: 1px solid #e5ecf3; border-radius: 12px; background: var(--mq-gray-light, #f2f4f2); }
.mqt-seal__score { font-family: var(--mq-font-heading, sans-serif); font-weight: 800; font-size: 2.2rem; line-height: 1; color: var(--mq-black, #1b1b1b); }
.mqt-seal__meta { display: flex; flex-direction: column; align-items: flex-start; gap: .2rem; font-family: var(--mq-font-sub, sans-serif); font-size: .85rem; color: #44515d; text-align: left; }

/* Étoiles */
.mqt-stars { display: inline-flex; gap: 2px; }
.mqt-star svg { width: 18px; height: 18px; display: block; fill: none; stroke: #c4ccd4; stroke-width: 1.6; stroke-linejoin: round; }
.mqt-star.is-on svg { fill: var(--mq-yellow, #ffbf00); stroke: var(--mq-yellow, #ffbf00); }

/* Carrousel : défilement natif avec accroche, flèches par-dessus */
.mqt-carousel { position: relative; }
.mqt-track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 2px; padding: 2px 2px 10px; scrollbar-width: thin; }
.mqt-track:focus-visible { outline: 2px solid var(--mq-blue, #38b6ff); outline-offset: 2px; border-radius: 12px; }
.mqt-track > .mqt-card { flex: 0 0 min(100%, 380px); scroll-snap-align: start; box-sizing: border-box; }
.mqt-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 44px; height: 44px; border-radius: 50%; border: 1px solid #e5ecf3; background: #fff; color: var(--mq-black, #1b1b1b); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 14px rgba(21, 34, 47, .12); }
.mqt-nav[hidden] { display: none; }
.mqt-nav svg { width: 20px; height: 20px; }
.mqt-nav:hover { border-color: var(--mq-blue, #38b6ff); color: var(--mq-blue-dark, #1e93dc); }
.mqt-nav--prev { left: -8px; }
.mqt-nav--next { right: -8px; }

.mqt-card { margin: 0; padding: 1.4rem; background: #fff; border: 1px solid #e5ecf3; border-radius: 12px; display: flex; flex-direction: column; gap: 1rem; }
.mqt-card__top { display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap; }
.mqt-text { margin: 0; flex: 1; }
.mqt-text p { margin: 0; font-size: 1rem; line-height: 1.6; color: var(--mq-black, #1b1b1b); }
.mqt-video { width: 100%; border-radius: 8px; background: #000; max-height: 320px; }
.mqt-who { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; font-family: var(--mq-font-sub, sans-serif); font-size: .9rem; }
.mqt-initials { width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(56, 182, 255, .14); color: var(--mq-blue-dark, #1e93dc); font-weight: 700; font-size: .95rem; letter-spacing: .02em; }
.mqt-photo img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; display: block; }
.mqt-who__txt { display: flex; flex-direction: column; min-width: 0; flex: 1; color: #6a7785; }
.mqt-who__txt strong { color: var(--mq-black, #1b1b1b); }
.mqt-projet { font-size: .8rem; }
.mqt-preuve { font-size: .82rem; color: var(--mq-blue-dark, #1e93dc); text-decoration: underline; min-height: 44px; display: inline-flex; align-items: center; }

/* Badge : <details> pour fonctionner au toucher, sans survol */
.mqt-verif { position: relative; }
.mqt-verif summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .3rem; font-family: var(--mq-font-sub, sans-serif); font-size: .78rem; font-weight: 600; color: var(--mq-blue-dark, #1e93dc); min-height: 32px; }
.mqt-verif summary::-webkit-details-marker { display: none; }
.mqt-verif summary svg { width: 16px; height: 16px; }
.mqt-verif p { position: absolute; right: 0; z-index: 5; width: min(260px, 70vw); margin: .3rem 0 0; padding: .7rem .8rem; background: #fff; border: 1px solid #e5ecf3; border-radius: 8px; box-shadow: 0 6px 20px rgba(21, 34, 47, .12); font-size: .82rem; line-height: 1.45; color: #44515d; font-weight: 400; }
.mqt-method { margin: 1.4rem 0 0; text-align: center; font-size: .85rem; color: #6a7785; }

/* Page de dépôt */
.mqt-formsec { padding-block: clamp(2rem, 5vw, 4rem); background: var(--mq-gray-light, #f2f4f2); }
.mqt-formwrap { max-width: 560px; margin-inline: auto; padding: clamp(1.4rem, 4vw, 2.2rem); background: #fff; border-radius: 12px; border: 1px solid #e5ecf3; }
.mqt-formwrap h1 { font-family: var(--mq-font-heading, sans-serif); font-weight: 800; font-size: clamp(1.5rem, 4vw, 2rem); margin: 0 0 .6rem; color: var(--mq-black, #1b1b1b); }
.mqt-lead { margin: 0 0 1.4rem; color: #44515d; }
.mqt-error { margin: 0 0 1rem; padding: .7rem .9rem; border-left: 3px solid var(--mq-red, #d62424); background: #fdf2f2; color: #7a1414; font-size: .92rem; }
.mqt-form { display: flex; flex-direction: column; gap: 1.1rem; }
.mqt-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mqt-field { margin: 0; display: flex; flex-direction: column; gap: .35rem; }
.mqt-field label, .mqt-rate legend { font-weight: 600; font-size: .92rem; color: var(--mq-black, #1b1b1b); }
.mqt-field label span, .mqt-more summary span { font-weight: 400; color: #6a7785; }
.mqt-field input[type="text"], .mqt-field textarea { width: 100%; padding: .7rem .8rem; font: inherit; font-size: 1rem; border: 1px solid #cdd6df; border-radius: 8px; background: #fff; box-sizing: border-box; }
.mqt-field input[type="file"] { font-size: .9rem; max-width: 100%; }
.mqt-field small { color: #6a7785; }
.mqt-field input:focus, .mqt-field textarea:focus { outline: 2px solid var(--mq-blue, #38b6ff); outline-offset: 1px; }

/* Note : étoiles en ligne inversée pour colorier celles de gauche (survol et sélection) */
.mqt-rate { border: 0; margin: 0; padding: 0; }
.mqt-rate__row { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: 4px; margin-top: .4rem; }
.mqt-rate input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mqt-rate label { cursor: pointer; display: inline-flex; padding: 6px; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; box-sizing: border-box; }
.mqt-rate label svg { width: 34px; height: 34px; fill: none; stroke: #c4ccd4; stroke-width: 1.5; stroke-linejoin: round; transition: fill .15s, stroke .15s; }
.mqt-rate input:checked ~ label svg,
.mqt-rate label:hover svg,
.mqt-rate label:hover ~ label svg { fill: var(--mq-yellow, #ffbf00); stroke: var(--mq-yellow, #ffbf00); }
.mqt-rate input:focus-visible + label { outline: 2px solid var(--mq-blue, #38b6ff); border-radius: 8px; }

.mqt-more { border: 1px dashed #cdd6df; border-radius: 8px; padding: .2rem .9rem; }
.mqt-more summary { cursor: pointer; padding: .7rem 0; font-weight: 600; font-size: .92rem; min-height: 44px; box-sizing: border-box; }
.mqt-more[open] { padding-bottom: .9rem; }
.mqt-more .mqt-field + .mqt-field { margin-top: 1rem; }

.mqt-consent { margin: 0; font-size: .88rem; color: #44515d; }
.mqt-consent label { display: flex; gap: .6rem; align-items: flex-start; }
.mqt-consent input { margin-top: .2rem; width: 20px; height: 20px; flex: none; }

.mqt-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .8rem 1.6rem; font: inherit; font-weight: 700; color: #fff; background: var(--mq-blue-dark, #1e93dc); border: 0; border-radius: 8px; cursor: pointer; text-decoration: none; }
.mqt-btn:hover { background: var(--mq-blue, #38b6ff); color: #fff; }
.mqt-done p { color: #44515d; margin-bottom: 1.4rem; }

.mqt-choice { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.mqt-choice legend { font-weight: 600; font-size: .92rem; margin-bottom: .3rem; padding: 0; }
.mqt-choice label { display: flex; align-items: center; gap: .6rem; min-height: 44px; font-size: .92rem; color: #44515d; }
.mqt-choice input { width: 20px; height: 20px; flex: none; }

/* Produit ou service obtenu */
.mqt-tag { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-family: var(--mq-font-sub, sans-serif); font-size: .8rem; }
.mqt-tag__kind { padding: .15rem .5rem; border-radius: 999px; background: rgba(56, 182, 255, .14); color: var(--mq-blue-dark, #1e93dc); font-weight: 700; letter-spacing: .02em; }
.mqt-tag__name { font-weight: 600; color: var(--mq-black, #1b1b1b); }
.mqt-obtained { padding: .7rem .9rem; background: var(--mq-gray-light, #f2f4f2); border-radius: 8px; }
.mqt-obtained__label { font-size: .8rem; color: #6a7785; }
.mqt-obtained strong { font-size: 1rem; color: var(--mq-black, #1b1b1b); }

/* Page « Tous les avis » */
.mqt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 1.2rem; }
.mqt-filters { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-bottom: 1.6rem; }
.mqt-filter { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .4rem 1rem; border: 1px solid #e5ecf3; border-radius: 999px; font-family: var(--mq-font-sub, sans-serif); font-weight: 600; font-size: .9rem; color: #44515d; text-decoration: none; background: #fff; }
.mqt-filter span { font-weight: 500; color: #6a7785; }
.mqt-filter:hover { border-color: var(--mq-blue, #38b6ff); }
.mqt-filter.is-on { background: var(--mq-black, #1b1b1b); border-color: var(--mq-black, #1b1b1b); color: #fff; }
.mqt-filter.is-on span { color: rgba(255, 255, 255, .75); }
.mqt-all { text-align: center; margin: 1.6rem 0 0; }
.mqt-btn--line { background: #fff; color: var(--mq-blue-dark, #1e93dc); border: 1px solid var(--mq-blue-dark, #1e93dc); }
.mqt-btn--line:hover { background: var(--mq-blue-dark, #1e93dc); color: #fff; }

/* Photos jointes à l'avis */
.mqt-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 6px; }
.mqt-gallery a { display: block; border-radius: 8px; overflow: hidden; background: #f2f4f2; aspect-ratio: 4 / 3; }
.mqt-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.mqt-gallery a:hover img { transform: scale(1.04); }
