/*
 * 마맵 프론트 테마 v2 — .mm-theme-v2 스코프 전용
 *
 * 설계 제약 (위반 시 기존 화면이 깨짐):
 *  1) .mm-theme-v2 래퍼에 position / padding(좌우) / transform / filter / will-change 금지.
 *     - .mypage_top_area i 가 position:absolute 이고 기준점이 #container 다.
 *       래퍼에 position 을 주면 뒤로가기 화살표가 밀린다.
 *     - 래퍼 좌우 padding 은 .mypage_top_area{width:100%} 풀블리드를 깬다.
 *     - transform/filter/will-change 는 스태킹 컨텍스트를 만들어 자손의 position:fixed 를 가둔다.
 *  2) box-sizing 리셋 재선언 금지 — common.css 4행에 이미 * { box-sizing:border-box } 전역.
 *  3) font-family 선언 금지 — common.css body 가 이미 Pretendard.
 *  4) 페이지별 인라인 <style> 에서 옮겨온 규칙은 반드시 .mm-page-* 마커까지 붙인다.
 *     .mem_ment_1 / .mem_set 처럼 페이지마다 정반대로 재정의되는 클래스가 있다.
 */

/* ===== 디자인 토큰 ===== */
.mm-theme-v2 {
    --mm-primary: #FF385C;          /* 프론트 브랜드 컬러 유지 (jehu #FF5862 아님) */
    --mm-primary-hover: #e8324f;
    --mm-primary-tint: #FFEDF1;

    --mm-bg: #F4F6F8;
    --mm-card: #FFFFFF;

    --mm-text: #1f1f1f;
    --mm-text-sub: #353535;
    --mm-muted: #6b7480;
    --mm-disabled: #9aa3ad;

    --mm-border: #e5e9ee;
    --mm-divider: #f0f3f6;

    --mm-radius-lg: 14px;
    --mm-radius-md: 12px;
    --mm-radius-sm: 10px;
    --mm-radius-pill: 999px;

    --mm-shadow-card: 0 1px 2px rgba(0,0,0,.04), 0 0 0 .5px rgba(0,0,0,.04);

    --mm-pad-card: 16px;
    --mm-gap: 12px;
    --mm-tx: .15s ease;

    background: var(--mm-bg);
    color: var(--mm-text);
    letter-spacing: -.01em;
    min-height: calc(100vh - 50px);   /* #container 하단 여백(50px) 제외. 스태킹 컨텍스트 안 만듦 */
}

/* ===== 공통: 상단 헤더 바 =====
   .mypage_top_area 는 61개 뷰가 공유한다. 스코프 안에서만 손댄다. */
.mm-theme-v2 .mypage_top_area {
    background: var(--mm-card);
    border-bottom: 1px solid var(--mm-divider);
    font-weight: 700;
    color: var(--mm-text);
}

/* /ios/* 경로는 헤더가 숨겨져 본문이 최상단에 붙는다 */
.mm-theme-v2.mm-no-header {
    padding-top: 8px;
}

/* ===== 공통 컴포넌트 ===== */
.mm-theme-v2 .mm-card {
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    padding: var(--mm-pad-card);
}

.mm-theme-v2 .mm-cta {
    display: block;
    width: 100%;
    max-width: 220px;
    margin: 0 auto;
    padding: 13px 16px;
    border: 0;
    border-radius: var(--mm-radius-pill);
    background: var(--mm-primary);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    transition: background var(--mm-tx);
}
.mm-theme-v2 .mm-cta:hover { background: var(--mm-primary-hover); }

/* style.css 원본: float:left; min-height:100px; padding:15px; position:relative
   → float 과 min-height 를 함께 해제하지 않으면 100px 짜리 부유 블록이 남는다 */
/* 빈 목록 상태. blade 가 <ul> 안에 줄바꿈 텍스트 노드를 남기므로
   CSS :empty 는 절대 매칭되지 않는다 → @forelse / @empty 로 마크업에서 처리한다. */
.mm-theme-v2 .mm-empty {
    padding: 48px 20px;
    text-align: center;
    font-size: .95rem;
    color: var(--mm-disabled);
    border-bottom: 0;
    cursor: default;
    list-style: none;
}

.mm-theme-v2 .bottom_margin {
    float: none;
    width: 100%;
    height: 24px;
    min-height: 0;
    padding: 0;
}


/* =========================================================
   PAGE: /point  (.mm-page-point)
   mypage/point.blade.php 인라인 <style> 25줄에서 이관.
   반드시 페이지 마커 포함 — .mem_ment_1 / .mem_set 는 style.css 원본과
   index/gift_list/gift_info/user_break 인라인이 서로 다르게 정의한다.
   ========================================================= */

/* 포인트 요약 카드 */
.mm-theme-v2.mm-page-point .my_point_area {
    width: auto;
    margin: var(--mm-gap);
    padding: var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
}
.mm-theme-v2.mm-page-point .my_point_area ul {
    padding: 4px 0 16px 0;
    position: relative;
}
.mm-theme-v2.mm-page-point .my_point_area li.mem_ment_2 {
    font-size: .85rem;
    padding: 0;
    color: var(--mm-muted);
    cursor: default;
}
.mm-theme-v2.mm-page-point .my_point_area li.mem_ment_1 {
    font-size: 2rem;
    padding: 2px 0 0 0;
    font-weight: 700;
    color: var(--mm-primary);
    cursor: default;
    line-height: 1.2;
}
.mm-theme-v2.mm-page-point .my_point_area li.mem_ment_1 label { font-size: .6rem; }

/* 포인트정책 링크 — style.css .mem_set 원본(1.4rem #d9d9d9)을 덮는다 */
.mm-theme-v2.mm-page-point .my_point_area .mem_set {
    position: absolute;
    right: 0;
    top: 0;
    margin: 0;
    padding: 0;
    font-size: .8rem;
    border-radius: 0;
    color: var(--mm-muted);
}
.mm-theme-v2.mm-page-point .my_point_area .mem_set a,
.mm-theme-v2.mm-page-point .my_point_area .mem_set i { color: var(--mm-muted); }

