/* Fenêtre « Rédiger un avis » : reproduction de la fenêtre Ryviu de la boutique Shopify (inc/review-form.php).
   Valeurs des feuilles Ryviu (r.81f1d1, r.384c63, r.c3f27b, r.144ac2) et de vue-js-modal, vérifiées sur maison-maryjane.com à 1280px et 375px.
   Les règles du thème parent (boutons, champs, paragraphes, titres) sont neutralisées dans .mmj-rvf. */

.mmj-rvf[hidden], .mmj-rvf [hidden] { display: none !important; }
html.mmj-rvf-lock, html.mmj-rvf-lock body { overflow: hidden !important; height: auto; }

/* Fond noir 80 % (fondu 0,2 s) ; fenêtre : fondu et glissement de 20px (0,4 s) */
.mmj-rvf .v--modal-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2147483647; box-sizing: border-box; background-color: rgba(0, 0, 0, 0.8); opacity: 0; transition: opacity .2s; }
.mmj-rvf.is-open .v--modal-overlay { opacity: 1; }
.mmj-rvf .v--modal-background-click { display: flex; align-items: center; width: 100%; height: 100%; }
.mmj-rvf .v--modal-box { position: relative; box-sizing: border-box; display: flex; justify-content: center; width: 85%; max-width: 824px; min-height: 300px; max-height: 90%; margin: auto; padding: 0; overflow: visible; border-radius: 20px; background: #fff; color: #333; font-size: 14px; line-height: 1.5; text-align: left; box-shadow: 0 0 30px 3px rgba(0, 0, 0, 0.08); scroll-behavior: smooth; opacity: 0; transform: translateY(-20px); transition: opacity .4s, transform .4s; }
.mmj-rvf.is-open .v--modal-box { opacity: 1; transform: none; }
.mmj-rvf .v--modal-box.r--modal-mobile { width: 100%; max-width: 100%; height: 100%; min-height: 100%; max-height: 100%; border-radius: 0; }
.mmj-rvf .r--write-review * { box-sizing: border-box; word-wrap: break-word; }

/* Utilitaires Ryviu (piles flex) */
.mmj-rvf .Ryfl { float: left; width: 100%; }
.mmj-rvf .Ryviu-BlockStack, .mmj-rvf .Stack-Flex-Start, .mmj-rvf .Ryviu-Stack-Row { display: flex; flex-direction: column; column-gap: normal; justify-content: flex-start; align-items: center; }
.mmj-rvf .Stack-Justify-Center { justify-content: center; }
.mmj-rvf .Ryviu-Stack-Row { flex-direction: row; }
.mmj-rvf .Stack-Flex-Start { align-items: flex-start; }
.mmj-rvf .Ryviu-Space-Between { justify-content: space-between; }
.mmj-rvf .Ry-Gap-8 { gap: 8px; }
.mmj-rvf .Ry-Gap-10 { gap: 10px; }
.mmj-rvf .Ry-Gap-15 { gap: 15px; }
.mmj-rvf .Ry-Gap-16 { gap: 16px; }
.mmj-rvf .Ry-Gap-20 { gap: 20px; }
.mmj-rvf .Ry-Gap-29 { gap: 29px; }
.mmj-rvf .Ry-Gap-40 { gap: 40px; }

/* Structure : marges 20px haut et bas, contenu 16/60/45 (plein écran : 0/20/20) */
.mmj-rvf .Ry-Write-Form { float: left; width: 100%; padding: 20px 0; }
.mmj-rvf .r--write-wrapper { position: relative; float: left; width: 100%; height: 100%; padding: 16px 60px 45px; overflow-y: auto; }
.mmj-rvf .r--modal-mobile .r--write-wrapper { padding: 0 20px 20px; }
.mmj-rvf .r--write-top { float: left; width: 100%; padding: 0; }
.mmj-rvf .r--title-form { position: relative; float: left; width: 100%; min-height: 15px; margin: 0 0 24px; text-align: center; }
.mmj-rvf .r--title-form > span { color: #333; font-size: 1.3333em; font-weight: 700; }
.mmj-rvf .r--title-form > .Ry-Single-Title { display: block; float: none; font-size: 20px; font-weight: 600; }

/* Boutons icônes : retour, croix (dans l'en-tête en plein écran, blanche au-dessus de la fenêtre sinon) */
.mmj-rvf .Ry-Icon-Button { display: flex; margin: 0; padding: 0; border: none; border-radius: 8px; background: none; box-shadow: none; color: #333; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1; text-transform: none; cursor: pointer; transition: none; -webkit-user-select: none; user-select: none; }
.mmj-rvf .Ry-Icon-Button.Ry-Icon-Big { width: 30px; height: 30px; align-items: center; justify-content: center; }
.mmj-rvf .Ry-Icon-Button:not(.r--close):hover { background-color: #d4d4d4; color: #333; box-shadow: none; }
.mmj-rvf .Ry-Back-Mobile-Form, .mmj-rvf .Ry-Close-Mobile-Form { width: 30px; }
.mmj-rvf .Ry-Close-Mobile-Form .Ry-Icon-Button { display: none; }
.mmj-rvf .r--modal-mobile .Ry-Close-Mobile-Form { text-align: right; }
.mmj-rvf .r--modal-mobile .Ry-Close-Mobile-Form .Ry-Icon-Button { display: inline-block; }
.mmj-rvf .Ry-Icon-Button.r--close { position: absolute; top: -14px; right: -32px; display: block !important; padding: 0; }
.mmj-rvf .Ry-Icon-Button.r--close:hover { background: none; box-shadow: none; }
@media only screen and (max-width: 1000px) {
	.mmj-rvf .Ry-Icon-Button.r--close { top: -35px; right: 0; }
}
.mmj-rvf .r--modal-mobile .Ry-Icon-Button.r--close { position: fixed; }
.mmj-rvf [class^="r-icon--"]:empty, .mmj-rvf [class*=" r-icon--"]:empty { display: inline-block; }
.mmj-rvf .r-icon--arrowleft, .mmj-rvf .r-icon--alert, .mmj-rvf .r-icon--x { font-size: 20px; }
.mmj-rvf .Ry-Icon-Big .r-icon--arrowleft:not(.r-small), .mmj-rvf .Ry-Icon-Big .r-icon--x:not(.r-small) { font-size: 30px; }
.mmj-rvf .Ry-Icon-While .r-icon--x { color: #fff; }
.mmj-rvf .r-icon--alert:before { content: "\e803"; }

/* Produit : vignette 40px, nom */
.mmj-rvf .Ryviu-Product-Info-Wrapper { padding: 10px; border-radius: 10px; background: #f6f6f6; }
.mmj-rvf .Ryviu-Image-Info { position: relative; flex: 0 0 40px; width: 40px; height: 40px; }
.mmj-rvf .Ryviu-Image-Info img { width: auto; height: 40px; border-radius: 5px; }
.mmj-rvf .r--center-middle { position: absolute; top: 50%; left: 50%; float: left; max-width: 100%; max-height: 100%; transform: translate(-50%, -50%); will-change: transform; }
.mmj-rvf .r--info-product p { margin: 0; padding: 0; color: #1a1a1a; font-size: 14px; line-height: 1.5; }

/* Formulaire */
.mmj-rvf .r--form-write { display: inline-block; width: 100%; margin: 0; }
.mmj-rvf p.r--notice-required-form { display: flex; align-items: center; gap: 4px; width: 100%; margin: 0; padding: 4px 8px; background: #ffd0d0; font-size: 14px; line-height: 1.5; }
.mmj-rvf p.r--notice-required-form * { color: #c63b3b; }
.mmj-rvf .Ryviu-Warning-Form { margin-top: 10px; }
.mmj-rvf .Ryviu-Warning-Form p { margin: 0; color: #db2020; }
.mmj-rvf .r--write-input { float: left; width: 100%; margin: 0; }
.mmj-rvf .r--write-input label { display: inline-block; margin: 0 0 12px; padding: 0; color: #333; font-size: 15px; font-style: normal; font-weight: 500; line-height: normal; }
.mmj-rvf .r--input { position: relative; float: left; width: 100%; }
.mmj-rvf .r--write-input input[type="text"], .mmj-rvf .r--write-input input[type="email"], .mmj-rvf .r--write-input textarea { display: inline-block; width: 100%; max-width: none; height: auto; min-height: 0; margin: 0; padding: 16px; border: 1px solid #e4e4e4; border-radius: 10px; background: none; box-shadow: none; outline: none; color: #333; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1.5; -webkit-appearance: none; appearance: none; }
.mmj-rvf .r--write-input textarea { display: block; height: 209px; line-height: 1.4; resize: none; }
.mmj-rvf .r--write-review input::placeholder, .mmj-rvf .r--write-review textarea::placeholder { color: #333; opacity: .3; }
@media only screen and (max-width: 768px) {
	.mmj-rvf .r--write-input input[type="text"], .mmj-rvf .r--write-input input[type="email"], .mmj-rvf .r--write-input textarea { font-size: 16px; -webkit-text-size-adjust: 100%; }
}
.mmj-rvf .Ry-Warning label { color: #c63b3b !important; }
.mmj-rvf .Ry-Warning input { border: 1px solid #c63b3b !important; outline: 1px solid #c63b3b !important; }

/* Note : 5 étoiles de 25px espacées de 4px, grises #d3d3d0, jaunes #fdbc00 une fois choisies */
.mmj-rvf .r--rate-review { margin: 0 !important; }
.mmj-rvf .r--stars-item { position: relative; display: inline-block; width: 141px; text-align: left; }
.mmj-rvf .r--stars-icon { float: left; width: 25px; margin-right: 4px; color: #fdbc00; font-size: 25px; line-height: 1; cursor: pointer; }
.mmj-rvf .r--stars-icon.r-stbk { color: #d3d3d0; }
.mmj-rvf .r--stars-item em:last-child { margin-right: 0; }

/* Photos */
.mmj-rvf .r--write-img { position: relative; float: left; padding: 0; border: 1px solid #e1e1e1; }
.mmj-rvf .r--write-img:hover { background-color: #f6f6f6; }
.mmj-rvf .r--write-img label { display: flex; margin: 0; padding: 6px 20px; color: #333; font-size: 14px; font-weight: 500; line-height: 1.5; cursor: pointer; }
.mmj-rvf .r--write-img input { display: none; }
.mmj-rvf .r--images-uploaded { float: left; width: 100%; margin: 22px 0 0; }
.mmj-rvf .r--images-uploaded .r--img { position: relative; display: inline-block; width: 74px; height: 74px; margin-right: 8px; border: 1px solid #ddd; border-radius: 5px; background: #000; }
.mmj-rvf .r--images-uploaded .r--image-uploaded { display: inline-block; width: 100%; height: 100%; max-width: none; object-fit: contain; object-position: center; background: #0b0b0b; color: transparent; }
.mmj-rvf .r--close-img { position: absolute; top: -8px; right: -8px; z-index: 999; display: inline-block; width: 20px; height: 20px; min-height: 0; margin: 0; padding: 0; border: none; border-radius: 20px; background: rgba(99, 99, 99, 0.5); box-shadow: none; cursor: pointer; transition: all .4s ease; }
.mmj-rvf .r--close-img:hover { background: rgba(99, 99, 99, 0.5); box-shadow: none; transform: scale(1.2); }
.mmj-rvf .r--images-uploaded i.r--icon-close-img:before { content: ""; display: block; width: 20px; height: 21px; background: url("../images/ryviu/img-close.svg") no-repeat; }

/* Bouton jaune pleine largeur (Next / Soumettez votre commentaire), foncé de 10 % au survol */
.mmj-rvf .r--write-submit { float: left; width: 100%; margin: 0; }
.mmj-rvf .r--button { position: relative; display: inline-block; min-height: 36px; margin: 0; overflow: hidden; border-radius: 5px; cursor: pointer; transition: all .3s ease; -webkit-user-select: none; user-select: none; }
.mmj-rvf .r--submit-form { float: left; padding: 8px 20px; border: 1px solid transparent; background: #ffb102; box-shadow: none; color: #333; font-family: inherit; font-size: 14px; font-weight: 400; line-height: 1; text-transform: none; }
.mmj-rvf .r--write-submit .r--button { width: 100%; margin: 0 !important; padding: 12px 20px; text-align: center; }
.mmj-rvf .r--submit-form:hover { background: #e59700; box-shadow: none; color: #333; }
.mmj-rvf .r--submit-form span { color: #fff; font-weight: 500; }

/* Après l'envoi : illustration Ryviu centrée, titre du thème (Abril Fatface 58/60 × 48 dès 1024px, 38/60 × 48 en dessous) */
.mmj-rvf .r--write-wrapper.success { min-height: 500px; padding: 200px 20px; text-align: center; background-image: url("../images/ryviu/success-write.png"); background-repeat: no-repeat; background-position: center; }
.mmj-rvf .r--modal-mobile .r--write-wrapper.success { padding: 0 20px 20px; }
.mmj-rvf .r--write-wrapper.success h1 { margin: 0 0 15px; padding: 0; color: #333; font-family: "Abril Fatface", serif; font-size: 46.4px; font-style: normal; font-weight: 400; line-height: 1.6; letter-spacing: normal; text-transform: none; }
.mmj-rvf .r--write-wrapper.success p { margin: 0; padding: 0; color: #333; font-size: 14px; line-height: 1.5; }
@media screen and (max-width: 1023px) {
	.mmj-rvf .r--write-wrapper.success h1 { font-size: 30.4px; }
}
.mmj-rvf .Close-Step-Thank { position: absolute; top: 0; right: 10px; }
@media only screen and (min-width: 616px) {
	.mmj-rvf .Ry-Icon-Button.Close-Step-Thank { display: none; }
}