/* 檢驗報告檢視器
   設計稿上那張圖中間原本印了兩頁縮小的報告，看不清楚也翻不了頁。
   改成保留上下的標題與紅字，中間換成真的報告：可左右滑，點一下放大。
   index.html 與 form.html 共用這一份，不要各寫一份，免得改了一邊忘了另一邊。 */

.rvwrap{background:#fdf6ea}          /* 跟設計稿的紙色一致，上下兩塊才接得起來 */
.rvwrap img.rv-cap{display:block;width:100%;height:auto}

.rv{padding:0 clamp(.8rem,4vw,2.2rem) clamp(.6rem,2vw,1rem)}
.rv-hint{margin:0 0 .6rem;text-align:center;font-size:.85rem;color:#6C6353;font-weight:300}
.rv-strip{position:relative;display:flex;gap:.6rem;overflow-x:auto;
          scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rv-strip::-webkit-scrollbar{display:none}
.rv-strip img{flex:0 0 100%;scroll-snap-align:center;width:100%;height:auto;display:block;
              border:1px solid #E2D6BC;border-radius:10px;background:#fff;cursor:zoom-in;
              box-shadow:0 4px 14px rgba(60,45,20,.09)}
.rv-dots{display:flex;gap:.5rem;justify-content:center;margin-top:.7rem}
.rv-dots button{width:9px;height:9px;padding:0;border:0;border-radius:999px;
                background:#E2D6BC;cursor:pointer}
.rv-dots button.on{background:#AF3A24}
.rv-load{padding:2rem 0;text-align:center;color:#6C6353;font-weight:300}

/* .rv-btn 只有放大檢視的底部在用；頁面中間刻意不放按鈕，
   免得卡在設計稿的紅字上面把整張圖切成兩半 */
.rv-btn{display:inline-flex;align-items:center;padding:.5rem 1.05rem;border-radius:999px;
        font-size:.85rem;font-weight:700;text-decoration:none;border:2px solid #AF3A24;
        background:#AF3A24;color:#FFF8EE;cursor:pointer;font-family:inherit}
.rv-btn.ghost{background:transparent;color:#AF3A24}

/* ── 點開放大 ───────────────────────────────────────── */
.rz{position:fixed;inset:0;z-index:90;background:rgba(24,19,11,.93);
    display:none;flex-direction:column;opacity:0;transition:opacity .18s}
.rz.on{opacity:1}
.rz-bar{flex:none;display:flex;align-items:center;gap:.7rem;
        padding:.7rem clamp(.7rem,3vw,1.2rem);color:#F5EBD8}
.rz-bar .t{flex:1 1 auto;font-size:.9rem;font-weight:700}
.rz-bar button{width:2.3rem;height:2.3rem;flex:none;border-radius:999px;cursor:pointer;
               border:1px solid rgba(245,235,216,.35);background:rgba(255,255,255,.08);
               color:#F5EBD8;font-size:1.1rem;line-height:1;font-family:inherit}
.rz-bar button:hover{background:rgba(255,255,255,.18)}
/* 放大時整個框可以捲動來平移，圖片就撐比框寬 */
.rz-view{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;
         display:flex;scroll-snap-type:x mandatory;touch-action:pan-x pan-y pinch-zoom}
.rz-view.zoomed{scroll-snap-type:none}
.rz-view img{flex:0 0 100%;scroll-snap-align:center;width:100%;height:auto;
             object-fit:contain;align-self:flex-start;cursor:zoom-in;background:#fff}
.rz-view.zoomed img{flex:0 0 auto;width:260%;max-width:none;cursor:zoom-out}
.rz-foot{flex:none;display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;
         padding:.75rem clamp(.7rem,3vw,1.2rem) calc(.75rem + env(safe-area-inset-bottom))}
.rz-foot .rv-btn.ghost{border-color:#E2D6BC;color:#F5EBD8}