/* CTA */
.mm-theme-v2.mm-page-point .st2_point_area {
    width: 100%;
    background: transparent;
    position: relative;
    margin-bottom: 14px;
}
.mm-theme-v2.mm-page-point .st2_point_area div.point_btn {
    padding: 13px;
    width: 100%;
    max-width: 220px;
    margin: 0 auto;
    border-radius: var(--mm-radius-pill);
    background: var(--mm-primary);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-point .st2_point_area div.point_btn:hover { background: var(--mm-primary-hover); }

/* 안내 문구 */
.mm-theme-v2.mm-page-point .my_point_area div.point_ment {
    font-size: .78rem;
    line-height: 1.5;
    color: var(--mm-muted);
    border-top: 1px solid var(--mm-divider);
    margin-top: 14px;
    padding-top: 12px;
}
.mm-theme-v2.mm-page-point .my_point_area div.point_ment p { margin-top: 4px; }

/* 적립/사용 내역 카드 */
.mm-theme-v2.mm-page-point .my_point_list_area {
    margin: 0 var(--mm-gap) var(--mm-gap);
    padding: 4px var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
    width: auto;
}
.mm-theme-v2.mm-page-point .my_point_list_area ul {
    float: none;
    width: 100%;
    margin-bottom: 0;
}
.mm-theme-v2.mm-page-point .my_point_list_area ul li {
    padding: 16px 0;
    border-bottom: 1px solid var(--mm-divider);
    cursor: default;
}
.mm-theme-v2.mm-page-point .my_point_list_area ul li:last-child { border-bottom: 0; }
.mm-theme-v2.mm-page-point .my_point_list_area ul li i { margin-right: 5px; }

.mm-theme-v2.mm-page-point .point_list_i { width: 100%; }
.mm-theme-v2.mm-page-point .point_list_i td { padding: 3px 0; }
.mm-theme-v2.mm-page-point .point_list_i td.p_date {
    font-size: .75rem;
    color: var(--mm-muted);
}
.mm-theme-v2.mm-page-point .point_list_i td.p_title {
    font-size: .95rem;
    font-weight: 600;
    color: var(--mm-text);
}
.mm-theme-v2.mm-page-point .point_list_i td.p_point {
    font-size: 1.15rem;
    text-align: right;
    font-weight: 700;
    color: var(--mm-primary);
}
.mm-theme-v2.mm-page-point .point_list_i td.p_title_out {
    font-size: .95rem;
    color: var(--mm-muted);
    font-weight: 600;
}
.mm-theme-v2.mm-page-point .point_list_i td.p_point_out {
    font-size: 1.15rem;
    color: var(--mm-disabled);
    text-align: right;
    font-weight: 700;
}




/* =========================================================
   PAGE: /mypage  (.mm-page-mypage)  — MY마맵 허브
   주의: .pay_version_chek 이 position:fixed 다. 래퍼가 스태킹 컨텍스트를
   만들지 않아야 화면 하단에 정상 고정된다(토큰 블록의 금지 규칙 참조).
   .mem_ment_1 / .mem_ment_2 / .mem_set 는 style.css 원본을 그대로 쓴다 — 재정의 금지.
   ========================================================= */
.mm-theme-v2.mm-page-mypage .mypage_top_area i { left: 7px; }

/* width:auto 필수 — style.css 가 width:100% 를 걸어둬서 margin 을 더하면 가로로 넘친다.
   padding 15px 과 자식 ul 의 padding(20px 10px)/position:relative 는 원형 유지.
   .mem_icon(left:0) / .mem_set(right:0) / .event_btn(right:0) 이 그 ul 을 기준으로 절대배치된다. */
.mm-theme-v2.mm-page-mypage .my_login_area {
    width: auto;
    margin: var(--mm-gap);
    padding: 15px;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}

/* 포인트/쿠폰/예약 3분할 */
.mm-theme-v2.mm-page-mypage .point_area {
    max-width: none;
    background: transparent;
    position: relative;
    border-top: 1px solid var(--mm-divider);
    padding: 4px 0 6px;
}
.mm-theme-v2.mm-page-mypage .point_area ul { padding: 8px 0; }
.mm-theme-v2.mm-page-mypage .point_area ul li {
    float: left;
    width: 33.3%;
    font-size: .78rem;
    text-align: center;
    color: var(--mm-muted);
}
.mm-theme-v2.mm-page-mypage .point_area ul li img { margin-top: -3px; }
.mm-theme-v2.mm-page-mypage .point_area ul li.point { border-right: 1px solid var(--mm-divider); }
.mm-theme-v2.mm-page-mypage .point_area ul li p {
    font-weight: 700;
    color: var(--mm-primary);
    margin-top: 8px;
    font-size: 1rem;
    cursor: pointer;
}

/* 안내 말풍선 (현재 HTML 주석 처리됨 — 되살릴 때 대비해 유지) */
.mm-theme-v2.mm-page-mypage .point_area div.help_msg {
    height: 8.8888vw;
    position: absolute;
    background-image: url('/images/ico/mypage_arrow.png');
    background-size: cover;
    width: 53vw;
    background-position: bottom;
    bottom: -5.5vw;
    z-index: 20;
}
.mm-theme-v2.mm-page-mypage .point_area div.help_msg span.txt {
    font-size: 2.7vw; color: #4f5f86; line-height: 7vw; height: 7vw;
    display: inline-block; padding: 0 4vw 0 4vw; border-radius: 10vw;
    position: absolute; bottom: 0; padding-right: 7vw; font-weight: 600;
}
.mm-theme-v2.mm-page-mypage .point_area div.help_msg span.close {
    font-size: 0; width: 8vw; height: 7vw;
    background: url('/images/ico/mypage_pop_close.png') no-repeat;
    position: absolute; right: 0; bottom: 0;
    background-size: 30%; background-position: center;
}
@media all and (min-width: 770px) {
    .mm-theme-v2.mm-page-mypage .point_area div.help_msg { display: none; }
}

/* 메뉴 리스트 */
.mm-theme-v2.mm-page-mypage .my_menu_area {
    width: auto;                       /* style.css width:100% + margin = 가로 넘침 */
    margin: 0 var(--mm-gap) var(--mm-gap);
    padding: 4px var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-mypage .my_menu_area label { color: var(--mm-muted); font-size: .8rem; }
.mm-theme-v2.mm-page-mypage .my_menu_area ul { float: none; width: 100%; margin-bottom: 0; }
.mm-theme-v2.mm-page-mypage .my_menu_area ul li {
    padding: 16px 0;
    border-bottom: 1px solid var(--mm-divider);
    cursor: pointer;
    font-size: .95rem;
    transition: color var(--mm-tx);
}
.mm-theme-v2.mm-page-mypage .my_menu_area ul > a:last-child li,
.mm-theme-v2.mm-page-mypage .my_menu_area ul > li:last-child { border-bottom: 0; }
.mm-theme-v2.mm-page-mypage .my_menu_area ul li:hover { color: var(--mm-primary); }
/* '예약내역 조회' 행만 <li><a>텍스트</a></li> 구조라 텍스트가 a 안에 있다.
   (다른 행은 <a><li>텍스트</li></a>) a 가 자체 color 를 가져 li:hover 색이 안 먹으므로 상속시킨다. */
.mm-theme-v2.mm-page-mypage .my_menu_area ul li a { color: inherit; transition: color var(--mm-tx); }

/* 같은 이유로 a 가 inline(107x18) 이라 행(334x53)의 대부분이 클릭 사각지대였다.
   li 의 패딩을 a 로 옮겨 행 전체를 링크 면적으로 만든다. */
.mm-theme-v2.mm-page-mypage .my_menu_area ul > li.menu_link_li { padding: 0; }
.mm-theme-v2.mm-page-mypage .my_menu_area ul > li.menu_link_li > a { display: block; padding: 16px 0; }
.mm-theme-v2.mm-page-mypage .my_menu_area li img { margin-top: -3px; margin-right: 6px; }
.mm-theme-v2.mm-page-mypage .my_menu_area li i.feather { color: var(--mm-disabled); }

/* 앱 업데이트 안내 (position:fixed — 원형 유지, 라운드만 토큰화) */
.mm-theme-v2.mm-page-mypage .pay_version_chek {
    width: 100%;
    max-width: 480px;
    height: 180px;
    border-top-left-radius: var(--mm-radius-lg);
    border-top-right-radius: var(--mm-radius-lg);
    background: var(--mm-card);
    z-index: 1210;
    position: fixed;
    bottom: 0;
    border: 1px solid #ff5035;
}
.mm-theme-v2.mm-page-mypage .pay_version_chek li { padding: 15px; }
.mm-theme-v2.mm-page-mypage .pay_app_update {
    font-weight: 600; font-size: 1.1rem; color: #474747;
    text-align: center; margin-top: 10px; position: relative;
}
.mm-theme-v2.mm-page-mypage .pay_app_update i { position: absolute; right: 10px; top: 0; font-size: 1.7rem; }
.mm-theme-v2.mm-page-mypage .pay_app_update em { color: #ff5035; }
.mm-theme-v2.mm-page-mypage .pay_app_update p { margin-top: 8px; }
.mm-theme-v2.mm-page-mypage .pay_app_update_btn {
    background: #ff5035; font-size: 1rem; text-align: center; float: left;
    border-radius: 8px; width: 100%; padding: 10px; color: #fff;
    font-weight: 600; cursor: pointer;
}


/* =========================================================
   PAGE: /notice  (.mm-page-notice) — 공지사항 아코디언
   인라인 <style> 없음. style.css 원본을 스코프 안에서 카드형으로 승격.
   ========================================================= */
.mm-theme-v2.mm-page-notice .notice_area {
    margin: var(--mm-gap);
    padding: 0;
    background: transparent;
}
.mm-theme-v2.mm-page-notice details {
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    box-shadow: var(--mm-shadow-card);
    margin-bottom: 10px;
    overflow: hidden;
}
/* style.css 원본이 summary 안을 float + 고정폭으로 짠다. 스코프 안에서 전부 해제한다.
     .notice_title  width:85%; height:20px; float:left; margin-left:20px  → 제목 2줄이면 넘침
     .notice_date   width:100%; margin-left:20px                          → 100%+20px 가로 넘침
     .notice_s i    width:10%
     summary.notice_s::after  content:"+"/"-"  left:20px                  → chevron 과 중복
   위 margin-left:20px 들은 그 "+/-" 마커 자리를 비우려던 것이므로 마커와 함께 제거한다. */
.mm-theme-v2.mm-page-notice summary.notice_s {
    position: relative;
    list-style: none;
    width: 100%;
    padding: 16px var(--mm-pad-card);
    border-bottom: 0;
    cursor: pointer;
}
.mm-theme-v2.mm-page-notice summary.notice_s::-webkit-details-marker { display: none; }
.mm-theme-v2.mm-page-notice summary.notice_s::after { content: none; }
.mm-theme-v2.mm-page-notice summary.notice_s i { width: auto; }

.mm-theme-v2.mm-page-notice .notice_title {
    width: auto;
    height: auto;
    float: none;
    margin-left: 0;
    padding-right: 28px;
    font-size: .95rem;
    font-weight: 600;
    color: var(--mm-text);
    line-height: 1.45;
    word-break: break-word;
    overflow-wrap: anywhere;
}
.mm-theme-v2.mm-page-notice .notice_date {
    width: auto;
    float: none;
    margin-left: 0;
    margin-top: 6px;
    font-size: .75rem;
    color: var(--mm-muted);
}
.mm-theme-v2.mm-page-notice summary.notice_s i.feather {
    position: absolute;
    right: var(--mm-pad-card);
    top: 18px;
    font-size: 1.2rem;
    color: var(--mm-muted);
    transition: transform var(--mm-tx);
}
.mm-theme-v2.mm-page-notice details[open] summary.notice_s i.feather {
    transform: rotate(180deg);
    color: var(--mm-primary);
}
.mm-theme-v2.mm-page-notice .nocite__content {
    padding: var(--mm-pad-card);
    border-top: 1px solid var(--mm-divider);
    background: #fbfcfd;
    font-size: .9rem;
    line-height: 1.65;
    color: var(--mm-text-sub);
    word-break: break-all;
}
.mm-theme-v2.mm-page-notice .nocite__content img { max-width: 100%; height: auto; }


/* =========================================================
   PAGE: /qna  (.mm-page-qna)
   인라인의 `#container{background:#f3f4f6}` 는 래퍼 배경(--mm-bg)이 대체하므로 이관하지 않음.
   ========================================================= */
.mm-theme-v2.mm-page-qna .qna_area { width: 100%; padding: var(--mm-gap); }
.mm-theme-v2.mm-page-qna .qna_list {
    width: 100%;
    border-radius: var(--mm-radius-md);
    font-size: 1rem;
    background: #ffe812;                 /* 카카오 브랜드 컬러 — 유지 */
    border: 0;
    box-shadow: var(--mm-shadow-card);
    padding: 0 10px;
    text-align: center;
    margin-bottom: 12px;
    height: 72px;
    line-height: 72px;
    font-weight: 700;
    color: #3c1e1e;
    transition: transform var(--mm-tx);
}
.mm-theme-v2.mm-page-qna .qna_list:hover { transform: translateY(-1px); }
.mm-theme-v2.mm-page-qna .qna_list img { margin-top: -3px; margin-right: 10px; }
.mm-theme-v2.mm-page-qna .qna_ment {
    width: 100%;
    margin-top: 28px;
    padding: var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
    text-align: center;
    color: var(--mm-text);
    font-weight: 700;
}
.mm-theme-v2.mm-page-qna .qna_ment p {
    font-size: .85rem;
    font-weight: 400;
    color: var(--mm-muted);
    margin-top: 8px;
}


/* =========================================================
   PAGE: /ios/setting  (.mm-page-setting)
   웹 라우트 없음 — 항상 /ios/setting 이라 헤더가 없다(mm-no-header).
   ========================================================= */
.mm-theme-v2.mm-page-setting .my_setting_area {
    width: auto;
    margin: var(--mm-gap);
    padding: 4px var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-setting .my_setting_area ul li {
    width: 100%;
    font-size: .95rem;
    border-bottom: 1px solid var(--mm-divider);
    padding: 18px 0;
    cursor: pointer;
}
.mm-theme-v2.mm-page-setting .my_setting_area ul li:last-child {
    border-bottom: 0;
    color: var(--mm-muted);
    cursor: default;
}
.mm-theme-v2.mm-page-setting .my_setting_area li i.feather { color: var(--mm-disabled); }
.mm-theme-v2.mm-page-setting .push_area { position: relative; }
.mm-theme-v2.mm-page-setting .push_bg {
    position: absolute; background: #ddd; border-radius: var(--mm-radius-pill);
    width: 48px; height: 30px; right: 5px; top: 15px; padding: 4px;
}
.mm-theme-v2.mm-page-setting .push_bg.on { background: var(--mm-primary); }
.mm-theme-v2.mm-page-setting .push_bg div.push {
    width: 21px; height: 21px; background: #fff; border-radius: 50%;
    float: left; box-shadow: 0 3px 3px 0 rgba(0,0,0,.1);
}
.mm-theme-v2.mm-page-setting .push_bg.on div.push.on { float: right; }


/* =========================================================
   PAGE: /gift  (.mm-page-gift-list) — 포인트 사용하기(상품 목록)
   ========================================================= */
.mm-theme-v2.mm-page-gift-list .my_gift_area {
    width: auto;
    margin: var(--mm-gap);
    padding: var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
}
.mm-theme-v2.mm-page-gift-list .my_gift_area ul { padding: 8px 0; position: relative; }
.mm-theme-v2.mm-page-gift-list .my_gift_area li.mem_ment_2 {
    font-size: .85rem; color: var(--mm-muted); cursor: default; text-align: center;
}
.mm-theme-v2.mm-page-gift-list .my_gift_area li.mem_ment_1 {
    font-size: 2rem; cursor: default; font-weight: 700;
    color: var(--mm-primary); text-align: center; line-height: 1.25;
}
.mm-theme-v2.mm-page-gift-list .my_gift_area li.mem_ment_1 label { font-size: .6rem; }

.mm-theme-v2.mm-page-gift-list .my_gift_list_area {
    width: auto;
    margin: 0 var(--mm-gap) var(--mm-gap);
    padding: 4px var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
}
.mm-theme-v2.mm-page-gift-list .my_gift_list_area ul { float: none; width: 100%; margin-bottom: 0; }
.mm-theme-v2.mm-page-gift-list .my_gift_list_area ul li {
    padding: 16px 0; border-bottom: 1px solid var(--mm-divider); cursor: default;
}
.mm-theme-v2.mm-page-gift-list .my_gift_list_area ul li:last-child { border-bottom: 0; }

.mm-theme-v2.mm-page-gift-list .gift_list_i { width: 100%; }
.mm-theme-v2.mm-page-gift-list .gift_list_i td { padding: 5px 0; vertical-align: middle; }
.mm-theme-v2.mm-page-gift-list .gift_list_i td.gift_img img {
    width: 80px; height: 80px; object-fit: cover;
    border-radius: var(--mm-radius-sm); border: 1px solid var(--mm-border);
}
.mm-theme-v2.mm-page-gift-list .gift_list_i td.gift_name {
    font-size: .9rem; font-weight: 600; padding: 5px; color: var(--mm-text);
}
.mm-theme-v2.mm-page-gift-list .gift_list_i td.gift_name p {
    color: var(--mm-primary); font-weight: 700; margin-top: 5px;
}
.mm-theme-v2.mm-page-gift-list .gift_list_i td.gift_btn div {
    padding: 8px 5px; font-size: .8rem; font-weight: 600;
    border: 1px solid var(--mm-primary); color: var(--mm-primary);
    border-radius: var(--mm-radius-pill); text-align: center; margin-left: 15px;
    transition: background var(--mm-tx), color var(--mm-tx);
}
.mm-theme-v2.mm-page-gift-list .gift_list_i td.gift_btn div:hover {
    background: var(--mm-primary); color: #fff;
}


/* =========================================================
   SHARED: gift_info + user_break
   두 페이지가 .my_gift_send_img / .my_gift_send_area / .gift_check_a / .gift_send_btn 를
   동일 정의로 공유한다(다른 페이지 사용처 0건). 마커를 나열해 스코프를 고정한다.
   ========================================================= */
.mm-theme-v2.mm-page-gift-info .my_gift_send_img,
.mm-theme-v2.mm-page-user-break .my_gift_send_img {
    width: auto;
    margin: var(--mm-gap);
    padding: var(--mm-pad-card);
    font-size: 1rem;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-gift-info .my_gift_send_img ul,
.mm-theme-v2.mm-page-user-break .my_gift_send_img ul { padding: 12px 0; position: relative; }
.mm-theme-v2.mm-page-gift-info .my_gift_send_img li.mem_ment_1,
.mm-theme-v2.mm-page-user-break .my_gift_send_img li.mem_ment_1 {
    font-size: 1rem; cursor: default; font-weight: 700;
    color: var(--mm-text); text-align: center; padding-top: 12px;
}
.mm-theme-v2.mm-page-gift-info .my_gift_send_img li.mem_ment_2,
.mm-theme-v2.mm-page-user-break .my_gift_send_img li.mem_ment_2 { text-align: center; }
.mm-theme-v2.mm-page-gift-info .my_gift_send_img li.mem_ment_2 img,
.mm-theme-v2.mm-page-user-break .my_gift_send_img li.mem_ment_2 img {
    max-width: 25vw; border-radius: var(--mm-radius-sm);
}

.mm-theme-v2.mm-page-gift-info .my_gift_send_area,
.mm-theme-v2.mm-page-user-break .my_gift_send_area {
    width: auto;
    margin: 0 var(--mm-gap) var(--mm-gap);
    padding: var(--mm-pad-card);
    font-size: 1rem;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-gift-info .my_gift_send_area ul,
.mm-theme-v2.mm-page-user-break .my_gift_send_area ul { padding: 4px 0; position: relative; }
.mm-theme-v2.mm-page-gift-info .my_gift_send_area li,
.mm-theme-v2.mm-page-user-break .my_gift_send_area li { list-style: disc; width: 85%; }
.mm-theme-v2.mm-page-gift-info .my_gift_send_area li.mem_ment_1,
.mm-theme-v2.mm-page-user-break .my_gift_send_area li.mem_ment_1 {
    font-size: .92rem; color: var(--mm-text); list-style: none;
    font-weight: 700; margin-bottom: 6px;
}
.mm-theme-v2.mm-page-gift-info .my_gift_send_area li.mem_ment_1 i,
.mm-theme-v2.mm-page-user-break .my_gift_send_area li.mem_ment_1 i { color: var(--mm-primary); }
.mm-theme-v2.mm-page-gift-info .my_gift_send_area li.mem_ment_2,
.mm-theme-v2.mm-page-user-break .my_gift_send_area li.mem_ment_2 {
    font-size: .85rem; color: var(--mm-muted); cursor: default;
    text-align: left; margin: 8px 0 8px 20px; line-height: 1.55;
}

.mm-theme-v2.mm-page-gift-info .gift_check_a,
.mm-theme-v2.mm-page-user-break .gift_check_a {
    width: 100%; padding: 0; border-radius: var(--mm-radius-sm); margin-bottom: 16px;
}
.mm-theme-v2.mm-page-gift-info .gift_check_a td,
.mm-theme-v2.mm-page-user-break .gift_check_a td { font-size: .88rem; color: var(--mm-text-sub); }
.mm-theme-v2.mm-page-gift-info .gift_check_a td label,
.mm-theme-v2.mm-page-user-break .gift_check_a td label { color: var(--mm-muted); text-decoration: underline; }
.mm-theme-v2.mm-page-gift-info .gift_check_a div,
.mm-theme-v2.mm-page-user-break .gift_check_a div { margin-top: -5px; }

.mm-theme-v2.mm-page-gift-info .gift_send_btn,
.mm-theme-v2.mm-page-user-break .gift_send_btn {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    padding: 14px 10px;
    cursor: pointer;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-gift-info .gift_send_btn:hover,
.mm-theme-v2.mm-page-user-break .gift_send_btn:hover { background: var(--mm-primary-hover); }


/* PAGE: /gift/{id} 전용 */
.mm-theme-v2.mm-page-gift-info .gift_agree_area {
    width: auto; margin: 0 var(--mm-gap) var(--mm-gap); padding: var(--mm-pad-card);
    background: var(--mm-card); border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card); font-size: 1rem;
}
.mm-theme-v2.mm-page-gift-info .gift_agree_area ul { float: none; width: 100%; }
.mm-theme-v2.mm-page-gift-info .gift_agree_area ul li { padding: 5px 0; margin: 0 auto; list-style: none; }


/* =========================================================
   PAGE: /user_break  (.mm-page-user-break) — 회원탈퇴
   .reason_agree_area 는 position:fixed(하단 고정 CTA). 원형 유지.
   ========================================================= */
.mm-theme-v2.mm-page-user-break .reason_title_1 {
    width: 100%; padding: 4px var(--mm-gap) 0; font-size: 1.15rem;
    font-weight: 700; color: var(--mm-text);
}
.mm-theme-v2.mm-page-user-break .reason_point { width: auto; padding: 10px var(--mm-gap) 4px; }
.mm-theme-v2.mm-page-user-break .reason_point_box {
    width: 100%; border-radius: var(--mm-radius-md);
    border: 1px solid var(--mm-border);
    background: var(--mm-card);
    padding: 18px 14px; font-size: 1rem;
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-user-break .reason_point_box b { font-weight: 700; color: var(--mm-primary); }
.mm-theme-v2.mm-page-user-break .reason_point_box em {
    text-align: right; color: var(--mm-primary); float: right; font-size: .85rem; font-style: normal;
}
.mm-theme-v2.mm-page-user-break .reason_agree_area {
    width: 100%; max-width: 480px;
    padding: 15px 15px 120px 15px;
    font-size: 1rem;
    position: fixed; bottom: 0;
    background: var(--mm-card);
    height: 120px; z-index: 200;
    border-top: 1px solid var(--mm-border);
}
.mm-theme-v2.mm-page-user-break .reason_agree_area ul { float: left; width: 100%; max-width: 720px; }
.mm-theme-v2.mm-page-user-break .reason_agree_area ul li { padding: 5px 0; margin: 0 auto; list-style: none; }
.mm-theme-v2.mm-page-user-break .reason_margin { height: 150px; width: 100%; }


/* =========================================================
   PAGE: /user_edit/{id}  (.mm-page-user-edit) — 정보수정
   .login_area / .join_step2_li / .nick_title / .nick_input 은 register·join_step2 와
   공유하는 style.css 클래스다. 반드시 페이지 마커 안에서만 손댄다.
   ========================================================= */
.mm-theme-v2.mm-page-user-edit .login_area {
    width: auto;                       /* style.css width:100% + margin = 가로 넘침 */
    margin: var(--mm-gap);
    padding: 4px var(--mm-pad-card) 24px;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
/* style.css `.login_area ul{float:left}` → 카드(부모) 높이가 붕괴해 내용이 흘러넘친다 */
.mm-theme-v2.mm-page-user-edit .login_area ul { float: none; width: 100%; }

.mm-theme-v2.mm-page-user-edit .e_join_step2_ment {
    font-size: 1rem; font-weight: 700; color: var(--mm-text); padding: 16px 0 4px;
}
.mm-theme-v2.mm-page-user-edit .nick_title {
    font-size: .8rem; color: var(--mm-muted); margin-bottom: 6px;
}
.mm-theme-v2.mm-page-user-edit .nick_input {
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: #fbfcfd;
    transition: border-color var(--mm-tx), background var(--mm-tx);
}
.mm-theme-v2.mm-page-user-edit .nick_input:focus {
    border-color: var(--mm-primary);
    background: var(--mm-card);
}
.mm-theme-v2.mm-page-user-edit .m_out_area { margin: 15px 0 0 0; }
.mm-theme-v2.mm-page-user-edit .m_out_area_l {
    width: 50%; float: left; color: var(--mm-muted); font-size: .8rem;
}
.mm-theme-v2.mm-page-user-edit .m_out_area_r {
    width: 50%; float: left; text-align: right; color: var(--mm-muted); font-size: .8rem;
}
/* 폭·여백만 여기서. 테두리·배경은 아래 '밑줄 제거' 블록에서 박스형으로 다시 지정한다
   (여기 border:none / background:transparent 를 남겨두면 죽은 선언이 되어 오해를 부른다) */
.mm-theme-v2.mm-page-user-edit .login_area li input.phone_input {
    width: 70%; margin-bottom: 0;
}
.mm-theme-v2.mm-page-user-edit .login_area li input.phone_input::placeholder { color: var(--mm-primary); }
.mm-theme-v2.mm-page-user-edit .phone_con_btn {
    font-size: .85rem; width: 80px; height: 32px;
    border-radius: var(--mm-radius-pill); background: var(--mm-muted);
    color: #fff; text-align: center; line-height: 32px; cursor: pointer; float: right;
}
.mm-theme-v2.mm-page-user-edit .phone_ok_btn {
    font-size: .85rem; width: 80px; height: 32px;
    border-radius: var(--mm-radius-pill); background: var(--mm-primary);
    color: #fff; text-align: center; line-height: 32px; cursor: pointer; float: right;
}
.mm-theme-v2.mm-page-user-edit .re_phone_con_btn {
    color: var(--mm-muted); float: right; text-decoration: underline;
    font-size: .8rem; font-weight: 600; margin-top: 15px; cursor: pointer;
}
.mm-theme-v2.mm-page-user-edit .time_count {
    font-size: .8rem; float: right; font-weight: 600; margin-top: -28px; color: var(--mm-primary);
}

/* 입력 행 — style.css `.join_step2_li` 의 밑줄(border-bottom)과 margin-bottom:45px 제거.
   카드형 입력 아래에 선이 한 번 더 그어져 register 와 톤이 달랐다. */
.mm-theme-v2.mm-page-user-edit .login_area li.join_step2_li {
    border-bottom: 0;
    margin-bottom: 8px;
}
/* 입력은 카드 폭 전체로. 단 옆에 버튼이 붙는 행(닉네임·휴대폰·인증번호)은 70% 유지 */
.mm-theme-v2.mm-page-user-edit .login_area li input.nick_input { width: 100%; }
.mm-theme-v2.mm-page-user-edit .login_area li.nick_row input.nick_input { width: 70%; }
/* 닉네임 행 아래 '7일에 한 번만 변경' 안내(em, position:absolute, bottom:-25px) 자리 확보 */
.mm-theme-v2.mm-page-user-edit .login_area li.nick_row { margin-bottom: 34px; }

/* 밑줄이 사라졌으므로 휴대폰·인증번호 입력도 다른 필드와 같은 박스로 */
.mm-theme-v2.mm-page-user-edit .login_area li input.phone_input {
    width: 70%;
    height: auto;
    padding: 13px 12px;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: #fbfcfd;
}
/* 03:00 타이머 — 입력칸이 박스가 되면서 글자와 겹쳤다. 음수 margin 으로 입력칸 위에 얹으면
   폼 컨트롤에 가려 보이지 않으므로, li(position:relative) 기준으로 '인증 번호' 라벨 줄
   오른쪽에 붙인다. (blade 의 인라인 margin-right:90px 은 제거했다 — 인라인은 CSS 로 못 이긴다) */
.mm-theme-v2.mm-page-user-edit #auth_no_view .time_count {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    margin: 0;
    float: none;
}

/* 정보수정 버튼 — 이 페이지는 .mm-auth 스코프가 아니라 공용 버튼 규칙이 닿지 않아
   원본 빨강(#e10000, radius 4px)이 그대로였다. 다른 폼의 제출 버튼과 동일하게 맞춘다. */
.mm-theme-v2.mm-page-user-edit .login_submit_ok {
    width: 100%;
    padding: 14px 10px;
    border-radius: var(--mm-radius-md);
    background: var(--mm-primary);
    color: #fff;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-user-edit .login_submit_ok:hover { background: var(--mm-primary-hover); }
.mm-theme-v2.mm-page-user-edit .login_submit_area { padding-top: 24px; }


/* =========================================================
   마사지톡 (Phase 3)
   스코프: .mm-talk = 5장 공통 chrome / .mm-page-talk-* = 페이지별
   건드리지 않는 것 (배경 스프라이트 좌표 의존):
     .talk_com_sym / .talk_com_count / .talk_com_bell_btn / .talk_icon_coupon / .talk_con div.q_icon
   원형 유지 (position:fixed):
     .map_n_area(고정헤더,z-10) / .talk_write(고정버튼) /
     .talk_write_submit_area(z-5) / .talk_policy_wrap(z-100000)
   → 래퍼가 스태킹 컨텍스트를 만들면 전부 갇힌다. 토큰 블록의 금지 규칙 참조.
   ========================================================= */

/* ----- 공통 chrome ----- */
.mm-theme-v2.mm-talk .map_talk_top { background: transparent; }
.mm-theme-v2.mm-talk .map_n_area {
    background: var(--mm-card);
    border-bottom: 1px solid var(--mm-border);
}
.mm-theme-v2.mm-talk .map_talk_title { color: var(--mm-text); font-weight: 700; }

/* index/view 인라인에서 이관 */
.mm-theme-v2.mm-talk .map_n_area ul li.map_n_home {
    position: absolute; width: 40px; top: 9px; color: #000; font-size: 1.9rem;
}

/* 카테고리 뱃지 — float:left / max-width:120px 는 원형 유지 */
/* 카테고리 뱃지 — 보조 정보이므로 강조하지 않는다(중성 회색, 작게).
   float:left / max-width:120px / margin-right:10px 은 원본 유지.
   .talk_icon_coupon(당첨 뱃지)은 배경 스프라이트라 건드리지 않는다. */
.mm-theme-v2.mm-talk .talk_icon {
    background: var(--mm-divider);
    color: var(--mm-muted);
    border-radius: var(--mm-radius-pill);
    font-size: .7rem;
    font-weight: 500;
    line-height: 1.4;
    padding: 3px 9px;
    letter-spacing: 0;
}
/* 뱃지가 작아진 만큼 담는 줄의 최소 높이도 줄인다 (원본 33px = 당첨뱃지 29px 수용용 고정값).
   대신 float 를 clear 해서 줄 높이가 내용에 맞춰 늘어나게 한다.
   → 당첨뱃지(.talk_icon_coupon, 29px)가 있으면 줄이 29px 로 자동 확장되어 넘치지 않는다. */
.mm-theme-v2.mm-talk .talk_con_icon { min-height: 24px; }
.mm-theme-v2.mm-talk .talk_con_icon::after { content: ''; display: block; clear: both; }

/* 글쓰기 플로팅 버튼 (position:fixed, margin-left:-70px 원형 유지) */
.mm-theme-v2.mm-talk .talk_write {
    background: var(--mm-primary);
    box-shadow: 0 6px 16px rgba(255, 56, 92, .35);
}

.mm-theme-v2.mm-talk .talk_block_msg {
    background: #fff8ec;
    border-radius: var(--mm-radius-sm);
    color: #b7743a;
}


/* ----- /talk 목록 (.mm-page-talk-list) ----- */

.mm-theme-v2.mm-page-talk-list .talk_cate_area {
    background: transparent;
    padding: 10px 12px 0;
}

/* ★ 명시도 주의: style.css 원본이 `.talk_Swiper ul.swiper-wrapper .talk_cateMenu`(0,3,1) 로
   radius/border/background/padding 을 잡는다. 마커만 붙인 `.mm-theme-v2.mm-page-talk-list
   .talk_cateMenu`(0,3,0) 는 요소선택자 하나 차이로 진다. 같은 체인을 그대로 이어붙여 이긴다.
   Swiper 가 슬라이드 폭을 계산하므로 min-width 는 원본 인라인 값(100px)을 유지. */
/* 슬라이드를 내용 폭에 맞춘다 (JS: slidesPerView:'auto'). 원본은 슬라이드가 2.8개 기준으로
   고정폭이고 알약이 width:100% 라 "전체" 같은 짧은 탭에 105px 가 낭비됐다. */
.mm-theme-v2.mm-page-talk-list .talk_Swiper .swiper-slide { width: auto; }

.mm-theme-v2.mm-page-talk-list .talk_Swiper ul.swiper-wrapper .talk_cateMenu {
    width: auto;
    min-width: 0;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-pill);
    background: var(--mm-card);
    color: var(--mm-text-sub);
    padding: 6px 14px;
    font-size: .82rem;
    line-height: 1.4;
    white-space: nowrap;
    transition: background var(--mm-tx), border-color var(--mm-tx), color var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-list .talk_Swiper ul.swiper-wrapper .talk_cateMenu a {
    color: var(--mm-text-sub);
    font-weight: 500;
    font-size: inherit;
}
.mm-theme-v2.mm-page-talk-list .talk_Swiper ul.swiper-wrapper .talk_cateMenu.on {
    background: var(--mm-primary);
    border-color: var(--mm-primary);
    color: #fff;
}
.mm-theme-v2.mm-page-talk-list .talk_Swiper ul.swiper-wrapper .talk_cateMenu.on a,
.mm-theme-v2.mm-page-talk-list .talk_Swiper ul.swiper-wrapper .talk_cateMenu a.on { color: #fff; }

.mm-theme-v2.mm-page-talk-list .talk_search_area { padding: 10px 12px 12px; margin-top: 0; }
.mm-theme-v2.mm-page-talk-list .talk_search {
    height: 44px;
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-pill);
}
.mm-theme-v2.mm-page-talk-list .talk_search input[name="keyword"] { background: transparent; }
.mm-theme-v2.mm-page-talk-list .talk_search_btn { top: 5px; color: var(--mm-muted); }

/* 공지 스트립 → 카드 */
.mm-theme-v2.mm-page-talk-list .talk_notice_area {
    border-top: 0;
    min-height: 0;
    background: transparent;
}
.mm-theme-v2.mm-page-talk-list .talk_notice { padding: 0 var(--mm-gap) 10px; }
.mm-theme-v2.mm-page-talk-list .talk_notice_con {
    background: var(--mm-card);
    border-radius: var(--mm-radius-md);
    box-shadow: var(--mm-shadow-card);
    padding: 12px 14px;
    font-size: .9rem;
}
.mm-theme-v2.mm-page-talk-list .talk_notice_con a { color: var(--mm-text); }
.mm-theme-v2.mm-page-talk-list .talk_notice_line { display: none; }   /* 10px 회색 바 → 카드 간격이 대체 */

/* 게시글 행 → 카드. style.css 에 .talk_view 정의가 없어 충돌 없음 */
.mm-theme-v2.mm-page-talk-list ul.talk_view,
.mm-theme-v2.mm-page-talk-list ul.talk_view_report {
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    margin: 0 var(--mm-gap) var(--mm-gap);
    overflow: hidden;
    transition: box-shadow var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-list ul.talk_view:hover { box-shadow: 0 4px 12px rgba(0,0,0,.06), 0 0 0 .5px rgba(0,0,0,.06); }
.mm-theme-v2.mm-page-talk-list .talk_contents { padding: var(--mm-pad-card); }
.mm-theme-v2.mm-page-talk-list .talk_contents_line { display: none; }  /* 10px 회색 구분바 제거 */
.mm-theme-v2.mm-page-talk-list .talk_comment { border-top: 1px solid var(--mm-divider); }
.mm-theme-v2.mm-page-talk-list .talk_info { color: var(--mm-muted); font-size: .8rem; }

/* talk_list.blade.php 인라인에서 이관 (AJAX 페이징 응답마다 중복 삽입되던 것) */
.mm-theme-v2.mm-page-talk-list .thumbnail-wrapper {
    position: relative; width: 80px; height: 80px; flex-shrink: 0;
    border-radius: var(--mm-radius-sm); overflow: hidden;
    float: right; margin-left: 10px;
}
.mm-theme-v2.mm-page-talk-list .thumbnail {
    width: 100%; height: 100%; object-fit: cover; display: block;
    border-radius: var(--mm-radius-sm);
}
.mm-theme-v2.mm-page-talk-list .img-count {
    position: absolute; top: 0; left: 0;
    background: rgba(0,0,0,.6); color: #fff; font-size: .7rem;
    width: 25px; height: 25px; text-align: center; line-height: 25px;
    border-top-left-radius: 8px; border-bottom-right-radius: 8px;
}


/* ----- /talk/view, /talk/notice/{id}, /talk/edit — 본문 카드 -----
   .talk_contents_area 는 style.css 에서 width:100% → margin 을 주려면 width:auto 필수 */
.mm-theme-v2.mm-page-talk-view .talk_contents_area,
.mm-theme-v2.mm-page-talk-notice .talk_contents_area,
.mm-theme-v2.mm-page-talk-edit .talk_contents_area {
    width: auto;
    margin: var(--mm-gap);
    padding: 4px;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-talk-view .talk_comment { border-top: 1px solid var(--mm-divider); }
.mm-theme-v2.mm-page-talk-view .talk_view_con div.contents,
.mm-theme-v2.mm-page-talk-notice .talk_view_con div.contents {
    border-top: 1px solid var(--mm-divider);
    color: var(--mm-text-sub);
}
.mm-theme-v2.mm-page-talk-view .talk_view_con .nick,
.mm-theme-v2.mm-page-talk-notice .talk_view_con .nick { font-weight: 600; color: var(--mm-text); }
.mm-theme-v2.mm-page-talk-view .talk_view_con .date,
.mm-theme-v2.mm-page-talk-notice .talk_view_con .date { color: var(--mm-muted); font-size: .78rem; }


/* ----- /talk/write (.mm-page-talk-write) — 인라인 54줄 이관 -----
   .talk_write_select{height:50px;position:relative} 은 앵커 → 원형 유지
   .talk_write_submit_area / .talk_policy_wrap 은 position:fixed → 원형 유지 */
.mm-theme-v2.mm-page-talk-write .talk_write_guide {
    background: #fff8ec;
    border-radius: var(--mm-radius-sm);
    color: #b7743a;
}
.mm-theme-v2.mm-page-talk-write .talk_write_con {
    background: #fbfcfd;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    transition: border-color var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-write .talk_write_con:focus { border-color: var(--mm-primary); background: var(--mm-card); }
.mm-theme-v2.mm-page-talk-write .talk_write_submit_area { border-top: 1px solid var(--mm-border); background: var(--mm-card); }

.mm-theme-v2.mm-page-talk-write .reserve_area {
    width: 100%; padding: 25px 15px; display: flex; flex-direction: row; flex-wrap: wrap;
    border-bottom: 7px solid #f4f5f9;
}
.mm-theme-v2.mm-page-talk-write .item_reserve {
    width: 100%; border: 1px solid var(--mm-border); border-radius: var(--mm-radius-md);
    box-shadow: var(--mm-shadow-card); margin: 20px 0; cursor: pointer;
    transition: border-color var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-write .item_reserve.on { border: 1px solid var(--mm-primary); }
.mm-theme-v2.mm-page-talk-write .item_reserve b { color: var(--mm-primary); }
.mm-theme-v2.mm-page-talk-write .item_reserve_disable {
    width: 100%; background: #eee; border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md); min-height: 142px;
    box-shadow: var(--mm-shadow-card); margin: 20px 0;
}
.mm-theme-v2.mm-page-talk-write .item_reserve_price { width: 100%; padding: 15px; font-size: 1.3rem; font-weight: 600; }
.mm-theme-v2.mm-page-talk-write .item_reserve_price span { font-size: .9rem; font-weight: 300; }
.mm-theme-v2.mm-page-talk-write .item_reserve_no { width: 100%; padding: 20px; text-align: center; font-size: 1.1rem; color: var(--mm-disabled); }
.mm-theme-v2.mm-page-talk-write .item_reserve_cancle {
    width: 100%; border: 1px solid var(--mm-border); border-radius: var(--mm-radius-md);
    box-shadow: var(--mm-shadow-card); margin: 20px 0; cursor: pointer;
}
.mm-theme-v2.mm-page-talk-write .item_reserve_cancle.on { border: 1px solid var(--mm-primary); }
.mm-theme-v2.mm-page-talk-write .reserve_submit {
    width: 100%; border-radius: var(--mm-radius-md); color: #636363; background: #ddd;
    padding: 15px; font-weight: 600;
}
.mm-theme-v2.mm-page-talk-write .reserve_submit.on { color: #fff; background: var(--mm-primary); }
.mm-theme-v2.mm-page-talk-write .close_reserve { cursor: pointer; }
.mm-theme-v2.mm-page-talk-write .counpon_info {
    border-top: 1px solid var(--mm-border); padding: 10px 15px; line-height: 1.4rem;
    background: #f7f7f7;
    border-bottom-left-radius: var(--mm-radius-md); border-bottom-right-radius: var(--mm-radius-md);
}
.mm-theme-v2.mm-page-talk-write .reserve_date { font-size: .9rem; font-weight: 400; margin-top: 5px; }
.mm-theme-v2.mm-page-talk-write .review_point_a { width: 100%; font-size: .8rem; padding: 10px 0 10px 10px; }
.mm-theme-v2.mm-page-talk-write .review_p_title { margin-bottom: 5px; }
.mm-theme-v2.mm-page-talk-write .review_point_a em { color: #1273e4; }
.mm-theme-v2.mm-page-talk-write .pic_add { position: relative; }   /* .review_not_open 의 앵커 — 유지 필수 */
.mm-theme-v2.mm-page-talk-write .review_not_open {
    width: 200px; position: absolute; top: -35px; left: 10px;
    font-size: .75rem; background: #fffafa;
    border: 1px solid #ff6450; border-radius: .4em;
    padding: 5px 10px; color: #ff7260; font-weight: 400;
}
.mm-theme-v2.mm-page-talk-write .review_not_open:after {
    content: ''; position: absolute; bottom: 0; left: 10px;
    width: 0; height: 0; border: 8px solid transparent;
    border-top-color: #ff6450; border-bottom: 0; border-left: 0;
    margin-left: -5px; margin-bottom: -8px;
}
.mm-theme-v2.mm-page-talk-write .my-dining-item-wrap.on {
    margin: 15px 0; border: 1.5px solid #ff7260; border-radius: var(--mm-radius-sm);
}


/* =========================================================
   Phase 4 — MY마맵 경계 4장
   /coupon(reserve.coupon) · /zzim_list · /recent_shops · /event(event.index)

   ★ 샵 카드 파샬(main.list_common / foreign.list_common)은 건드리지 않는다.
     .n_list_shopImg / .n_list_shopSub / .ad_mark / .partner_mark 는 검색·메인·상세와
     공유하는 최다 공유 컴포넌트다. 여기만 바꾸면 경계가 한 겹 더 생긴다.
   ========================================================= */

/* ----- /coupon (.mm-page-coupon) ----- */
.mm-theme-v2.mm-page-coupon .coupon_area {
    width: 100%;
    padding: 16px var(--mm-gap);
    display: flex; flex-direction: row; flex-wrap: wrap;
    border-bottom: 0;
}
.mm-theme-v2.mm-page-coupon .coupon_put { width: calc(100% - 90px); }
.mm-theme-v2.mm-page-coupon .coupon_put input {
    width: 100%; height: 46px; padding: 15px 12px;
    border: 1px solid var(--mm-border);
    background: var(--mm-card);
    border-radius: var(--mm-radius-md);
    font-size: .9rem;
    transition: border-color var(--mm-tx);
}
.mm-theme-v2.mm-page-coupon .coupon_put input:focus { border-color: var(--mm-primary); }
.mm-theme-v2.mm-page-coupon .coupon_btn { width: 90px; }
.mm-theme-v2.mm-page-coupon .coupon_btn button {
    width: 80px; float: right; padding: 15px 5px;
    font-size: .9rem; font-weight: 700; color: #fff;
    background: var(--mm-primary);
    border: 0; border-radius: var(--mm-radius-md);
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-coupon .coupon_btn button:hover { background: var(--mm-primary-hover); }

/* 보유 쿠폰목록 카드 — style.css .c_course_info 는 width:100% + border-bottom:7px */
.mm-theme-v2.mm-page-coupon .c_course_info {
    width: auto;
    margin: 0 var(--mm-gap) var(--mm-gap);
    padding: var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    border-bottom: 0;
    font-size: .9rem;
}
/* ★ style.css `.title_1{position:absolute;width:50px;height:50px;background:url(icon)}` 이
   제목 텍스트에 그대로 걸려 있다. `.c_course_info p.title_1` 은 색·크기만 덮고
   position 을 풀지 않아 제목이 50px 박스를 넘쳐 떠 있었다. 스코프 안에서 정상화. */
.mm-theme-v2.mm-page-coupon .c_course_info p.title_1 {
    position: static;
    width: auto; height: auto;
    background: none;
    color: var(--mm-text);
    font-size: 1rem; font-weight: 700;
    margin: 0 0 12px;
    padding: 0;
}

.mm-theme-v2.mm-page-coupon .item_coupon,
.mm-theme-v2.mm-page-coupon .item_coupon_cancle {
    width: 100%;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    box-shadow: var(--mm-shadow-card);
    margin: 12px 0;
    cursor: pointer;
    transition: border-color var(--mm-tx);
}
.mm-theme-v2.mm-page-coupon .item_coupon { min-height: 142px; }
.mm-theme-v2.mm-page-coupon .item_coupon.on,
.mm-theme-v2.mm-page-coupon .item_coupon_cancle.on { border-color: var(--mm-primary); }
.mm-theme-v2.mm-page-coupon .item_coupon b { color: var(--mm-primary); }
.mm-theme-v2.mm-page-coupon .item_coupon_disable {
    width: 100%; background: #f2f4f6;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    min-height: 142px; box-shadow: var(--mm-shadow-card); margin: 12px 0;
}
.mm-theme-v2.mm-page-coupon .item_coupon_price {
    width: 100%; padding: 15px; font-size: 1.25rem; font-weight: 600; min-height: 100px;
}
.mm-theme-v2.mm-page-coupon .item_coupon_price span { font-size: .9rem; font-weight: 300; }
.mm-theme-v2.mm-page-coupon .coupon_date { font-size: .85rem; font-weight: 400; margin-top: 5px; color: var(--mm-muted); }
.mm-theme-v2.mm-page-coupon .coupon_n_price { font-size: 1.15rem; color: var(--mm-text); }
.mm-theme-v2.mm-page-coupon .item_coupon_no {
    width: 100%; padding: 48px 20px; text-align: center;
    font-size: .95rem; color: var(--mm-disabled);
}
.mm-theme-v2.mm-page-coupon .counpon_info {
    border-top: 1px solid var(--mm-divider);
    padding: 10px 15px; line-height: 1.4rem;
    background: #fbfcfd;
    color: var(--mm-text-sub);
    border-bottom-left-radius: var(--mm-radius-md);
    border-bottom-right-radius: var(--mm-radius-md);
}


/* ----- /zzim_list + /recent_shops 공통 (.mm-page-zzim / .mm-page-recent) -----
   .AD_list_shop_box 는 style.css width:100% + padding + border-bottom:10px.
   margin 을 주므로 width:auto 필수. 안쪽 샵 카드(list_common)는 원형 유지. */
.mm-theme-v2.mm-page-zzim .AD_list_shop_area,
.mm-theme-v2.mm-page-recent .AD_list_shop_area { width: 100%; float: none; }

.mm-theme-v2.mm-page-zzim .AD_list_shop_box,
.mm-theme-v2.mm-page-recent .AD_list_shop_box {
    width: auto;
    margin: var(--mm-gap);
    padding: 4px 10px 10px;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    border-bottom: 0;
}

/* 섹션 타이틀 행 (zzim 은 .ad_title_1, recent 는 인라인 style → 클래스로 통일) */
.mm-theme-v2.mm-page-zzim .AD_list_shop_box div.ad_title_1,
.mm-theme-v2.mm-page-recent .AD_list_shop_box div.ad_title_1 {
    width: 100%;
    padding: 14px 0 6px;
    position: relative;
    font-size: 1rem;
    font-weight: 700;
    color: var(--mm-text);
    border-bottom: 1px solid var(--mm-divider);
    margin-bottom: 4px;
}
.mm-theme-v2.mm-page-zzim .AD_list_shop_box div.ad_title_1 label,
.mm-theme-v2.mm-page-recent .AD_list_shop_box div.ad_title_1 label {
    position: absolute; right: 4px; top: 14px;
    font-size: .85rem; font-weight: 400;
    color: var(--mm-muted);
    cursor: pointer;
}
.mm-theme-v2.mm-page-zzim .AD_list_shop_box div.ad_title_1 label i,
.mm-theme-v2.mm-page-recent .AD_list_shop_box div.ad_title_1 label i { font-size: .9rem; }

/* 비회원 안내 스트립 */
.mm-theme-v2.mm-page-zzim .choice_guide {
    width: auto;
    margin: var(--mm-gap) var(--mm-gap) 0;
    padding: 12px 14px;
    font-size: .85rem;
    color: var(--mm-muted);
    background: var(--mm-card);
    border-radius: var(--mm-radius-md);
    box-shadow: var(--mm-shadow-card);
}

/* 빈 상태 */
.mm-theme-v2.mm-page-zzim .choice_not,
.mm-theme-v2.mm-page-recent .recent_empty {
    padding-top: 30%;
    width: 100%;
    height: 50vh;
    font-size: .95rem;
    font-weight: 600;
    color: var(--mm-disabled);
    text-align: center;
}


/* ----- /event (.mm-page-event) ----- */
.mm-theme-v2.mm-page-event .my_event_list_area {
    width: auto;
    margin: var(--mm-gap);
    padding: 4px var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
}
.mm-theme-v2.mm-page-event .my_event_list_area ul { width: 100%; margin-bottom: 0; }
.mm-theme-v2.mm-page-event .my_event_list_area ul li {
    padding: 16px 0;
    border-bottom: 1px solid var(--mm-divider);
    cursor: pointer;
}
.mm-theme-v2.mm-page-event .my_event_list_area ul li:last-child { border-bottom: 0; }

.mm-theme-v2.mm-page-event .event_list_i,
.mm-theme-v2.mm-page-event .end_event_list_i { width: 100%; }
/* 제목·기간에도 상세 링크를 걸었다(배너 없는 이벤트도 들어갈 수 있도록).
   a 가 자체 color 를 가지므로 셀 색을 그대로 상속시키고, 셀 전체를 클릭 면적으로 만든다. */
.mm-theme-v2.mm-page-event td.e_title a,
.mm-theme-v2.mm-page-event td.e_date a { color: inherit; display: block; }
.mm-theme-v2.mm-page-event .event_list_i td { padding: 4px 0; }
.mm-theme-v2.mm-page-event .event_list_i td.e_title {
    font-size: 1rem; font-weight: 600; color: var(--mm-text);
}
.mm-theme-v2.mm-page-event .event_list_i td.e_date { font-size: .82rem; color: var(--mm-muted); }
.mm-theme-v2.mm-page-event .end_event_list_i td { padding: 4px 0; color: var(--mm-disabled); }
.mm-theme-v2.mm-page-event .end_event_list_i td img { opacity: .5; }
.mm-theme-v2.mm-page-event td.e_img img {
    width: 100%; max-width: 100%; height: auto;
    border-radius: var(--mm-radius-sm);
    margin-top: 6px;
}


/* =========================================================
   마사지톡 상세 — 댓글 섹션 (.mm-page-talk-view)
   .talk_comment_area 는 본문 카드(.talk_contents_area)의 형제라 회색 배경에 맨몸으로 붙는다.
   원본 트랩:
     .talk_comment_area { width:100%; padding:10px; position:relative }  ← margin 주려면 width:auto
     .talk_comment_list { width:100%; background:#fff }
     .talk_comment_list ul li { position:relative }   ← .cmt_del / .cmt_user_block 의 앵커. 유지 필수
     .talk_comment_list ul li div.profile { float:left }
     .talk_comment_list ul li div.contents { padding-left:43px }  ← 아바타 아래 정렬. 유지
   건드리지 않음: .talk_com_sym / .talk_com_count / .talk_com_sym_btn (배경 스프라이트)
   ========================================================= */

/* 공감·댓글 카운터 줄 (본문 카드 안) */
.mm-theme-v2.mm-page-talk-view .talk_view_comment {
    border-top: 1px solid var(--mm-divider);
    border-bottom: 0;
}

/* 댓글 목록 → 카드 */
.mm-theme-v2.mm-page-talk-view .talk_comment_area {
    width: auto;
    margin: 0 var(--mm-gap) var(--mm-gap);
    padding: 4px var(--mm-pad-card);
    min-height: 0;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list {
    width: 100%;
    min-height: 0;
    background: transparent;
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li {
    width: 100%;
    margin: 0;
    padding: 16px 0;
    line-height: 22px;
    position: relative;                 /* .cmt_del / .cmt_user_block 앵커 — 유지 */
    border-bottom: 1px solid var(--mm-divider);
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li:last-child { border-bottom: 0; }
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.profile img {
    border-radius: 50%;
    background: var(--mm-divider);
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.nickname {
    font-size: .85rem; font-weight: 600; color: var(--mm-text);
    position: relative;      /* .cmt_user_block(점 3개) 의 앵커 — 없으면 li 기준이라 16px 위로 뜬다 */
    min-height: 22px;        /* li line-height 와 동일 */
    padding-right: 28px;     /* 긴 닉네임이 버튼 밑으로 들어가지 않게 */
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.date {
    font-size: .75rem; color: var(--mm-muted);
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.contents {
    color: var(--mm-text-sub);
    margin-top: 2px;
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.cmt_del {
    color: var(--mm-muted);
    text-decoration: none;
    font-size: .75rem;
    top: 16px;               /* li padding-top 과 일치 → 닉네임 줄에 정렬 */
    right: 0;
    line-height: 22px;
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.cmt_del:hover { color: var(--mm-primary); }
.mm-theme-v2.mm-page-talk-view .cmt_user_block i { color: var(--mm-disabled); }

/* 빈 상태 — .comment_not 은 이미 blade 의 @empty 로 렌더된다 */
.mm-theme-v2.mm-page-talk-view .talk_comment_area div.comment_not,
.mm-theme-v2.mm-page-talk-view .comment_not {
    width: 100%;
    min-height: 0;
    padding: 48px 0;
    text-align: center;
    font-size: .95rem;
    line-height: 1.6;
    color: var(--mm-disabled);
}

/* 하단 고정 댓글 입력창 (position:fixed, z-index:5 — 원형 유지) */
.mm-theme-v2.mm-page-talk-view .talk_view_comment_write {
    border-top: 1px solid var(--mm-border);
    background: var(--mm-card);
}
.mm-theme-v2.mm-page-talk-view .view_comment textarea {
    background: #fbfcfd;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    transition: border-color var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-view .view_comment textarea:focus {
    border-color: var(--mm-primary);
    background: var(--mm-card);
}
.mm-theme-v2.mm-page-talk-view .view_comment input {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
    font-weight: 700;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-view .view_comment input:hover { background: var(--mm-primary-hover); }


/* 하단 고정 바(80px)가 있는 페이지는 여백을 확보해야 마지막 내용이 안 가린다.
   원본 .bottom_margin 은 min-height:100px + padding:15px 였는데 공통 규칙에서 24px 로 줄였다. */
.mm-theme-v2.mm-page-talk-view .bottom_margin,
.mm-theme-v2.mm-page-talk-write .bottom_margin,
.mm-theme-v2.mm-page-talk-edit .bottom_margin { height: 100px; }

/* 댓글 우측 액션 버튼 정렬
   원본: .cmt_user_block{position:absolute;top:0;right:10px}  .cmt_del{position:absolute;top:0;right:0}
   둘 다 기준점이 li(position:relative) 라서, li 에 padding-top:16px 을 준 뒤로
   닉네임 줄보다 16px 위에 붙어 있었다.
   → .nickname 을 앵커로 만들어 점3개 버튼을 닉네임 줄에 정렬하고,
     li 직계 자식인 .cmt_del 은 li padding-top 만큼 내린다. */
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.cmt_user_block {
    position: absolute;
    top: 0;
    right: 0;
    float: none;
    width: 24px;
    height: 22px;          /* li 의 line-height 와 동일 → 아이콘이 닉네임 줄 중앙 */
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.cmt_user_block i {
    font-size: 1.1rem;
    line-height: 1;
    color: var(--mm-disabled);
    transition: color var(--mm-tx);
}
.mm-theme-v2.mm-page-talk-view .talk_comment_list ul li div.cmt_user_block:hover i { color: var(--mm-muted); }

/* 공지글 제목 (/talk/notice/{id})
   Bbs.title 을 출력하는 코드가 없어 제목이 안 보였다. 새로 넣은 요소이므로 전용 클래스 사용. */
.mm-theme-v2.mm-page-talk-notice .mm-notice-title {
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.45;
    color: var(--mm-text);
    margin: 0 0 10px;
    word-break: break-word;
    overflow-wrap: anywhere;
}
.mm-theme-v2.mm-page-talk-notice .talk_view_con div.nick { color: var(--mm-text); }
.mm-theme-v2.mm-page-talk-notice .talk_view_con div.date { color: var(--mm-muted); }


/* =========================================================
   인증 플로우 (Phase 5)
   스코프: .mm-auth = 8장 공통 폼 / .mm-page-{login,register,register-sns,
           join-agree,join-step2,find-pw,set-pw,hp-auth}

   ★ 건드리지 않는 것 (브랜드 자산·앱 브릿지):
     .login_kakao/.login_apple/.login_google/.login_naver/.login_facebook 의 배경색·배경이미지
     (.login_naver/.login_facebook 은 style.css 에서 background:url(...) 퍼센트 좌표 사용)
     send_ios('login'/'applelogin'/'kakaologin') 호출부

   ★ 명시도: 원본 최대가 `.login_area li div.login_submit`(0,2,2).
     `.mm-theme-v2.mm-auth .login_submit`(0,3,0) 은 클래스 수가 더 많아 이긴다.
     (b 값을 먼저 비교하므로 요소 개수는 무관 — 카테고리 탭 때와 다른 경우)

   ★ .login_area ul{float:left} → 카드 높이 붕괴. float:none 필수.
   ★ .login_area{width:100%} → margin 주려면 width:auto 필수.
   ========================================================= */

/* ----- 공통 폼 카드 ----- */
.mm-theme-v2.mm-auth .login_area,
.mm-theme-v2.mm-auth .join_step1_area,
.mm-theme-v2.mm-auth .fpwd_area {
    width: auto;
    margin: var(--mm-gap);
    padding: 4px var(--mm-pad-card) 24px;
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    font-size: 1rem;
}
.mm-theme-v2.mm-auth .login_area ul,
.mm-theme-v2.mm-auth .join_step1_area ul,
.mm-theme-v2.mm-auth .fpwd_area ul { float: none; width: 100%; }

/* 섹션 제목 / 안내 문구 */
.mm-theme-v2.mm-auth .e_join_step2_ment {
    padding: 16px 0 12px;
    text-align: left;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--mm-text);
}
.mm-theme-v2.mm-auth .e_login_ment { padding: 24px 0 12px; text-align: center; }
.mm-theme-v2.mm-auth .nick_title { font-size: .8rem; color: var(--mm-muted); margin-bottom: 6px; }
.mm-theme-v2.mm-auth .nick_title_2 { color: var(--mm-muted); }

/* 입력 필드 — 원본은 밑줄 스타일, 카드 톤에 맞춰 라운드 박스로 */
.mm-theme-v2.mm-auth input[type="text"],
.mm-theme-v2.mm-auth input[type="password"],
.mm-theme-v2.mm-auth input[type="email"],
.mm-theme-v2.mm-auth input[type="tel"],
.mm-theme-v2.mm-auth .nick_input {
    border: 1px solid var(--mm-border);
    border-bottom: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: #fbfcfd;
    /* common.css 가 input 에 height:36px 을 고정한다(box-sizing:border-box).
       그대로 두면 패딩을 키워도 높이가 안 늘고 글자 영역만 눌린다. */
    height: auto;
    padding: 13px 12px;
    transition: border-color var(--mm-tx), background var(--mm-tx);
}
.mm-theme-v2.mm-auth input:focus,
.mm-theme-v2.mm-auth .nick_input:focus {
    border-color: var(--mm-primary);
    background: var(--mm-card);
}
/* 닉네임·인증번호처럼 옆에 버튼이 붙는 입력은 폭 유지 */
.mm-theme-v2.mm-auth .login_area li input.nick_input,
.mm-theme-v2.mm-auth .login_area li input.phone_input { width: 70%; margin-bottom: 0; }
.mm-theme-v2.mm-auth .login_area li input.phone_input {
    border: none; background: transparent; padding: 12px 0;
}
.mm-theme-v2.mm-auth .login_area li input.phone_input::placeholder { color: var(--mm-primary); }

/* 제출 버튼 — 활성은 테마 포인트(#FF385C), 비활성은 회색. 원본은 #e10000 */
.mm-theme-v2.mm-auth .login_submit_ok,
.mm-theme-v2.mm-auth .join_submit_ok,
.mm-theme-v2.mm-auth .fpwd_submit_ok {
    width: 100%;
    padding: 14px 10px;
    border-radius: var(--mm-radius-md);
    background: var(--mm-primary);
    color: #fff;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-auth .login_submit_ok:hover,
.mm-theme-v2.mm-auth .join_submit_ok:hover,
.mm-theme-v2.mm-auth .fpwd_submit_ok:hover { background: var(--mm-primary-hover); }

.mm-theme-v2.mm-auth .login_submit,
.mm-theme-v2.mm-auth .join_submit,
.mm-theme-v2.mm-auth .fpwd_submit {
    width: 100%;
    padding: 14px 10px;
    border-radius: var(--mm-radius-md);
    background: #d7dbe0;
    color: #fff;
    font-weight: 700;
    text-align: center;
}
.mm-theme-v2.mm-auth .login_submit_area,
.mm-theme-v2.mm-auth .join_submit_area,
.mm-theme-v2.mm-auth .fpwd_submit_area { padding-top: 16px; }

/* 보조 링크 */
.mm-theme-v2.mm-auth .join_b { color: var(--mm-muted); float: right; padding: 5px 0; font-size: .85rem; }
.mm-theme-v2.mm-auth .pwd_find a { color: var(--mm-muted); font-size: .85rem; }
.mm-theme-v2.mm-auth .join_b a { color: var(--mm-primary); font-weight: 600; }


/* ----- /login 전용 (.mm-page-login) -----
   SNS 버튼 3종은 blade 인라인 <style> 에서 이관. 브랜드 색상·크기 원본 그대로. */
.mm-theme-v2.mm-page-login .login_event_area { width: 100%; padding: 0 15px 15px; margin: 10px 0 0; }
.mm-theme-v2.mm-page-login .login_event { max-width: 600px; max-height: 150px; text-align: center; margin: 0 auto; }
.mm-theme-v2.mm-page-login .login_event img { width: auto; max-height: 150px; background-position: center; }

.mm-theme-v2.mm-page-login .login_apple { width: 100%; height: 50px; background: #000; border-radius: var(--mm-radius-md); text-align: center; }
.mm-theme-v2.mm-page-login .apple_ico { width: 210px; height: 50px; color: #fff; margin: 0 auto; line-height: 50px; font-size: 1rem; background: #000; }
.mm-theme-v2.mm-page-login .apple_ico img { margin-right: 8px; margin-top: -4px; }

.mm-theme-v2.mm-page-login .login_kakao { width: 100%; height: 50px; background: #fce51e; border-radius: var(--mm-radius-md); text-align: center; }
.mm-theme-v2.mm-page-login .kakao_ico { width: 210px; height: 50px; color: #000; margin: 0 auto; line-height: 50px; font-size: 1rem; }
.mm-theme-v2.mm-page-login .kakao_ico img { margin-right: 8px; margin-top: -4px; }

.mm-theme-v2.mm-page-login .login_google { width: 100%; height: 50px; background: #fff; border: 1px solid var(--mm-border-strong, #cfd5dc); border-radius: var(--mm-radius-md); text-align: center; }
.mm-theme-v2.mm-page-login .google_ico { width: 210px; height: 50px; color: #000; margin: 0 auto; line-height: 50px; font-size: 1rem; }
.mm-theme-v2.mm-page-login .google_ico img { margin-right: 8px; margin-top: -4px; }

/* 네이버·페이스북은 style.css 의 background:url(...) 좌표에 의존 → radius 만 맞춘다 */
.mm-theme-v2.mm-page-login .login_naver,
.mm-theme-v2.mm-page-login .login_facebook { border-radius: var(--mm-radius-md); }

/* SNS 버튼 사이 간격 — li 의 상하 패딩 5px 이 양쪽에서 더해지므로 실제 간격은 +10px.
   ul > li 전체를 줄이면 이메일·패스워드 행 간격까지 같이 줄어 SNS 3행만 지정한다. */
.mm-theme-v2.mm-page-login .login_area ul > li { margin-bottom: 10px; }
/* ★ 명시도: 애플 행은 클래스(.apple_api_login), 나머지는 id 다. 클래스만 쓰면 위 규칙
   `.login_area ul > li`(0,3,2) 에 요소 개수로 밀려 애플 행만 안 먹는다. li 를 붙여 이긴다. */
.mm-theme-v2.mm-page-login .login_area ul > li#kakao_api_login,
.mm-theme-v2.mm-page-login .login_area ul > li.apple_api_login,
.mm-theme-v2.mm-page-login .login_area ul > li#google_api_login { margin-bottom: 2px; }

/* 입력 필드·제출 버튼 사이 여백 축소 (/login, /find_pw)
   원본은 input 자체 margin-bottom(로그인 10px, 비번찾기 30px)이 li 간격과 겹쳐
   필드 사이 30px, 버튼 앞 41~51px 까지 벌어졌다. input 여백을 0 으로 두고
   li 간격만으로 리듬을 잡는다. */
.mm-theme-v2.mm-page-login .login_area li input,
.mm-theme-v2.mm-page-find-pw .fpwd_area li input { margin-bottom: 0; }
/* 이메일·패스워드 행 간격을 SNS 버튼 간격(12px)과 동일하게. li 상하 패딩 5px 이 더해져 2+5+5=12 */
.mm-theme-v2.mm-page-login .login_area ul > li.login_input_li { margin-bottom: 2px; }
/* 패스워드 행 mb 가 10 → 2 로 줄어든 만큼 버튼 앞 여백(23px)을 padding 으로 되돌린다 */
.mm-theme-v2.mm-page-login .login_submit_area { padding-top: 16px; }


/* ----- /register (.mm-page-register) -----
   style.css `.login_area li.join_step2_li` 가 밑줄(border-bottom)과 margin-bottom:45px 를
   갖고 있어 카드형 입력과 겹쳐 보였다. 밑줄을 없애고 간격을 /login 리듬(12px)에 맞춘다. */
/* li 의 상하 패딩 5px 이 양쪽에서 더해지므로 8+5+5 = 18px 이 실제 여백이 된다.
   (필드 사이에 라벨이 끼는 구조라 입력창끼리의 거리는 라벨 높이만큼 더 벌어진다) */
.mm-theme-v2.mm-page-register .login_area li.join_step2_li {
    border-bottom: 0;
    margin-bottom: 8px;
}
/* 입력은 카드 폭 전체로. 닉네임 행만 옆에 '딴거할래요' 버튼이 붙어 70% 를 유지한다. */
.mm-theme-v2.mm-page-register .login_area li input.nick_input { width: 100%; }
.mm-theme-v2.mm-page-register .login_area li.nick_row input.nick_input { width: 70%; }
/* 닉네임 행 아래 '추천 닉네임이에요!'(position:absolute) 가 들어갈 자리 확보 */
.mm-theme-v2.mm-page-register .login_area li.nick_row { margin-bottom: 30px; }
/* 입력 묶음과 버튼을 시각적으로 분리 — 마지막 입력 → 버튼 37px (8 + 5 + 24) */
.mm-theme-v2.mm-page-register .login_submit_area { padding-top: 24px; }

/* 휴대폰번호(readonly) — 밑줄이 사라졌으므로 다른 필드와 같은 박스로, 톤만 비활성 */
.mm-theme-v2.mm-page-register .login_area li input.phone_input {
    width: 100%;
    height: auto;
    padding: 13px 12px;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: var(--mm-divider);
    color: var(--mm-muted);
}

/* ----- /join_agree (.mm-page-join-agree) ----- */
.mm-theme-v2.mm-page-join-agree .all_check_a {
    width: 100%;
    padding: 14px;
    background: var(--mm-divider);
    border-radius: var(--mm-radius-md);
}
.mm-theme-v2.mm-page-join-agree .agreement {
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    padding: 14px;
    margin-top: 14px;
}
.mm-theme-v2.mm-page-join-agree div.checks label { padding-top: 15px; }
.mm-theme-v2.mm-auth input[type="checkbox"],
.mm-theme-v2.mm-auth input[type="radio"] { accent-color: var(--mm-primary); }


/* ----- /find_pw (.mm-page-find-pw) ----- */
.mm-theme-v2.mm-page-find-pw .find_pwd_area {
    width: auto;
    margin: var(--mm-gap);
    padding: var(--mm-pad-card);
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-find-pw .findpwd_ment { font-size: .82rem; color: var(--mm-muted); text-align: center; }
.mm-theme-v2.mm-page-set-pw .pw_reset_ment { font-size: .85rem; color: var(--mm-muted); }


/* ----- /hp_auth (.mm-page-hp-auth) — 휴대폰 인증
   blade 인라인 <style> 에서 이관. 카드·입력·제출버튼은 .mm-auth 공통이 이미 덮는다.
   .phone_input / .join_step2_li 밑줄은 register·join_step2 와 같은 style.css 클래스라
   페이지 마커 안에서만 손댄다. ----- */
.mm-theme-v2.mm-page-hp-auth .e_join_step2_ment1,
.mm-theme-v2.mm-page-not-user .e_join_step2_ment1 {
    padding: 16px 0 4px;
    text-align: left;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--mm-text);
}
.mm-theme-v2.mm-page-hp-auth .e_join_step2_ment2,
.mm-theme-v2.mm-page-not-user .e_join_step2_ment2 {
    font-size: .82rem;
    color: var(--mm-muted);
    padding: 0 0 24px;
}
.mm-theme-v2.mm-page-hp-auth .phone_con_btn {
    font-size: .85rem; width: 80px; height: 32px;
    border-radius: var(--mm-radius-pill); background: var(--mm-muted);
    color: #fff; text-align: center; line-height: 32px; cursor: pointer; float: right;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-hp-auth .phone_con_btn.on { background: var(--mm-primary); }
.mm-theme-v2.mm-page-hp-auth .re_phone_con_btn {
    color: var(--mm-muted); float: right; text-decoration: underline;
    font-size: .8rem; font-weight: 600; margin-top: 15px; cursor: pointer;
}
.mm-theme-v2.mm-page-hp-auth .time_count {
    font-size: .8rem; float: right; font-weight: 600; margin-top: -28px; color: var(--mm-primary);
}
.mm-theme-v2.mm-page-hp-auth .phone_alert1 {
    font-size: .8rem; color: var(--mm-primary); font-weight: 600;
    text-align: center; width: 100%; position: absolute; display: none;
}
.mm-theme-v2.mm-page-hp-auth .login_submit_area { padding-top: 30px; }


/* ----- /reserve/not_user, /foreign/reserve/not_user (.mm-page-not-user) — 비회원 예약조회
   국내·베트남 두 장이 같은 마크업이라 스코프를 공유한다.
   blade 인라인 <style> 에서 이관. 안내 문구 2줄은 위 hp-auth 와 규칙을 공유한다. ----- */
.mm-theme-v2.mm-page-not-user .login_submit_area { padding-top: 30px; }

/* 국내/베트남 전환 토글 — 선택된 쪽만 포인트색 테두리(원본은 #ff5903 오렌지) */
.mm-theme-v2.mm-page-not-user .d_map_more {
    width: calc(50% - 5px);
    height: 37px;
    padding: 10px;
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    font-size: .8rem;
    font-weight: 700;
    color: var(--mm-muted);
    text-align: center;
    margin: 13px 0 10px;
    cursor: pointer;
    transition: border-color var(--mm-tx), color var(--mm-tx), background var(--mm-tx);
}
.mm-theme-v2.mm-page-not-user .d_map_more a { display: block; color: inherit; }
.mm-theme-v2.mm-page-not-user .d_map_more.on {
    border-color: var(--mm-primary);
    color: var(--mm-primary);
    background: #fff5f7;                /* 포인트색 연한 틴트 — 토큰 없음, 이 스코프 전용 */
}


/* =========================================================
   예약내역 (Phase 6)
   스코프: .mm-page-reserve-list = /reserve/list + /foreign/reserve/list (마크업 동일)
           .mm-page-reserve-detail = /reserve/detail/{id}

   ★ 두 장 모두 blade 안에 <style> 이 있고 그 규칙이 head 의 이 파일보다 뒤에 온다.
     같은 명시도면 인라인이 이기므로, 여기 규칙은 .mm-theme-v2 + 페이지 마커(0,2,0)를
     앞에 붙여 명시도로 이긴다. (!important 사용 안 함)

   ★ 건드리지 않는 것:
     .badge.danger / .badge.common — 예약상태 의미를 색으로 구분한다(취소=주황).
     .cancel-hero.user .primary(#2f6df6) — '정상취소' 히어로의 파랑은 의미색.
   ========================================================= */

/* ----- 공통: 살몬 계열 강조색(#ff695b·#ff635b·#ff695b)을 테마 포인트색으로 ----- */

/* ----- /reserve/list ----- */
/* 국내/베트남 상단 탭 */
.mm-theme-v2.mm-page-reserve-list .n_Rlist_item.on {
    color: var(--mm-primary);
    border-bottom: 2px solid var(--mm-primary);
}
/* 상태 알약 탭 — 선택된 것만 포인트색 틴트 */
.mm-theme-v2.mm-page-reserve-list .n_Rlist_Sitem {
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    color: var(--mm-muted);
    border-radius: var(--mm-radius-pill);
    transition: border-color var(--mm-tx), color var(--mm-tx), background var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-list .n_Rlist_Sitem.on {
    border-color: var(--mm-primary);
    color: var(--mm-primary);
    background: #fff5f7;
}
/* 예약 카드 */
.mm-theme-v2.mm-page-reserve-list .my-dining-item {
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    border: 1px solid var(--mm-border);
}
/* 방문후기 작성 버튼 — ★색상은 원본 파랑(#1773e4) 유지(사용자 요청).
   예약 CTA(포인트색)와 성격이 다른 액션이라 색으로 구분한다.
   라운드·굵기 등 형태만 테마에 맞춘다. 목록·상세가 같은 클래스를 쓰므로 함께 지정. */
.mm-theme-v2.mm-page-reserve-list .my_review_w,
.mm-theme-v2.mm-page-reserve-detail .my_review_w {
    font-weight: 700;
    border-radius: var(--mm-radius-md);
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-list .my_review_w:hover,
.mm-theme-v2.mm-page-reserve-detail .my_review_w:hover { background: #1466cd; }

.mm-theme-v2.mm-page-reserve-list .my_review_c,
.mm-theme-v2.mm-page-reserve-detail .my_review_c {
    border-radius: var(--mm-radius-md);
    cursor: default;
}

/* ----- /reserve/detail ----- */
.mm-theme-v2.mm-page-reserve-detail .cancel-hero.shop .hero-actions .primary,
.mm-theme-v2.mm-page-reserve-detail .h_btn,
.mm-theme-v2.mm-page-reserve-detail .reserve_step_area div {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-detail .cancel-hero.shop .hero-actions .primary:hover,
.mm-theme-v2.mm-page-reserve-detail .h_btn:hover { background: var(--mm-primary-hover); }

/* 히어로·상세 카드 라운드/그림자 토큰화 */
.mm-theme-v2.mm-page-reserve-detail .cancel-hero {
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-reserve-detail .my-dining-item {
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    border: 1px solid var(--mm-border);
}
/* 샵정보 카드 → 예약번호 카드 간격을 카드 리듬(12px)에 맞춘다.
   ★ 실제 24px 을 만들던 건 카드가 아니라 부모 .my-dining-item-wrap 의 margin-bottom 이다
     (마진 상쇄로 카드의 값이 묻힌다). 그래서 부모까지 함께 12px 로 낮춰야 한다. */
.mm-theme-v2.mm-page-reserve-detail .my-dining-item-wrap { margin-bottom: 12px; }

/* 상태 배지(이용완료·예약신청·예약확정)
   ★ 원본 .reserve_step_area{height:30px} 안에 padding:7px + 1.1rem 짜리 div(37px)가 들어가
     7px 넘쳐서 아래 카드와의 간격이 어긋나 보였다. 높이 고정을 풀고 배지답게 줄인다. */
.mm-theme-v2.mm-page-reserve-detail .reserve_step_area {
    height: auto;
    padding: 0 6px;
    margin-bottom: 4px;
}
.mm-theme-v2.mm-page-reserve-detail .reserve_step_area > div {
    float: none;
    display: inline-block;
    width: auto;
    padding: 6px 14px;
    font-size: .85rem;
    border-radius: var(--mm-radius-pill);
}

/* 예약번호 / 결제정보 / 취소 및 환불 정책 — 구버전은 10px 회색 구분선으로 나뉜 흰 블록이었다.
   구분선을 없애고 각 섹션을 테마 카드로 띄운다. 카드 배경은 .reserve_list_area 가 맡는다
   (.N_list_shop_box 를 카드로 만들면 첫 블록의 예약카드와 카드가 겹친다). */
.mm-theme-v2.mm-page-reserve-detail .N_list_shop_box {
    background: transparent;
    border-bottom: 0;
}
/* 안쪽 행(.reserve_list_type*)이 자체 padding:10px 을 가지므로 카드 패딩은 상하 동일하게 준다.
   (상 6 / 하 16 이면 위아래 여백이 10px 어긋난다) */
.mm-theme-v2.mm-page-reserve-detail .reserve_list_area {
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    padding: 6px 16px;
    margin-bottom: 12px;
}
.mm-theme-v2.mm-page-reserve-detail .reserve_list_area h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--mm-text);
}
/* 취소·환불 정책의 회색 박스 — 원본은 margin 0 이라 윗줄에 딱 붙고(0px) 카드 하단과도 7px 뿐이었다.
   카드 아래 패딩 7px 이 이미 있으므로 아래 margin 은 8px 만 줘도 위(15px)와 균형이 맞는다. */
.mm-theme-v2.mm-page-reserve-detail .reserve_list_type3,
.mm-theme-v2.mm-page-reserve-detail .cancel_guide {
    margin: 15px 0 8px;
    border-radius: var(--mm-radius-md);
}
/* 취소사유 박스 — 바로 위 '취소사유' 줄에서 이어지는 내용임을 화살표로 드러낸다.
   blade 마크업을 건드리지 않으려고 ::before 로 넣는다(회원가입의 '↳ 추천 닉네임이에요!' 와 같은 표현). */
/* 화살표 x = 박스 left(27) + 10 = 37 → 위 '취소사유' 라벨의 x(37)와 세로선이 맞는다.
   (박스는 카드보다 10px 안쪽에서 시작하므로 left 를 20 → 10 으로 당긴다) */
.mm-theme-v2.mm-page-reserve-detail .cancel_guide {
    position: relative;
    padding-left: 36px;
}
.mm-theme-v2.mm-page-reserve-detail .cancel_guide::before {
    content: "\21B3";                   /* ↳ */
    position: absolute;
    left: 10px;
    top: 17px;
    color: var(--mm-muted);
    font-size: 1.05rem;
    line-height: 1;
}
/* 하단 CTA(.d_reserve_call_area)는 position:fixed 라 끝까지 스크롤하면 마지막 카드를 13px 덮는다 */
.mm-theme-v2.mm-page-reserve-detail .P_list_shop_area { padding-bottom: 90px; }


/* =========================================================
   약관·정책 (Phase 7)
   스코프: .mm-page-agree = /agree/{provision,personal,location,point_policy}
   네 장 모두 .join_step1_area > #agree_contents 구조가 같아 스코프를 공유한다.

   ★ .join_step1_area 는 인증 폼(.mm-auth)에서도 쓰는 클래스지만, 이 페이지들은
     .mm-auth 를 붙이지 않으므로 서로 간섭하지 않는다.
   ========================================================= */

/* 본문 카드 — 원본은 배경 없는 맨 텍스트였다 */
.mm-theme-v2.mm-page-agree .join_step1_area {
    width: auto;
    margin: var(--mm-gap);
    padding: 4px var(--mm-pad-card) 24px;
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}

/* 긴 약관을 읽기 위한 타이포 — 원본은 line-height 1.3 에 h3 가 본문과 같은 크기라
   조문 구분이 안 됐다. 제목을 키우고 행간을 넓힌다. */
.mm-theme-v2.mm-page-agree #agree_contents {
    font-size: .9rem;
    line-height: 1.7;
    color: var(--mm-text);
}
.mm-theme-v2.mm-page-agree #agree_contents h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--mm-text);
    margin: 28px 0 12px;
}
.mm-theme-v2.mm-page-agree #agree_contents h3:first-child { margin-top: 12px; }
.mm-theme-v2.mm-page-agree #agree_contents ul { margin: 0 0 16px; }
.mm-theme-v2.mm-page-agree #agree_contents ul li {
    font-size: .875rem;
    line-height: 1.7;
    color: var(--mm-muted);
    margin-bottom: 8px;
}
.mm-theme-v2.mm-page-agree #agree_contents .num { color: var(--mm-text); font-weight: 600; margin-right: 4px; }
.mm-theme-v2.mm-page-agree #agree_contents table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.mm-theme-v2.mm-page-agree #agree_contents th,
.mm-theme-v2.mm-page-agree #agree_contents td {
    border: 1px solid var(--mm-border);
    padding: 8px;
    color: var(--mm-muted);
}
.mm-theme-v2.mm-page-agree #agree_contents th { background: var(--mm-divider); color: var(--mm-text); font-weight: 600; }


/* =========================================================
   바로예약 1·2단계 (Phase 8)
   스코프: .mm-page-reserve-step
           = /reserve/step1·step2 + /foreign/reserve/step1·step2 (핵심 클래스 공유)

   ★ 기능 무수정 원칙: blade 는 래퍼 div 와 css 링크만 추가했다.
     폼 name/id, onclick, AJAX(/reserve/get_times) 는 손대지 않는다.

   ★ 상태 클래스는 JS 가 갈아끼운다 — 반드시 양쪽 상태를 모두 칠한다.
     .time_item ↔ .time_item.on      (시간 선택)
     .calender_day div ↔ div.on/.off  (날짜 선택)
     .charge_next.off ↔ .charge_next.on (다음 버튼 활성화)
   ★ 시간 슬롯은 날짜 변경 시 AJAX 로 innerHTML 이 통째로 교체된다.
     그래서 클래스 기반으로만 스타일링한다(인라인 의존 금지).
   ★ 원본 강조색이 세 가지로 갈려 있었다: #ff5862(날짜·시간), #ff6450(다음 버튼 주황),
     #ff385c(일요일). 전부 테마 포인트색으로 통일한다.
   ========================================================= */

/* ----- 날짜 선택 ----- */
.mm-theme-v2.mm-page-reserve-step .calender_day div {
    transition: background var(--mm-tx), color var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-step .calender_day div.on {
    background: var(--mm-primary);
    color: #fff;
}
.mm-theme-v2.mm-page-reserve-step .calender_day div.off { color: var(--mm-disabled); }
.mm-theme-v2.mm-page-reserve-step .calender_day.sunday { color: var(--mm-primary); }
.mm-theme-v2.mm-page-reserve-step .calender_month { font-weight: 700; color: var(--mm-text); }
.mm-theme-v2.mm-page-reserve-step .title_1 { font-weight: 700; color: var(--mm-text); }

/* ----- 시간 선택 알약 ----- */
.mm-theme-v2.mm-page-reserve-step .time_item {
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-pill);
    color: var(--mm-text);
    transition: background var(--mm-tx), border-color var(--mm-tx), color var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-step .time_item.on {
    background: var(--mm-primary);
    border-color: var(--mm-primary);
    color: #fff;
}
/* '주간할인' 캡션 — 선택 시 흰색으로 뒤집히는 원본 동작 유지 */
.mm-theme-v2.mm-page-reserve-step .time_item p { color: var(--mm-primary); }
.mm-theme-v2.mm-page-reserve-step .time_item.on p { color: #fff; }

/* ----- 코스 선택(step2) ----- */
.mm-theme-v2.mm-page-reserve-step .course_choice {
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: var(--mm-card);
    box-shadow: var(--mm-shadow-card);
}
/* 상단 '마사지샵 / 예약일자' 섹션 — 코스 카드는 라운드인데 이 섹션만 각져 있었다.
   결제 페이지(.mm-page-reserve-pay)와 같은 카드 규격으로 맞춘다.
   (베트남 step1 의 샵 정보 섹션도 같은 클래스라 함께 적용된다) */
.mm-theme-v2.mm-page-reserve-step .c_course_info {
    width: auto;
    margin: 12px var(--mm-gap);
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-reserve-step .course_sel_area,
.mm-theme-v2.mm-page-reserve-step .time_sel_area,
.mm-theme-v2.mm-page-reserve-step .c_calender_area {
    background: var(--mm-card);
    border-radius: var(--mm-radius-lg);
    border: 1px solid var(--mm-border);
    box-shadow: var(--mm-shadow-card);
    margin: 12px var(--mm-gap);
    padding: 4px var(--mm-pad-card) 12px;
    width: auto;
}

/* ----- 하단 고정 바 ----- */
.mm-theme-v2.mm-page-reserve-step .reserve-summary-bar {
    background: var(--mm-card);
    border-top: 1px solid var(--mm-border);
}
.mm-theme-v2.mm-page-reserve-step .reserve-summary-text { color: var(--mm-muted); }

.mm-theme-v2.mm-page-reserve-step .charge_undo {
    background: var(--mm-divider);
    border-radius: var(--mm-radius-md);
    color: var(--mm-text);
}
.mm-theme-v2.mm-page-reserve-step .charge_bottom_area li div.charge_next.off {
    background: #d7dbe0;
    border-radius: var(--mm-radius-md);
    color: #fff;
}
.mm-theme-v2.mm-page-reserve-step .charge_bottom_area li div.charge_next.on {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
    color: #fff;
    font-weight: 700;
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-step .charge_bottom_area li div.charge_next.on:hover {
    background: var(--mm-primary-hover);
}


/* =========================================================
   결제하기 (Phase 8-2)
   스코프: .mm-page-reserve-pay = /reserve/pay/{id}

   ★★ 안전 규칙 (pay.blade.php:914 참고)
      결제 버튼은 `off` 클래스가 실제 게이트다:
          if ( $('#pay_req div').hasClass('off') ) return false;
      → 클래스명은 절대 건드리지 않는다. blade 는 래퍼 div + css 링크만 추가.
      → `off` 는 반드시 '비활성으로 보이게' 칠한다. 활성처럼 칠하면 눌러도 아무 일이
         일어나지 않는 상태가 된다(코드는 정상, UX 만 붕괴).

   ★ 결제창(nicepay-3.0.js)은 body 에 직접 붙거나 payForm 을 PG 도메인으로 전송한다.
     이 스코프 밖이라 영향 없다. 폼 name/id(Amt·MID·Moid·payForm)도 무수정.

   ★ 원본 강조색이 갈려 있었다: #ff6450(결제버튼 주황) / #ff695b(로그인 버튼) /
     #ff575f(앱 할인 배너) / #ff5035(앱 업데이트) / #ff385c(쿠폰). 포인트색으로 통일.
   ========================================================= */

/* ----- 결제 버튼 — off = 비활성(회색), on = 활성(포인트색) ----- */
.mm-theme-v2.mm-page-reserve-pay .charge_pay_commit div.off {
    background: #d7dbe0;               /* 비활성임이 분명히 보이도록 */
    color: #fff;
    border-radius: var(--mm-radius-md);
    cursor: not-allowed;
}
.mm-theme-v2.mm-page-reserve-pay .charge_pay_commit div.on {
    background: var(--mm-primary);
    color: #fff;
    border-radius: var(--mm-radius-md);
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-pay .charge_pay_commit div.on:hover {
    background: var(--mm-primary-hover);
}

/* ----- 쿠폰 (원본이 이미 #ff385c 라 라운드만 토큰화) ----- */
.mm-theme-v2.mm-page-reserve-pay .coupon_btn button { border-radius: var(--mm-radius-md); }
.mm-theme-v2.mm-page-reserve-pay .item_coupon {
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}
.mm-theme-v2.mm-page-reserve-pay .item_coupon.on { border-color: var(--mm-primary); }
.mm-theme-v2.mm-page-reserve-pay .coupon_submit.on { background: var(--mm-primary); }

/* ----- 로그인/비회원 버튼 (주황 → 포인트색) ----- */
.mm-theme-v2.mm-page-reserve-pay #go_login > div,
.mm-theme-v2.mm-page-reserve-pay #show_user_info > div {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
}
.mm-theme-v2.mm-page-reserve-pay .reserve_info_check_btn_2 {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
}

/* ----- 로그인 유도 배너 (말풍선 꼬리 border-color 도 함께 맞춘다) ----- */
.mm-theme-v2.mm-page-reserve-pay .app_sale {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
}
.mm-theme-v2.mm-page-reserve-pay .app_sale:after { border-bottom-color: var(--mm-primary); }

/* ----- 섹션 구분/입력 ----- */
.mm-theme-v2.mm-page-reserve-pay .coupon_area { border-bottom-color: var(--mm-bg); }
.mm-theme-v2.mm-page-reserve-pay .all_pay { font-weight: 700; color: var(--mm-text); }

/* 로그인 유도 배너(#ff695b) / 퀵계좌이체 '혜택' 배지(#ff5252) → 포인트색 계열로 통일.
   결제수단 선택 박스 테두리(#ff5903)는 blade 인라인 style 이라 CSS 로 못 이겨서
   blade 에서 직접 #ff385c 로 바꿨다(색상값만 교체, 로직·클래스 무수정). */
.mm-theme-v2.mm-page-reserve-pay .c_login_guide {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
}
.mm-theme-v2.mm-page-reserve-pay .pay_badge_benefit { background: var(--mm-primary); }
/* 결제수단 선택(카드/퀵계좌이체) — 선택된 항목 강조. style.css 의 #ff5903 을 덮는다.
   ★ .on 은 JS 가 붙였다 떼는 클래스다(선택 상태). 미선택 상태도 함께 칠해 대비를 유지한다. */
.mm-theme-v2.mm-page-reserve-pay .pay_item div.on {
    border-color: var(--mm-primary);
    background: #fff5f7;
}
.mm-theme-v2.mm-page-reserve-pay .pay_nomal,
.mm-theme-v2.mm-page-reserve-pay .pay_app { border-radius: var(--mm-radius-md); }

/* ----- 결제 페이지 섹션 카드 + 입력필드 (스타일 전용 — 로직 무관) -----
   원본은 흰 블록을 7px 회색 띠(#f4f5f9)로 잘라 놓은 구버전 레이아웃이었다.
   예약내역 상세와 같은 방식으로 각 섹션을 카드로 띄운다. */
.mm-theme-v2.mm-page-reserve-pay .c_course_info,
.mm-theme-v2.mm-page-reserve-pay .coupon_area {
    border-bottom: 0;
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
    margin: 0 var(--mm-gap) 12px;
    width: auto;
}
/* 첫 카드가 상단바에 붙어 있었다(0px). 상단 마진을 줘 12px 띄운다.
   ★ :first-of-type 은 안 먹는다 — 형제 중 첫 div 가 .c_course_info 가 아니다.
     모든 카드에 margin-top 을 주되, 인접 형제 마진은 상쇄되므로 카드 사이는 12px 그대로다. */
.mm-theme-v2.mm-page-reserve-pay .c_course_info,
.mm-theme-v2.mm-page-reserve-pay .coupon_area { margin-top: 12px; }
.mm-theme-v2.mm-page-reserve-pay .title_1 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--mm-text);
}

/* 입력필드 — 휴대폰번호 / 요청사항 / 포인트 / 쿠폰번호
   ★ readonly·disabled 상태(포인트 0P, 인증된 번호)는 원본 동작이라 톤만 낮춘다. */
.mm-theme-v2.mm-page-reserve-pay .c_course_info input[type="number"],
.mm-theme-v2.mm-page-reserve-pay .c_course_info input[type="text"],
.mm-theme-v2.mm-page-reserve-pay .guest_request textarea,
.mm-theme-v2.mm-page-reserve-pay .coupon_put input {
    width: 100%;
    height: auto;
    padding: 13px 12px;
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: #fbfcfd;
    font-size: .95rem;
    transition: border-color var(--mm-tx), background var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-pay .c_course_info input:focus,
.mm-theme-v2.mm-page-reserve-pay .guest_request textarea:focus,
.mm-theme-v2.mm-page-reserve-pay .coupon_put input:focus {
    border-color: var(--mm-primary);
    background: var(--mm-card);
}
.mm-theme-v2.mm-page-reserve-pay .c_course_info input:disabled,
.mm-theme-v2.mm-page-reserve-pay .c_course_info input[readonly] {
    background: var(--mm-divider);
    color: var(--mm-muted);
}
/* 요청사항 — 원본 .guest_request 는 회색 박스(#f9f9f9 + padding 5px)다.
   그 안의 textarea 에 테마 박스를 씌우면 회색 링이 5px 남아 이중으로 겹쳐 보인다.
   → 페이지의 다른 입력필드(휴대폰번호·쿠폰번호)와 같은 '테두리 박스' 하나로 통일한다. */
.mm-theme-v2.mm-page-reserve-pay .guest_request {
    background: transparent;
    padding: 0;
    border-radius: 0;
}

/* 휴대폰번호 필드 — 원본은 .reserve_n_input(바깥 박스) 안에 input 이 들어가는 구조다.
   input 에도 박스를 씌우면 테두리가 이중이 되고 안쪽이 회색으로 뜬다.
   → 바깥 박스를 필드 경계로 삼고(테마 테두리), 안쪽 input 은 투명·무테로 둔다.
   ★ input#go_hp_auth 는 readonly 지만 클릭 시 휴대폰 인증으로 보내는 동작이 있다.
     비활성처럼 회색으로 죽이면 안 된다(기능은 살아 있음). */
.mm-theme-v2.mm-page-reserve-pay .reserve_n_input {
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-md);
    background: var(--mm-card);
    transition: border-color var(--mm-tx);
}
.mm-theme-v2.mm-page-reserve-pay .reserve_n_input:focus-within { border-color: var(--mm-primary); }
.mm-theme-v2.mm-page-reserve-pay .reserve_n_input input,
.mm-theme-v2.mm-page-reserve-pay .reserve_n_input input[readonly] {
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--mm-text);
    padding: 4px 0;
}


/* =========================================================
   결제완료 (Phase 8-3)
   스코프: .mm-page-pay-end = /reserve/pay_end/{id} + /foreign/reserve/pay_end/{id}
   원본 강조색 #ff695b(살몬) / #ff6b81(쿠폰 점선) → 테마 포인트색으로 통일.
   ★ 스타일 전용. 예약 상태·쿠폰 발급 로직은 건드리지 않는다.
   ========================================================= */
.mm-theme-v2.mm-page-pay-end .checkmark { color: var(--mm-primary); }
.mm-theme-v2.mm-page-pay-end .type1_ment4 em { color: var(--mm-primary); }

/* 쿠폰 안내 박스 */
.mm-theme-v2.mm-page-pay-end .coupon-box {
    border: 1px dashed var(--mm-primary);
    background: #fff5f7;
    border-radius: var(--mm-radius-lg);
}
.mm-theme-v2.mm-page-pay-end .coupon-box h3 { color: var(--mm-primary); }
.mm-theme-v2.mm-page-pay-end .charge_ncoupon_btn {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-pay-end .charge_ncoupon_btn:hover { background: var(--mm-primary-hover); }

/* 하단 버튼 — '홈으로'(주 버튼) / '예약내역 확인'(보조) */
.mm-theme-v2.mm-page-pay-end .h_btn {
    background: var(--mm-primary);
    border-radius: var(--mm-radius-md);
    transition: background var(--mm-tx);
}
.mm-theme-v2.mm-page-pay-end .h_btn:hover { background: var(--mm-primary-hover); }
.mm-theme-v2.mm-page-pay-end .other_shop {
    background: var(--mm-divider);
    border-radius: var(--mm-radius-md);
    color: var(--mm-text);
}

/* 결제하기 페이지 배경 — .mm-theme-v2 래퍼가 이미 --mm-bg(#F4F6F8)를 칠하는데
   .map_talk_top(흰 배경)이 그 위를 덮어 카드가 흰 바탕에 얹혀 있었다.
   이 스코프에서만 투명으로 만들어 다른 테마 페이지(예약목록·상세)와 같은 배경을 쓴다. */
.mm-theme-v2.mm-page-reserve-pay .map_talk_top { background: transparent; }

/* 바로예약 1·2단계도 결제하기와 같은 배경으로 통일 (.map_talk_top 의 흰 배경을 걷어낸다) */
.mm-theme-v2.mm-page-reserve-step .map_talk_top { background: transparent; }

/* 결제하기 — 약관 전체동의 섹션도 다른 섹션과 같은 카드로 */
.mm-theme-v2.mm-page-reserve-pay .pay_agree_area {
    width: auto;
    margin: 12px var(--mm-gap);
    padding: 15px var(--mm-pad-card);
    background: var(--mm-card);
    border: 1px solid var(--mm-border);
    border-radius: var(--mm-radius-lg);
    box-shadow: var(--mm-shadow-card);
}