/* ==========================================================
   MEMBER SKIN — OLD mbskin 클래스 → NEW 디자인 브릿지
   이 파일은 $member_skin_url/style.css 로 로드됨
   OLD PHP 파일의 HTML 구조에 NEW 디자인을 적용
   ========================================================== */
@import url('../../../css/member.css');

/* OLD mbskin 기본 래퍼 → 미니멀 스타일 */
.mbskin {
    max-width: 520px;
    margin: 80px auto 60px;
    padding: 0 24px;
    font-family: 'Inter', 'Noto Sans KR', sans-serif;
    color: #333;
    line-height: 1.6;
}

.mbskin h1,
.mbskin h2 {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    color: #111;
    margin-bottom: 16px;
}

.mbskin h1 {
    font-size: 2rem;
    text-align: center;
}

.mbskin h2 {
    font-size: 1.3rem;
    margin-top: 24px;
}

.mbskin p {
    font-size: 0.88rem;
    color: #555;
    margin-bottom: 12px;
}

/* 팝업 윈도우 */
.new_win {
    margin: 24px auto;
    padding: 24px;
}

.new_win h1#win_title {
    font-family: 'Playfair Display', serif;
    font-size: 1.6rem;
    text-align: center;
    margin-bottom: 24px;
    border-bottom: 1px solid #eee;
    padding-bottom: 16px;
}

/* 입력 필드 */
.mbskin input[type="text"],
.mbskin input[type="password"],
.mbskin input[type="email"],
.mbskin select,
.mbskin .frm_input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #ddd;
    border-radius: 3px;
    font-size: 0.9rem;
    font-family: inherit;
    outline: none;
    transition: border-color 0.2s;
    box-sizing: border-box;
    margin-bottom: 12px;
    -webkit-appearance: none;
    appearance: none;
}

.mbskin input[type="text"]:focus,
.mbskin input[type="password"]:focus,
.mbskin input[type="email"]:focus,
.mbskin .frm_input:focus {
    border-color: #111;
    box-shadow: none;
}

.mbskin input[readonly] {
    background: #f8f8f8;
    color: #999;
}

.mbskin textarea {
    width: 100%;
    min-height: 100px;
    padding: 12px 14px;
    border: 1px solid #eee;
    border-radius: 3px;
    font-size: 0.82rem;
    font-family: inherit;
    resize: vertical;
    background: #fafafa;
    color: #666;
    box-sizing: border-box;
    margin-bottom: 10px;
}

/* 체크박스 & 라벨 */
.fregister_agree,
.mbskin fieldset {
    border: none;
    padding: 0;
    margin: 8px 0 20px;
}

.fregister_agree {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.fregister_agree label,
.mbskin label {
    font-size: 0.9rem;
    color: #111;
    cursor: pointer;
}

/* 체크박스 강제 표시 */
.fregister_agree input[type="checkbox"],
.mbskin input[type="checkbox"],
.mbr-check input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer;
    accent-color: #111;
    flex-shrink: 0;
}

.mbskin label strong.sound_only {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

/* 버튼 */
.btn_submit,
.mbskin input[type="submit"],
.mbskin .btn02 {
    display: inline-block;
    padding: 12px 32px;
    background: #111;
    color: #fff !important;
    border: 1px solid #111;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: all 0.3s;
    border-radius: 3px;
    text-decoration: none;
    font-family: inherit;
    text-align: center;
}

.btn_submit:hover,
.mbskin input[type="submit"]:hover,
.mbskin .btn02:hover {
    background: transparent;
    color: #111 !important;
}

.btn_confirm {
    text-align: center;
    margin-top: 40px;
    padding-top: 24px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    gap: 12px;
    justify-content: center;
}

.btn_cancel {
    display: inline-block;
    padding: 12px 32px;
    background: #fff;
    color: #111 !important;
    border: 1px solid #ddd;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: all 0.3s;
    border-radius: 3px;
    text-decoration: none;
    font-family: inherit;
    text-align: center;
    line-height: 1.6;
}

.btn_cancel:hover {
    border-color: #111;
}

.btn_confirm a {
    text-decoration: none;
}

.win_btn {
    text-align: center;
    margin-top: 20px;
    display: flex;
    gap: 8px;
    justify-content: center;
}

.win_btn button {
    padding: 8px 20px;
    border: 1px solid #ddd;
    background: #fff;
    color: #666;
    font-size: 0.82rem;
    cursor: pointer;
    transition: all 0.2s;
    border-radius: 3px;
    font-family: inherit;
}

.win_btn button:hover {
    border-color: #111;
    color: #111;
}

/* 테이블 (프로필, 포인트, 스크랩) */
.tbl_head01.tbl_wrap {
    overflow-x: auto;
    margin: 16px 0;
}

.mbskin table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.mbskin table th,
.mbskin table td {
    padding: 12px 16px;
    text-align: left;
    border-bottom: 1px solid #f0f0f0;
}

.mbskin table th {
    font-weight: 500;
    color: #888;
    font-size: 0.82rem;
    letter-spacing: 0.03em;
    width: 30%;
}

.mbskin table td {
    color: #333;
}

/* 비밀번호 확인 (password.skin.php) */
#pw_bg {
    margin: 0;
    padding: 0;
    background: none;
}

