/* AI Review Generator: customer page.
   Built to look the same on Android, iPhone (including older iOS) and desktop:
   no flex "gap", no "inset", no external fonts, explicit appearance resets. */
:root{
  --card:#fff;--card2:#fffdfa;
  --serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Noto Serif",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Noto Sans Devanagari",sans-serif;
}
*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;color:var(--ink);font:16px/1.5 var(--sans);-webkit-tap-highlight-color:transparent;
  -webkit-font-smoothing:antialiased;background-color:var(--paper);
  background-image:radial-gradient(130% 55% at 50% 0%,var(--tint) 0,var(--paper) 62%);background-repeat:no-repeat}
[hidden]{display:none!important}
button,input,textarea{font-family:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0}
button{margin:0;-webkit-tap-highlight-color:transparent}

.rg-top{height:4px;background:linear-gradient(90deg,transparent,var(--accent) 30%,var(--accent) 70%,transparent)}
.rg{width:100%;max-width:460px;margin:0 auto;padding:34px 16px 40px;padding-bottom:calc(40px + env(safe-area-inset-bottom));text-align:center}

/* Logo */
.rg-head{margin:8px 0 26px}
.rg-logo{display:block;max-width:200px;max-height:96px;width:auto;height:auto;margin:0 auto;object-fit:contain;-webkit-filter:drop-shadow(0 8px 14px rgba(0,0,0,.14));filter:drop-shadow(0 8px 14px rgba(0,0,0,.14))}
.rg-name{font:600 26px/1.15 var(--serif);margin:14px 0 0;letter-spacing:.01em;overflow-wrap:anywhere;word-wrap:break-word}
.rg-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Fixed five stars + heading */
.rg-stars{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center}
.rg-stars svg{display:block;width:21px;height:21px;margin:0 4px;fill:var(--accent)}
.rg-kicker{margin:14px 0 0;font-size:12px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;padding-left:.34em}

/* Option pills (spacing by margin so older iPhones match) */
.rg-pills{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:center;justify-content:center;margin:18px -4px 18px}
.rg-pill{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:inline-flex;margin:4px}
.rg-pill input{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.rg-pill span{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;min-height:42px;padding:0 15px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.7);font-size:12px;font-weight:600;letter-spacing:.12em;line-height:1;text-transform:uppercase;white-space:nowrap}
.rg-pill input:checked + span{background:var(--accent);border-color:var(--accent);color:var(--on-accent);-webkit-box-shadow:0 8px 16px -8px var(--accent);box-shadow:0 8px 16px -8px var(--accent)}
.rg-pill input:disabled + span{opacity:.45}
.rg-pill input:focus + span{outline:2px solid var(--ink);outline-offset:2px}

/* Review card */
.rg-card{position:relative;padding:24px 20px 40px;border-radius:30px;border:1px solid var(--line);text-align:left;
  background:#fffefc;background-image:linear-gradient(180deg,var(--card),var(--card2));
  -webkit-box-shadow:0 22px 40px -26px var(--accent);box-shadow:0 22px 40px -26px var(--accent)}
.rg-card::before{content:"";position:absolute;top:-1px;left:16%;right:16%;height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,var(--accent),transparent)}
.rg-corner{position:absolute;width:18px;height:18px;border:0 solid var(--tint2);pointer-events:none}
.rg-corner-tr{top:10px;right:12px;border-top-width:2px;border-right-width:2px}
.rg-corner-bl{bottom:10px;left:12px;border-bottom-width:2px;border-left-width:2px}
.rg-card-title{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;margin:0 0 16px;font:600 11px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase}
.rg-card-title::before,.rg-card-title::after{content:"";-webkit-box-flex:1;-webkit-flex:1 1 0;flex:1 1 0;height:1px;background:var(--line)}
.rg-card-title::before{margin-right:14px}
.rg-card-title::after{margin-left:calc(14px - .34em)}

.rg-langs{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;margin:0 0 10px}
.rg-lang{margin:0 4px 6px;font-size:13px;font-weight:600;letter-spacing:.08em;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer}
.rg-lang.on{background:var(--tint);border-color:var(--accent);color:var(--ink)}

