/* reviews.css — 후기 작성 창 + 후기 카드 기본 스타일. 각 사이트의 --accent / --text 변수를 따라갑니다. */

/* 후기 카드: 사이트 자체 CSS가 있으면 그쪽이 우선(:where = 우선순위 0) */
:where(.review-grid){display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;}
:where(.review-card){background:var(--panel,#fff);border:1px solid var(--line,#e4e8ea);border-radius:16px;padding:20px 22px;}
:where(.review-card .stars){color:#f5a623;font-size:.9rem;letter-spacing:1px;margin-bottom:8px;}
:where(.review-card p){margin:0 0 12px;color:var(--text,#171a20);font-size:.94rem;line-height:1.6;}
:where(.review-card .who){color:var(--muted,#5b626b);font-size:.82rem;font-weight:700;}

html.rv-lock{overflow:hidden;}
.rv-overlay{position:fixed;inset:0;z-index:1050;background:rgba(10,12,16,.7);display:flex;align-items:center;justify-content:center;padding:16px;overflow-y:auto;opacity:0;transition:opacity .18s ease;}
.rv-overlay[hidden]{display:none;}
.rv-overlay.rv-on{opacity:1;}
.rv-box,.rv-done{position:relative;width:100%;max-width:480px;max-height:calc(100vh - 32px);overflow-y:auto;background:#fff;color:#171a20;border-radius:20px;padding:26px 24px 22px;box-shadow:0 20px 60px rgba(0,0,0,.4);font-family:"Noto Sans KR","Malgun Gothic",sans-serif;line-height:1.55;word-break:keep-all;}
.rv-box h3,.rv-done h3{margin:0 0 6px;font-size:1.25rem;font-weight:900;letter-spacing:-.02em;}
.rv-lead{margin:0 0 16px;color:#5b626b;font-size:.9rem;}
.rv-x{position:absolute;top:12px;right:12px;width:36px;height:36px;border:0;border-radius:50%;background:#eef1f3;color:#333;font-size:1rem;cursor:pointer;}
.rv-x:hover{background:#dfe4e8;}

.rv-field{display:block;margin:0 0 13px;border:0;padding:0;min-width:0;}
.rv-field>span,.rv-field>legend{display:block;margin:0 0 5px;padding:0;font-size:.85rem;font-weight:800;color:#2a2f36;}
.rv-field em{font-style:normal;color:#d93025;margin-left:2px;}
.rv-field input[type=text],.rv-field textarea{width:100%;border:1.5px solid #cfd5da;border-radius:11px;padding:11px 13px;font:inherit;font-size:.95rem;color:#171a20;background:#fff;}
.rv-field textarea{resize:vertical;min-height:112px;}
.rv-field input:focus,.rv-field textarea:focus{outline:none;border-color:var(--accent,#23aa08);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#23aa08) 25%,transparent);}
.rv-field .rv-bad{border-color:#d93025;}
.rv-count{display:block;margin-top:3px;text-align:right;font-size:.75rem;color:#8a929a;}

.rv-stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px;}
.rv-stars input{position:absolute;opacity:0;width:1px;height:1px;}
.rv-stars label{font-size:2.1rem;line-height:1;color:#d4d7dc;cursor:pointer;padding:0 1px;transition:color .1s ease;}
.rv-stars input:checked~label,.rv-stars label:hover,.rv-stars label:hover~label{color:#f5a623;}
.rv-stars input:focus-visible+label{outline:3px solid var(--accent,#23aa08);outline-offset:2px;border-radius:6px;}

.rv-consent{display:flex;gap:9px;align-items:flex-start;margin:4px 0 12px;font-size:.84rem;color:#3a4048;cursor:pointer;}
.rv-consent input{width:18px;height:18px;margin-top:2px;flex-shrink:0;accent-color:var(--accent,#23aa08);}
.rv-hp{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0;}
.rv-err{margin:0 0 10px;padding:9px 12px;border-radius:10px;background:#fdecea;color:#b3261e;font-size:.85rem;font-weight:700;}
.rv-err[hidden]{display:none;}

.rv-actions{display:flex;gap:10px;margin-top:6px;}
.rv-btn{flex:1;border:0;border-radius:12px;padding:13px 16px;font:inherit;font-size:.95rem;font-weight:800;cursor:pointer;text-align:center;text-decoration:none;display:inline-block;}
.rv-btn-ghost{background:#eef1f3;color:#2a2f36;}
.rv-btn-main{background:var(--accent,#23aa08);color:#fff;}
.rv-btn-kakao{background:#FEE500;color:#3c1e1e;}
.rv-btn:disabled{opacity:.6;cursor:default;}
.rv-note{margin:14px 0 0;font-size:.78rem;color:#7a828a;}
.rv-note a{color:inherit;text-decoration:underline;}

.rv-done[hidden]{display:none;}
.rv-done{text-align:center;padding-top:32px;}
.rv-done .rv-check{width:56px;height:56px;margin:0 auto 12px;border-radius:50%;background:var(--accent,#23aa08);color:#fff;font-size:1.8rem;line-height:56px;}
.rv-done p{margin:0 0 16px;color:#4a5159;font-size:.92rem;}
.rv-done .rv-actions{flex-direction:column;}
.rv-preview{margin:0 0 14px;padding:12px 14px;background:#f4f6f5;border-radius:12px;font-size:.84rem;color:#3a4048;text-align:left;white-space:pre-wrap;max-height:140px;overflow-y:auto;}

@media (max-width:480px){
  .rv-overlay{padding:0;align-items:flex-end;}
  .rv-box,.rv-done{max-width:none;border-radius:22px 22px 0 0;max-height:94vh;}
}
@media (prefers-reduced-motion:reduce){.rv-overlay,.rv-stars label{transition:none;}}