#pw_confirm {
    max-width: 480px;
    margin: 100px auto 60px;
    padding: 0 24px;
}

#pw_confirm h1 {
    font-family: 'Playfair Display', serif;
    font-size: 1.8rem;
    text-align: center;
    margin-bottom: 16px;
}

.pw_box {
    margin: 24px 0;
}

.pw_box p {
    font-size: 0.88rem;
    color: #555;
    line-height: 1.7;
    margin-bottom: 20px;
}

.pw_fs {
    border: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 8px;
    align-items: center;
}

.pw_fs label {
    font-size: 0.85rem;
    flex-shrink: 0;
}

.pw_fs .frm_input {
    flex: 1;
    margin-bottom: 0;
}

.pw_fs .btn_submit {
    flex-shrink: 0;
    padding: 12px 20px;
}

/* 정보찾기 (password_lost) */
#find_info {
    padding: 24px;
}

#info_fs {
    border: none;
    padding: 0;
    margin: 16px 0;
}

#info_fs p {
    font-size: 0.88rem;
    color: #666;
    margin-bottom: 16px;
}

#info_fs label {
    display: block;
    font-size: 0.82rem;
    margin-bottom: 6px;
    font-weight: 500;
}

#info_fs .email {
    width: 100%;
}

/* 회원가입 결과 */
#reg_result {
    max-width: 520px;
    margin: 100px auto 60px;
    text-align: center;
    padding: 40px 24px;
}

#reg_result p {
    text-align: left;
}

#result_email {
    background: #f9f9f9;
    padding: 16px 24px;
    border-radius: 4px;
    margin: 16px 0;
    text-align: left;
}

#result_email span {
    font-size: 0.8rem;
    color: #999;
    display: block;
    margin-bottom: 2px;
}

#result_email strong {
    font-size: 1rem;
    color: #111;
    display: block;
    margin-bottom: 10px;
}

/* 메모 */
.mbskin .memo_list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mbskin .memo_list li {
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0.88rem;
}

.mbskin .memo_list li a {
    color: #333;
}

/* 포인트 */
.mbskin .point_list {
    font-size: 0.85rem;
}

/* 스크랩 */
.mbskin .scrap_list {
    font-size: 0.85rem;
}

/* 파란 글로우 제거 — 전역 */
body,
#hd,
#wrapper,
#container,
#contents {
    background: #fff !important;
    box-shadow: none !important;
}

#hd,
#wrapper {
    background-image: none !important;
    border: none !important;
}

/* 모바일 */
@media (max-width: 480px) {
    .mbskin {
        margin-top: 60px;
        padding: 0 16px;
    }

    #pw_confirm {
        margin-top: 60px;
    }

    #reg_result {
        margin-top: 60px;
    }

    .mbskin h1 {
        font-size: 1.6rem;
    }

    .fregister_agree {
        flex-direction: row !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
    }
    
    .fregister_agree label {
        font-size: 0.8rem;
        line-height: 1.4;
    }

    .pw_fs {
        flex-direction: column;
    }

    .pw_fs .frm_input {
        width: 100%;
    }

    .mbskin input[type="text"],
    .mbskin input[type="password"],
    .mbskin input[type="email"],
    .mbskin select {
        font-size: 16px;
        /* Safari auto-zoom 방지 */
    }
}