/* Le Comptoir — boutique de Nimoria Apocalypse (05/10/2026). Chargée APRÈS tole-20260921c.css. */

.bq-page code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .88em; padding: .05rem .35rem; background: rgba(0, 0, 0, .45); color: #f2e6c4; border-radius: 2px; }

/* bandeau d'annonce (retour de PayPal) */
.bq-annonce { margin: 0 0 1.5rem; padding: 1rem 1.2rem; max-width: 46rem; color: #26221b; background: linear-gradient(176deg, var(--papier), var(--papier-ombre)); box-shadow: 4px 5px 0 rgba(0, 0, 0, .4); border-left: 8px solid var(--rubalise); }
.bq-annonce.bq-ok { border-left-color: #3f7d3a; }
.bq-annonce.bq-ko { border-left-color: var(--punaise); }
.bq-annonce strong { font-family: var(--pochoir); font-size: 1.25rem; letter-spacing: .03em; display: block; margin-bottom: .2rem; }
.bq-annonce p { margin: .2rem 0 0; }

/* étape 1 : le pseudo */
.bq-pseudo { padding: 1.4rem 1.6rem 1.2rem; max-width: 46rem; color: #e6e0cf; }
.bq-etape { display: flex; align-items: center; gap: .7rem; margin: 0 0 .4rem; font-family: var(--pochoir); font-weight: 800; font-size: 1.6rem; letter-spacing: .03em; text-transform: uppercase; color: #ece4d0; }
.bq-etape span { display: inline-grid; place-items: center; width: 2rem; height: 2rem; color: #17150f; background: var(--rubalise); border: 2px solid #3a2c04; font-size: 1.2rem; }
.bq-aide { margin: 0 0 1rem; color: rgba(236, 228, 210, .72); font-size: .95rem; }
.bq-pseudo-form { display: flex; flex-wrap: wrap; gap: .7rem; }
.bq-pseudo-form input {
  flex: 1 1 14rem; min-width: 0; min-height: 3rem; padding: .4rem .9rem;
  font: 600 1.15rem "Public Sans", sans-serif; color: #26221b;
  background: linear-gradient(176deg, #efe6cf, #d9cca9); border: 2px solid #0f110d; border-radius: 0;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, .25);
}
.bq-pseudo-form input:focus-visible { outline: 3px solid var(--rubalise); outline-offset: 2px; }
.bq-pseudo-form .bouton-tole { flex: 0 0 auto; }
.bq-verdict { min-height: 1.5rem; margin: .8rem 0 0; font-weight: 600; }
.bq-verdict.bq-ok { color: #9ccc65; }
.bq-verdict.bq-ko { color: #ff8a7a; }

/* les fiches d'articles : papier punaisé, comme les contrats du Registre */
.bq-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1.8rem 1.4rem; }
.bq-fiche {
  position: relative; display: flex; flex-direction: column; gap: .7rem;
  padding: 1.5rem 1.2rem 1.2rem; color: #26221b;
  background: linear-gradient(174deg, var(--papier), var(--papier-ombre));
  box-shadow: 5px 7px 0 rgba(0, 0, 0, .35), 0 14px 24px rgba(0, 0, 0, .3);
}
.bq-fiche:nth-child(odd) { transform: rotate(-.6deg); }
.bq-fiche:nth-child(even) { transform: rotate(.5deg); }
.bq-fiche:nth-child(3n+2) { background: var(--sang-eclat) no-repeat right -2rem bottom -2rem / 7rem 7rem, linear-gradient(174deg, var(--papier), var(--papier-ombre)); }
.bq-fiche::before {
  content: ""; position: absolute; top: -.5rem; left: 50%; transform: translateX(-50%);
  width: 1.05rem; height: 1.05rem; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ef5a4c, #7c1410 70%); box-shadow: 0 3px 5px rgba(0, 0, 0, .5);
}
.bq-nom { margin: 0; font-family: var(--pochoir); font-weight: 800; font-size: 1.55rem; line-height: 1.05; letter-spacing: .02em; }
.bq-texte { margin: 0; font-family: var(--feutre); font-size: 1rem; color: #4a4030; }
.bq-pied { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: auto; }
.bq-prix { font-family: var(--pochoir); font-weight: 800; font-size: 1.7rem; color: #8c1410; white-space: nowrap; }
.bq-fiche .bouton-tole { min-height: 2.6rem; font-size: 1.1rem; padding-right: 2.2rem; }

/* l'aperçu du chat : un bout d'écran de jeu collé sur la fiche */
.bq-chat {
  margin: 0; padding: .55rem .7rem; overflow-wrap: anywhere;
  font: 600 .95rem/1.35 "Public Sans", sans-serif; color: #bdbdbd;
  background: rgba(10, 10, 10, .82); border: 1px solid #000; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .05);
}
.bq-chat .bq-grade { display: inline-block; padding: 0 .35rem; margin-right: .3rem; font-family: var(--pochoir); font-size: .8rem; letter-spacing: .05em; color: #17150f; background: #9ccc65; vertical-align: 1px; }
.bq-chat .bq-crochet { color: #555; }
.bq-chat .bq-titre { font-style: italic; -webkit-background-clip: text; background-clip: text; color: transparent; }
.bq-chat .bq-joueur { color: #c5e1a5; }
.bq-chat .bq-fleche { color: #8c1410; }

/* tag perso : une fiche plus large avec un essai en direct */
.bq-perso .bq-fiche { max-width: 46rem; transform: rotate(-.4deg); }
.bq-essai { display: flex; flex-direction: column; gap: .3rem; font-weight: 600; font-size: .9rem; color: #4a4030; }
.bq-essai input { min-height: 2.6rem; padding: .3rem .7rem; font: 600 1.05rem "Public Sans", sans-serif; color: #26221b; background: #f5eedb; border: 2px solid #5a5040; border-radius: 0; }
.bq-essai input:focus-visible { outline: 3px solid var(--rubalise); outline-offset: 1px; }
.bq-essai small { font-weight: 500; color: #6a5d45; }

/* dons : des boutons de tôle */
.bq-dons { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: 1rem; }
.bq-dons .bouton-tole { min-height: 4rem; }
.bq-dons .bouton-tole strong { font-size: 1.7rem; }

/* règles sur papier */
.bq-papier { max-width: 46rem; padding: 1.2rem 1.4rem; color: #26221b; background: linear-gradient(176deg, var(--papier), var(--papier-ombre)); box-shadow: 4px 5px 0 rgba(0, 0, 0, .4); }
.bq-papier ul { margin: 0; padding-left: 1.2rem; }
.bq-papier li { margin: .45rem 0; }

/* fenêtre de confirmation */
.bq-confirmer { width: min(34rem, calc(100vw - 2rem)); padding: 1.5rem 1.5rem 1.3rem; color: #e6e0cf; }
.bq-confirmer::backdrop { background: rgba(8, 7, 5, .78); }
.bq-recap { margin: .4rem 0 1rem; font-size: 1.05rem; }
.bq-recap strong { color: var(--rubalise); }
.bq-case { display: flex; gap: .7rem; align-items: flex-start; font-size: .92rem; color: rgba(236, 228, 210, .85); cursor: pointer; }
.bq-case input { flex: none; width: 1.3rem; height: 1.3rem; margin-top: .1rem; accent-color: var(--rubalise); }
.bq-erreur { min-height: 1.3rem; margin: .7rem 0 0; color: #ff8a7a; font-weight: 600; }
.bq-boutons { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .7rem; margin-top: .6rem; }
.bq-boutons .bouton-tole { min-height: 2.8rem; font-size: 1.1rem; }

/* un achat n'est possible qu'avec un pseudo vérifié */
.bq-page[data-pseudo="non"] .bq-acheter { opacity: .55; }

@media (max-width: 34rem) {
  .bq-pseudo { padding: 1.2rem 1rem 1rem; }
  .bq-pied { flex-wrap: wrap; }
  .bq-fiche:nth-child(n) { transform: none; }
}
