/* ============================================
   주소 검색 UI — 웹사이트·어드민 공용 스타일
   (tokens.css의 디자인 토큰만 사용해 어디서든 동일하게 보이도록 자립적으로 정의)
   ============================================ */

/* 입력칸 + 내부 우측 검색 버튼 */
.addr-row{position:relative;}
.addr-row input{width:100%;padding-right:96px;cursor:pointer;}
.addr-row .btn{position:absolute;right:7px;top:50%;transform:translateY(-50%);
  padding:7px 12px;font-size:.82rem;line-height:1.2;border-radius:999px;white-space:nowrap;}
.addr-hint{font-size:.82rem;color:var(--muted);margin-top:8px;line-height:1.5;}

/* 검색 모달 (모듈이 생성) */
.co-addr-modal{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;
  padding:24px;background:rgba(11,33,54,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  opacity:0;pointer-events:none;transition:opacity .25s ease;}
.co-addr-modal.open{opacity:1;pointer-events:auto;}
/* 카드는 스크롤하지 않음 — 헤더 + iframe이 카드를 정확히 채워 여백/모서리 노출을 없앰 */
.co-addr-card{width:100%;max-width:500px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border-radius:var(--r-l);box-shadow:var(--shadow-l);
  transform:translateY(20px) scale(.98);transition:transform .25s cubic-bezier(.2,.7,.2,1);}
.co-addr-modal.open .co-addr-card{transform:none;}
/* 상단 모서리에 카드 배경(흰색)이 실선처럼 비치지 않도록 헤더에도 같은 라운드를 적용 */
.co-addr-head{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:22px 26px 20px;background:linear-gradient(140deg,var(--blue),var(--blue-d));color:#fff;
  border-radius:var(--r-l) var(--r-l) 0 0;margin:-1px -1px 0;}
.co-addr-head h3{margin:0;font-family:var(--disp-m);font-size:1.2rem;letter-spacing:-.01em;color:#fff;}
.co-addr-x{flex:none;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.18);
  display:grid;place-items:center;color:#fff;cursor:pointer;transition:.2s;}
.co-addr-x:hover{background:rgba(255,255,255,.32);transform:rotate(90deg);}
.co-addr-x svg{width:18px;height:18px;}
/* 초기 높이만 지정 — 이후 카카오 onresize 값으로 모듈이 실제 콘텐츠 높이에 맞춤(화면 높이 내로 제한) */
.co-addr-body{flex:none;height:500px;width:100%;overflow:hidden;}
/* Kakao는 iframe을 고정 높이(500px) div로 감싸 삽입한다.
   래퍼와 iframe 모두 부모를 정확히 채우도록 강제해야 하단에 여백/잘림이 생기지 않는다. */
.co-addr-body > div{height:100%!important;width:100%!important;}
.co-addr-body iframe{display:block;width:100%!important;min-width:100%!important;max-width:none!important;
  height:100%!important;border:0;}
@media(max-width:640px){
  .co-addr-modal{padding:12px;}
  .co-addr-body{height:460px;}
}