#rg-text{display:block;width:100%;min-height:128px;margin:0;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ink);
  font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.75;resize:none;overflow:hidden;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:opacity .2s;transition:opacity .2s}
#rg-text::-webkit-input-placeholder{color:var(--muted);opacity:.7}
#rg-text::placeholder{color:var(--muted);opacity:.7}
#rg-text:focus{outline:2px solid var(--tint2);outline-offset:6px}
.rg-card.is-loading #rg-text{opacity:.45}

.rg-divider{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;margin:14px 6px 22px}
.rg-divider::before,.rg-divider::after{content:"";-webkit-box-flex:1;-webkit-flex:1 1 0;flex:1 1 0;height:1px;background:linear-gradient(90deg,transparent,var(--line))}
.rg-divider::after{background:linear-gradient(270deg,transparent,var(--line))}
.rg-divider i{display:block;width:7px;height:7px;margin:0 14px;background:var(--accent);-webkit-transform:rotate(45deg);transform:rotate(45deg)}

.rg-actions{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-align-items:stretch;align-items:stretch}
.rg-post{-webkit-box-flex:1;-webkit-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:54px;padding:0 8px;border:0;border-radius:12px;background:var(--accent);color:var(--on-accent);
  font:700 12px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;-webkit-box-shadow:0 10px 18px -10px var(--accent);box-shadow:0 10px 18px -10px var(--accent)}
.rg-post:active{opacity:.9}
.rg-again{-webkit-box-flex:0;-webkit-flex:0 0 54px;flex:0 0 54px;width:54px;height:54px;margin-left:10px;padding:0;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);cursor:pointer}
.rg-again svg{display:block;width:24px;height:24px}
.rg-again.spin svg{-webkit-animation:rgspin .8s linear infinite;animation:rgspin .8s linear infinite}
@-webkit-keyframes rgspin{to{-webkit-transform:rotate(360deg)}}
@keyframes rgspin{to{transform:rotate(360deg)}}

.rg-error{margin:12px 0 0;padding:12px 14px;border-radius:12px;background:#fdecea;color:#8a1c12;font:15px/1.4 var(--sans);font-style:normal}

/* Social icons */
.rg-social{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:center;justify-content:center;margin:20px -6px 14px}
.rg-soc{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;width:48px;height:48px;margin:6px;padding:0;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.8);color:var(--accent);cursor:pointer;text-decoration:none}
.rg-soc svg{display:block;width:23px;height:23px}
.rg-soc:active{opacity:.8}

.rg-address{margin:0 0 12px;padding:0 4px;font-size:14px;line-height:1.75;color:var(--ink)}
.rg-hint{margin:0;padding:0 8px;color:var(--muted);font-size:13.5px}

.rg-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;opacity:0;pointer-events:none}
.rg-map{display:block;width:100%;height:220px;border:0;border-radius:18px;margin:22px 0 0}
.rg-offers{margin:26px 0 0;text-align:left}
.rg-offers h2{font:600 20px/1.2 var(--serif);margin:0 0 8px;text-align:center}
.rg-offers ul{margin:0;padding-left:20px;color:var(--muted)}

/* Large screens: same layout and order, centred and scaled up so it does not look tiny */
@media (min-width:900px){
  .rg{max-width:560px;padding-top:56px}
  .rg-logo{max-width:240px;max-height:120px}
  .rg-stars svg{width:25px;height:25px;margin:0 5px}
  .rg-kicker{font-size:13px}
  .rg-pill span{min-height:46px;font-size:13px;padding:0 18px}
  .rg-card{padding:28px 28px 44px}
  .rg-card-title{font-size:12px}
  #rg-text{font-size:22px}
  .rg-post{min-height:60px;font-size:13px}
  .rg-again{flex-basis:60px;width:60px;height:60px}
  .rg-soc{width:52px;height:52px}
  .rg-address{font-size:15px}
  .rg-hint{font-size:14.5px}
}
@media (prefers-reduced-motion:reduce){*{-webkit-transition:none!important;transition:none!important;-webkit-animation:none!important;animation:none!important}}
