.cq-chat { max-width: 552px; margin: 0 auto; background: #F5F0E8; border-radius: 20px; overflow: hidden; display: flex; flex-direction: column; min-height: 540px; }
.cq-chat-tete { display: flex; align-items: center; gap: 10px; padding: 14px 16px; background: #EFE7DA; }
.cq-ava { width: 38px; height: 38px; border-radius: 50%; background: #D6A24E; color: #16263F; display: flex; align-items: center; justify-content: center; font-weight: 500; font-size: 16px; }
.cq-tete-id { flex: 1; }
.cq-tete-nom { font-size: 15px; font-weight: 500; line-height: 1.1; }
.cq-tete-role { font-size: 12px; color: #8B8A86; }
.cq-tete-eco { text-align: right; }
.cq-eco-label { font-size: 11px; color: #8B8A86; }
.cq-eco-val { font-size: 17px; font-weight: 500; color: #16263F; }
.cq-progress { height: 5px; background: #D8CDBA; }
.cq-progress-barre { height: 100%; width: 0; background: #D6A24E; transition: width 0.3s ease; }
.cq-fil { flex: 1; padding: 16px; display: flex; flex-direction: column; gap: 10px; overflow-y: auto; max-height: 52vh; }
.cq-bulle { max-width: 85%; padding: 10px 14px; font-size: 14px; line-height: 1.45; }
.cq-bulle-lea { align-self: flex-start; background: #fff; border-radius: 16px 16px 16px 4px; }
.cq-bulle-user { align-self: flex-end; background: #16263F; color: #fff; border-radius: 16px 16px 4px 16px; }
.cq-typing span { display: inline-block; width: 6px; height: 6px; margin: 0 1px; border-radius: 50%; background: #8B8A86; animation: cq-blink 1s infinite; }
.cq-typing span:nth-child(2) { animation-delay: 0.2s; }
.cq-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes cq-blink { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }
.cq-saisie { padding: 12px 16px; border-top: 1px solid #E7DDCB; display: flex; flex-direction: column; gap: 10px; }
.cq-btn { background: #D6A24E; color: #16263F; border: none; border-radius: 999px; padding: 12px 18px; font-size: 15px; font-weight: 500; cursor: pointer; text-align: center; }
.cq-btn-cta { display: block; text-decoration: none; }
.cq-btn-ghost { background: transparent; border: 1px solid #D6A24E; }
input[type=range] { width: 100%; accent-color: #D6A24E; }
/* Bloc de saisie : contrôle + bouton « Continuer » empilés. */
.cq-bloc-controle { display: flex; flex-direction: column; gap: 10px; }
.cq-sous-q { font-size: 13px; color: #8B8A86; font-weight: 400; margin-top: 4px; }
/* Stepper « − [champ] + » (nombre de logements, quantités). */
.cq-stepper { display: flex; align-items: center; justify-content: center; gap: 10px; }
.cq-step-btn { flex: none; width: 44px; height: 44px; border-radius: 50%; border: 1px solid #D6A24E; background: #fff; color: #16263F; font-size: 22px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cq-step-btn:disabled { opacity: 0.4; cursor: default; }
.cq-step-champ { width: 84px; text-align: center; padding: 10px 8px; border: 1px solid #D8CDBA; border-radius: 10px; font-size: 20px; font-weight: 500; color: #16263F; background: #fff; -moz-appearance: textfield; appearance: textfield; }
.cq-step-champ::-webkit-outer-spin-button, .cq-step-champ::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cq-step-suffixe { font-size: 14px; color: #8B8A86; }
/* Cases à cocher (multi-sélection explicite, aucune pré-cochée). */
.cq-cases { display: flex; flex-direction: column; gap: 8px; }
.cq-case { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 12px 14px; border: 1px solid #D8CDBA; border-radius: 12px; background: #fff; color: #16263F; font-size: 14px; cursor: pointer; }
.cq-case-box { box-sizing: border-box; flex: none; width: 22px; height: 22px; border-radius: 6px; border: 2px solid #C9BEA8; background: #fff; position: relative; transition: background .15s ease, border-color .15s ease; }
.cq-case-lib { flex: 1; }
.cq-case-on { border-color: #D6A24E; background: #FBF4E7; }
.cq-case-on .cq-case-box { background: #D6A24E; border-color: #D6A24E; }
.cq-case-on .cq-case-box::after { content: ''; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px; border: solid #16263F; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.cq-champ-montant { display: flex; align-items: center; gap: 6px; justify-content: center; font-size: 16px; }
.cq-champ-montant input { width: 130px; text-align: right; padding: 8px 10px; border: 1px solid #D8CDBA; border-radius: 8px; font-size: 15px; color: #16263F; }
.cq-qte-hint { font-size: 12px; color: #8B8A86; text-align: center; }
.cq-revel { text-align: center; }
.cq-revel-titre { font-size: 14px; color: #8B8A86; }
.cq-revel-num { font-size: 38px; font-weight: 500; color: #16263F; margin: 4px 0; }
.cq-revel-sous { font-size: 14px; line-height: 1.45; }
.cq-conv { display: flex; flex-direction: column; gap: 10px; }
.cq-form-rappel { display: flex; flex-direction: column; gap: 8px; }
.cq-form-rappel input, .cq-form-rappel select { padding: 10px 12px; border: 1px solid #D8CDBA; border-radius: 8px; font-size: 14px; color: #16263F; background: #fff; }
.cq-erreur { color: #A32D2D; font-size: 13px; }
.cq-liens { display: flex; gap: 18px; justify-content: center; padding: 4px 0 12px; }
.cq-lien-classique { background: none; border: none; color: #8B8A86; font-size: 13px; text-decoration: underline; cursor: pointer; padding: 6px; }
@media (prefers-reduced-motion: reduce) { .cq-progress-barre { transition: none; } .cq-typing span { animation: none; } }
@media (max-width: 480px) { .cq-chat { border-radius: 0; min-height: 100vh; } .cq-fil { max-height: none; } }
.cq-ask { display: flex; gap: 8px; margin-top: 6px; }
.cq-ask input { flex: 1; padding: 10px 12px; border: 1px solid #D8CDBA; border-radius: 999px; font-size: 14px; color: #16263F; background: #fff; }
.cq-ask .cq-btn { margin-top: 0; padding: 10px 16px; }