/* ============================================================================
   PETDORI / REGISTER.CSS
   일반 로그인 + 회원가입 3단계 + 약관 모달 + 비즈니스 로그인
   편집 순서
   01. 공통 변수 · 페이지 레이아웃
   02. 가입 진행 단계 · 공통 문구 · 애니메이션
   03. STEP 1 / 서비스 동의 · 권한 안내
   04. STEP 2 / 닉네임 · 단계 이동 버튼
   05. STEP 3 / 반려동물 선택
   06. 약관 모달
   07. 로그인 / 소셜 인증
   08. 호환용 공통 인증 UI
   09. 반응형 · 관리자바
   10. 비즈니스 로그인
   11. 접근성(모션 축소)
   참고: 실제 가입 Step 1의 소셜 인증 화면과 관리자 동의 미리보기는
   현재 별개입니다. 이 파일은 HTML / JS 동작을 변경하지 않습니다.
   ============================================================================ */

/* 01. 공통 변수 · 페이지 레이아웃 =========================================== */
.pd-register,
.pd-login {
    --pd-signup-blue: #2563eb;
    --pd-signup-panel: #f6f8fa;
    --pd-signup-muted: var(--petdori-text-sub);
    --pd-signup-fade-duration: 1s;
    --pd-auth-button-bg: #f7f8fa;   /* 최종: 소셜 버튼 회색 */
    --pd-auth-button-text: #20262e;
    --pd-auth-kakao-icon-bg: #fee500;
    --pd-auth-naver-icon-bg: #03c75a;
}

/* 가입 화면에서는 하단 앱 내비게이션과 예약 공간을 제거 */
body.page-template-page-register-php .pd-bottom-nav,
body:has(.pd-register) .pd-bottom-nav,
body.page-template-page-login-php .pd-bottom-nav,
body:has(.pd-login) .pd-bottom-nav {
    display: none !important;
}

body.page-template-page-register-php .pd-shell,
body:has(.pd-register) .pd-shell {
    min-height: 100dvh;
    padding-bottom: 0;
}

body.page-template-page-login-php .pd-shell,
body:has(.pd-login) .pd-shell {
    padding-bottom: 0;
}

.pd-register {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 480px;
    min-height: 100dvh;
    margin-inline: auto;
    padding: 46px 20px 24px; /* 일반 가입 Step 2~3 */
    background: var(--petdori-surface);
    color: var(--petdori-text);
}

/* 관리자 동의 화면의 상단 간격은 별도 지정 */
.pd-register.pd-register-consent-preview {
    padding-top: 46px;
    padding-bottom: 24px;
}

.pd-register [hidden] { display: none !important; }
.pd-register-step { width: 100%; min-width: 0; }
.pd-register-preview-notice {
    margin: -18px 0 25px;
    padding: 10px 12px;
    border-radius: 9px;
    background: #f1f5fb;
    color: #526079;
    font-size: 12px;
    line-height: 1.5;
}

.pd-register-preview-notice.is-error {
    background: #fff1f2;
    color: #b91c1c;
}

/* 02. 진행 단계 · 공통 문구 · 페이드 ======================================= */
.pd-register-progress { margin-bottom: 34px; }
.pd-register-progress ol {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pd-register-progress li span,
.pd-register-progress li button {
    display: grid;
    place-items: center;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 700;
}

.pd-register-progress li span {
    background: #eef1f6;
    color: #8893a3;
}

.pd-register-progress li.is-complete span,
.pd-register-progress li button {
    background: #e8f0ff;
    color: var(--pd-signup-blue);
}

.pd-register-progress li.is-current span {
    background: var(--pd-signup-blue);
    color: #fff;
}

.pd-register-progress li button {
    padding: 0;
    border: 0;
    font-family: inherit;
    line-height: 1;
    cursor: pointer;
}

.pd-register-progress li button:focus-visible {
    outline: 2px solid var(--pd-signup-blue);
    outline-offset: 3px;
}

.pd-register-intro {
    margin: 0 0 29px;
    text-align: left;
}

.pd-register-intro h1 {
    margin: 0 0 8px;
    color: var(--petdori-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.38;
    letter-spacing: -.035em;
}

.pd-register-intro p {
    margin: 0;
    color: var(--pd-signup-muted);
    font-size: 13px;
    line-height: 1.5;
}

.pd-register-info {
    margin: 19px 0 0;
    color: var(--pd-signup-muted);
    font-size: 13px;
    line-height: 1.5;
}

@keyframes pd-signup-fade-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 관리자 미리보기 Step 1은 개별 요소가 순서대로 나타나는 기존 방식 유지 */
.pd-register-consent-preview > .pd-register-progress,
.pd-register-consent-preview > .pd-register-intro,
.pd-register-consent-preview > .pd-signup-terms,
.pd-register-consent-preview > .pd-signup-permissions,
.pd-register-consent-preview > .pd-register-consent-preview-footer,
.pd-register > .pd-register-step:not([hidden]) {
    animation: pd-signup-fade-in var(--pd-signup-fade-duration) ease-out both;
}

/* 03. STEP 1 / 서비스 동의 · 권한 안내 ====================================== */
.pd-register-consent-preview .pd-register-intro { margin-bottom: 20px; }
.pd-signup-terms { margin-bottom: 28px; }
.pd-signup-agree {
    position: relative;
    display: flex;
    align-items: center;
    gap: 4px;
    color: #7ca8e8;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

/* 네이티브 input은 접근성을 위해 유지하고 시각적으로만 숨김 */
.pd-signup-agree input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    opacity: 0;
}

.pd-signup-agree-check {
    display: grid;
    place-items: center;
    flex: 0 0 20px;
    width: 22px;
    height: 22px;
    border-radius: 0;            /* 체크 배경 없음 */
    background: transparent;
    color: #a9c9f3;
    transition: color .15s ease;
}

.pd-signup-agree-check svg {
    width: 15px;
    height: 15px;
    stroke-width: 3.2;           /* 체크 아이콘 두께 */
}

.pd-signup-agree input:checked + .pd-signup-agree-check {
    color: var(--pd-signup-blue);
}

.pd-signup-agree input:focus-visible + .pd-signup-agree-check {
    outline: 2px solid var(--pd-signup-blue);
    outline-offset: 3px;
}

.pd-signup-agree-label { color: var(--petdori-text); font-size: 13px; font-weight: 700; }
.pd-signup-agree small {
    margin-left: 3px;
    color: var(--pd-signup-muted);
    font-size: 12px;
    font-weight: 400;
}

.pd-signup-required { margin-right: 3px; color: var(--pd-signup-blue); font-weight: 700; }

/* Step 1 · 약관 링크 영역 */
.pd-signup-terms-links {
    display: grid;
    gap: 0;
    margin: 8px 0 0;
    padding: 0 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

/* 약관 항목 */
.pd-signup-terms-links a,
.pd-signup-terms-links > span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
    min-height: 32px;
    color: #424d5c;
    font-size: 13px;
    text-decoration: none;
}

/* 항목 사이 구분선 제거 */
.pd-signup-terms-links a + a {
    border-top: 0;
}

/* 보기 버튼 */
.pd-signup-terms-links .pd-signup-view {
    flex: none;
    margin-left: auto;
    color: #2563eb;
    font-size: 12px;
    white-space: nowrap;
}

/* 권한 설명은 HTML상 '앱 권한 안내' 아래, 아이콘 박스 위 */
.pd-signup-permissions h2 {
    margin: 0 0 6px;
    color: var(--petdori-text);
    font-size: 15px;
    font-weight: 700;
}

.pd-signup-permissions-desc {
    margin: 0 0 15px;
    color: var(--pd-signup-muted);
    font-size: 13px;
    line-height: 1.7;
}

.pd-signup-permission-list {
    display: grid;
    gap: 10px;
    padding: 14px;
    border-radius: 12px;
    background: var(--pd-signup-panel);
}

.pd-signup-permission-row {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.pd-signup-permission-icon {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: #fff;
    color: #354457;
}

.pd-signup-permission-icon svg { display: block; width: 22px; height: 22px; }
.pd-signup-permission-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    min-width: 0;
    line-height: 1.4;
}

.pd-signup-permission-copy strong {
    flex: 0 0 auto;
    color: var(--petdori-text);
    font-size: 13px;
    font-weight: 700;
}

.pd-signup-permission-dot { color: var(--pd-signup-muted); }
.pd-signup-permission-copy > span:last-child { color: var(--pd-signup-muted); font-size: 12px; }

/* Step 1 관리자 미리보기 하단 버튼 */
.pd-register-consent-preview-footer > p {
    margin: 11px 0 0;
    color: var(--pd-signup-muted);
    font-size: 11px;
    line-height: 1.6;
    text-align: center;
}

.pd-register-consent-preview-button:hover { background: #1d4ed8; color: #fff; }

/* 04. STEP 2 / 닉네임 · 다음 버튼 ========================================= */
.pd-register-field {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 9px;
}

.pd-register-field label { font-size: 13px; font-weight: 500; }
.pd-register-field input {
    width: 100%;
    min-height: 46px;
    padding: 0 13px;
    border: 1px solid var(--petdori-border);
    border-radius: 11px;
    background: var(--petdori-surface);
    color: var(--petdori-text);
    font-size: 15px;
}

.pd-register-field input:focus { outline: 2px solid #bfdbfe; border-color: var(--pd-signup-blue); }
.pd-register-field > p {
    margin: 0;
    color: var(--pd-signup-muted);
    font-size: 12px;
    line-height: 1.6;
}

.pd-register-nickname-row { display: flex; align-items: center; gap: 8px; }
.pd-register-nickname-row input { flex: 1 1 auto; width: 0; min-width: 0; }
.pd-register-text-button {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0 3px;
    border: 0;
    background: transparent;
    color: var(--pd-signup-blue);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.pd-register-text-button:disabled { opacity: .45; cursor: not-allowed; }
.pd-register-text-button:focus-visible { outline: 2px solid var(--pd-signup-blue); outline-offset: 3px; }
.pd-register-field .pd-register-field-status { margin-top: 5px; }
.pd-register-field .pd-register-field-status:empty { display: none; }
.pd-register-field-status.is-error { color: #b91c1c; }

/* 실제 가입 Step 2에서 쓰는 기존 동의 UI: 서버 연동 전에는 제거하지 않음 */
.pd-register-consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 24px;
    color: var(--petdori-text);
    font-size: 12px;
    line-height: 1.6;
    cursor: pointer;
}

.pd-register-consent input {
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    margin: 1px 0 0;
    padding: 0;
    accent-color: var(--petdori-primary);
}

.pd-register-consent small { display: block; margin-top: 4px; color: var(--pd-signup-muted); font-size: 11px; }
.pd-register-consent a { text-decoration: underline; text-underline-offset: 3px; }

/* Step 1 미리보기 / Step 2: 키보드 오프셋은 JS가 CSS 변수로 제공 */
.pd-register-consent-preview-footer,
.pd-register-controls {
    position: sticky;
    bottom: var(--pd-register-keyboard-offset, 0px);
    z-index: 2;
    width: 100%;
    margin-top: auto;
    padding: 18px 0 max(10px, env(safe-area-inset-bottom));
    background: var(--petdori-surface);
}

.pd-register-controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
}

.pd-register-consent-preview-button,
.pd-register-next-button {
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 48px;
    padding: 8px 16px;
    border: 0;
    border-radius: 10px;
    background: var(--pd-signup-blue);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.pd-register-consent-preview-button { padding: 12px 16px; text-decoration: none; }
.pd-register-next-button { gap: 6px; justify-content: center; }
.pd-register-consent-preview-button:disabled,
.pd-register-next-button:disabled {
    background: #92B2FE;
    color: #fff;
    cursor: not-allowed;
}

.pd-register-controls:has(> .pd-register-next-button[hidden]) { display: none; }

/* 이전 Step 버튼(호환용). 실제 가입은 현재 숫자형 단계 버튼 활용 */
.pd-register-outline-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 8px 16px;
    border: 1px solid var(--petdori-border);
    border-radius: 9px;
    background: var(--petdori-surface);
    color: var(--petdori-text);
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
}

.pd-register-controls button:disabled { opacity: .45; cursor: not-allowed; }

/* 05. STEP 3 / 반려동물 등록 또는 둘러보기 =============================== */
.pd-register-step[data-pd-register-step="3"]:not([hidden]) {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.pd-register-step[data-pd-register-step="3"] .pd-register-pet-options {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    margin: 12px 0;             /* 버튼 영역 위·아래 여백 */
    padding: 0;
}

.pd-register-primary-button,
.pd-register-secondary-button {
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 42px;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.pd-register-primary-button {
    border: 1px solid #E8F0FF;
    background: #E8F0FF;
    color: #2563EB;
}

.pd-register-secondary-button {
    border: 1px solid var(--petdori-border);
    background: var(--petdori-surface);
    color: var(--petdori-text);
}

.pd-register-skip-button {
    min-height: 40px;
    padding: 9px 12px;
    border: 0;
    background: transparent;
    color: #677487;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

.pd-register-pet-options button:disabled,
.pd-register-skip-button:disabled { opacity: .45; cursor: not-allowed; }
.pd-register-step[data-pd-register-step="3"] .pd-register-info { margin-top: 0; text-align: center; }

/* 06. 약관 전체 화면 모달 ==================================================== */

/* 문서 본문의 h2, p, 목록, 표 스타일은 별도로 로드하는 document.css에 있음 */
.pd-register-legal-dialog {
    width: min(100vw, 480px);
    height: min(100dvh, 920px);
    max-width: 480px;
    max-height: 100dvh;
    margin: auto;
    padding: 0;
    border: 0;
    border-radius: 16px;
    background: #fff;
    color: #252c37;
}

.pd-register-legal-dialog::backdrop { background: rgba(19, 31, 49, .52); }
.pd-register-legal-dialog__frame {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.pd-register-legal-dialog__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex: none;
    min-height: 58px;
    padding: 10px 18px;
    border-bottom: 1px solid #e9edf2;
}

.pd-register-legal-dialog__header h2 { margin: 0; font-size: 16px; font-weight: 700; }
.pd-register-legal-dialog__header button {
    min-height: 38px;
    padding: 8px 10px;
    border: 0;
    background: transparent;
    color: var(--pd-signup-blue);
    font-size: 13px;
    cursor: pointer;
}

.pd-register-legal-dialog__content {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 22px 18px max(25px, env(safe-area-inset-bottom));
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

/* 07. 로그인 / 소셜 인증 ==================================================== */
.pd-login {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    max-width: 480px;
    min-height: 100dvh;
    margin: 0 auto;
    padding: 46px 20px 40px;
    background: var(--petdori-surface);
}

.pd-login:has(.pd-auth-simple) { align-items: stretch; }
.pd-auth-simple {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    text-align: left;
}

.pd-login .pd-auth-simple {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: pd-auth-simple-in .5s ease-out both;
}

.pd-auth-simple .pd-auth-intro { margin: 0 0 38px; text-align: left; }
.pd-auth-simple .pd-auth-intro h1 {
    margin: 0 0 10px;
    color: var(--petdori-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.04em;
}

.pd-auth-simple .pd-auth-intro p {
    margin: 0;
    color: var(--pd-signup-muted);
    font-size: 14px;
    line-height: 1.65;
}

.pd-auth-simple .pd-auth-social {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
}

/* 로그인 버튼: 회색 바탕 + 카카오/네이버 아이콘만 브랜드 컬러 */
.pd-auth-simple .pd-register-social {
    position: relative;
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: none;
    height: 50px;
    min-height: 50px;
    padding: 0 48px;
    border: 0;
    border-radius: 11px;
    background: var(--pd-auth-button-bg);
    color: var(--pd-auth-button-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

.pd-auth-simple .pd-register-social:not(:disabled):active {
    transform: scale(.985);
    background: #edf0f3;
}

.pd-auth-simple .pd-register-social:focus-visible {
    outline: 3px solid #93c5fd;
    outline-offset: 3px;
}

.pd-auth-simple .pd-auth-provider-icon {
    position: absolute;
    top: 50%;
    left: 12px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    transform: translateY(-50%);
    border-radius: 9px;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.06em;
}

.pd-auth-simple .pd-auth-provider-icon svg { display: block; width: 24px; height: 24px; }
.pd-auth-simple .pd-register-social--kakao .pd-auth-provider-icon {
    background: var(--pd-auth-kakao-icon-bg);
    color: #191919;
}

.pd-auth-simple .pd-register-social--naver .pd-auth-provider-icon {
    background: var(--pd-auth-naver-icon-bg);
    color: #fff;
    font-size: 21px;
    font-weight: 900;
}

.pd-auth-simple .pd-register-social--kakao .pd-auth-provider-icon svg { width: 22px; height: 22px; }
.pd-auth-simple .pd-auth-provider-label {
    display: block;
    color: var(--pd-auth-button-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.02em;
}

.pd-login-error {
    width: 100%;
    max-width: 400px;
    margin: 0 0 18px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #fff1f2;
    color: #b91c1c;
    font-size: 12px;
    line-height: 1.6;
    text-align: center;
}

/* 비즈니스 로그인 안내 - 소셜 버튼 아래 */
.pd-auth-simple .pd-auth-business-prompt {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 16px;
    color: var(--pd-signup-muted);
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
}

/* 비즈니스 로그인 링크 */
.pd-auth-simple .pd-auth-business-prompt a {
    color: var(--pd-signup-blue);
    font-weight: 500;
    text-decoration: none;
}

.pd-auth-simple .pd-auth-business-prompt a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pd-auth-simple .pd-auth-business-prompt a:focus-visible {
    outline: 2px solid var(--pd-signup-blue);
    outline-offset: 3px;
    border-radius: 2px;
}

@keyframes pd-auth-simple-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 08. 호환용 공통 인증 UI ==================================================== */

/* auth-entry.php의 옛 탭 / 브랜드 레이아웃을 사용하는 경우만 적용 */
.pd-register-social-row {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    width: 100%;
}

.pd-register-social {
    display: grid;
    flex: 0 0 25%;
    place-items: center;
    min-width: 0;
    height: 69px;
    padding: 0;
    border: 0;
    border-radius: 13px;
    background: var(--pd-auth-button-bg);
    color: var(--pd-auth-button-text);
    cursor: pointer;
    transition: transform .15s ease;
}

.pd-register-social:disabled { cursor: not-allowed; opacity: .74; }
.pd-register-social:not(:disabled):active { transform: scale(.97); }

/* 과거의 카카오 노랑/네이버 초록 버튼 배경은 사용하지 않음.
   브랜드 색은 위 .pd-auth-provider-icon에만 적용한다. */
.pd-register-social--naver span { font-size: 29px; line-height: 1; font-weight: 900; letter-spacing: -.09em; }
.pd-register-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    margin-top: 22px;
    color: var(--pd-signup-muted);
    font-size: 12px;
    line-height: 1.65;
}

.pd-register-legal a { text-decoration: underline; text-underline-offset: 3px; }
.pd-register-legal-dot { color: #b9c1ca; }
.pd-auth-entry { width: 100%; min-width: 0; margin: 0 auto; text-align: center; }
.pd-auth-tabs { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin: 0 0 48px; }
.pd-auth-tabs a {
    display: grid;
    flex: 1 1 0;
    place-items: center;
    max-width: 150px;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #f0f3f7;
    color: var(--pd-signup-muted);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

.pd-auth-tabs a[aria-current="page"] { background: #20262e; color: #fff; font-weight: 700; }
.pd-auth-brand { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 0 0 40px; text-align: center; }
.pd-auth-brand-icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; background: #eef5ff; font-size: 26px; line-height: 1; }
.pd-auth-brand strong { color: var(--petdori-text); font-size: 24px; font-weight: 800; line-height: 1.35; letter-spacing: -.045em; }
.pd-auth-brand p { margin: 0; color: var(--pd-signup-muted); font-size: 13px; line-height: 1.6; }
.pd-auth-intro { margin: 0 0 30px; text-align: center; }
.pd-auth-intro h1 { margin: 0 0 10px; color: var(--petdori-text); font-size: 21px; font-weight: 700; line-height: 1.4; letter-spacing: -.035em; }
.pd-auth-intro p { margin: 0; color: var(--pd-signup-muted); font-size: 13px; line-height: 1.65; }
.pd-auth-form { width: 100%; }
.pd-auth-entry .pd-register-social-row { justify-content: center; align-items: center; }

/* 예전 인증 UI의 25% 너비 규칙은 로그인 전체 너비 버튼보다 우선하지 않도록 낮은 우선순위로 적용 */
.pd-auth-entry :where(.pd-register-social) { flex: 0 0 25%; max-width: 120px; }
.pd-auth-switch { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 25px; color: var(--pd-signup-muted); font-size: 12px; line-height: 1.6; }
.pd-auth-switch a { color: var(--petdori-primary); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.pd-auth-entry .pd-register-legal { justify-content: center; margin-top: 23px; text-align: center; }
.pd-auth-info { text-align: center; }

/* 실제 가입 첫 단계는 소셜 인증: 진행 숫자 / 다음 버튼 숨김 */
.pd-register[data-pd-register-preview="0"]:has(
    > .pd-register-step[data-pd-register-step="1"]:not([hidden])
) {
    justify-content: flex-start;
    align-items: center;
    padding: 90px 20px 40px;
}

.pd-register[data-pd-register-preview="0"]:has(
    > .pd-register-step[data-pd-register-step="1"]:not([hidden])
) > .pd-register-progress,
.pd-register[data-pd-register-preview="0"]:has(
    > .pd-register-step[data-pd-register-step="1"]:not([hidden])
) > .pd-register-controls {
    display: none;
}

/* 09. 반응형 · 관리자바 ======================================================= */
@media (max-width: 360px) {
    .pd-register { padding: 62px 16px 20px; }
    .pd-register.pd-register-consent-preview { padding-top: 42px; }
    .pd-register-intro h1 { font-size: 20px; }
    .pd-register-social-row { gap: 10px; }
    .pd-register-social { height: 62px; }
    .pd-auth-entry :where(.pd-register-social) { height: 62px; }
    .pd-register-legal-dialog { border-radius: 0; }
    .pd-login { padding: 46px 16px 30px; }
    .pd-login:has(.pd-auth-simple) { padding: 46px 16px 30px; }
    .pd-auth-tabs { margin-bottom: 36px; }
    .pd-auth-brand { margin-bottom: 32px; }
    .pd-auth-intro h1 { font-size: 19px; }
    .pd-auth-simple .pd-auth-intro h1 { font-size: 22px; }
    .pd-auth-simple .pd-register-social { height: 50px; min-height: 50px; }

    /* 실제 가입 첫 단계는 상단 74px로 유지 */
    .pd-register[data-pd-register-preview="0"]:has(
        > .pd-register-step[data-pd-register-step="1"]:not([hidden])
    ) { padding: 74px 16px 30px; }
}

@media (max-height: 550px) {
    .pd-register { padding-top: 24px; }
    .pd-register.pd-register-consent-preview { padding-top: 24px; }

    /* 세로 공간이 좁을 때 로그인 상단 여백 축소 */
    .pd-login:has(.pd-auth-simple) { padding-top: 24px; padding-bottom: 24px; }
    .pd-login:not(:has(.pd-auth-simple)) { padding-top: 24px; padding-bottom: 24px; }
    .pd-auth-tabs { margin-bottom: 24px; }
    .pd-auth-brand { margin-bottom: 24px; }
    .pd-register[data-pd-register-preview="0"]:has(
        > .pd-register-step[data-pd-register-step="1"]:not([hidden])
    ) { padding-top: 24px; padding-bottom: 24px; }
}

/* WordPress 관리자바 높이: 기존 100dvh 보정 */
.admin-bar .pd-register { min-height: calc(100dvh - 32px); }
@media (max-width: 782px) {
    .admin-bar .pd-register { min-height: calc(100dvh - 46px); }
}

/* ==========================================================
   10. 비즈니스 로그인 (홈 이동 · 폼 · 정책 링크)
   /business-login/
========================================================== */

/* 하단 내비게이션 숨김 */
body.page-template-page-business-login-php .pd-bottom-nav {
    display: none !important;
}

body.page-template-page-business-login-php .pd-shell {
    min-height: 100dvh;
    padding-bottom: 0;
}

/* 페이지 전체 */
.pd-business-login {
    --pd-business-blue: #2563eb;
    --pd-business-border: #e2e7ed;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 480px;
    min-height: 100dvh;
    margin: 0 auto;
    padding: 42px 20px max(30px, env(safe-area-inset-bottom));
    background: var(--petdori-surface);
    color: var(--petdori-text);
}

/* 내부 컨테이너 */
.pd-business-login__inner {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    animation: pd-auth-simple-in .8s ease-out both;
}

/* 홈으로 */
.pd-business-login__back {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 6px;
    color: #697586;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
}

.pd-business-login__back svg {
    flex: none;
    width: 18px;
    height: 18px;
}

.pd-business-login__back:hover {
    color: var(--pd-business-blue);
}

/* 제목 및 설명 */
.pd-business-login__intro {
    margin: 0 0 30px;
}

.pd-business-login__intro h1 {
    margin: 0 0 10px;
    color: var(--petdori-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.04em;
}

.pd-business-login__intro p {
    margin: 0;
    color: var(--petdori-text-sub);
    font-size: 14px;
    line-height: 1.65;
}

/* 회원가입 링크 */
.pd-business-login__intro p a {
    color: var(--pd-business-blue);
    font-weight: 600;
    text-decoration: none;
}

.pd-business-login__intro p a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* 로그인 폼 */
.pd-business-login__form {
    display: grid;
    gap: 6px;
}

/* 이메일 · 비밀번호 입력 영역 */
.pd-business-login__field {
    position: relative;
    display: block;
    width: 100%;
}

.pd-business-login__field input {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid var(--pd-business-border);
    border-radius: 12px;
    outline: 0;
    background: #fff;
    color: var(--petdori-text);
    font: inherit;
    font-size: 15px;
    line-height: 1.4;
    transition: border-color .15s ease,
                box-shadow .15s ease;
}

.pd-business-login__field input::placeholder {
    color: #9aa4b0;
    opacity: 1;
}

.pd-business-login__field input:focus {
    border-color: var(--pd-business-blue);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

/* 비밀번호 표시 버튼 공간 */
.pd-business-login__field--password input {
    padding-right: 52px;
}

/* 비밀번호 보기 · 숨기기 */
.pd-business-login__visibility {
    position: absolute;
    top: 50%;
    right: 8px;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    transform: translateY(-50%);
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #8c98a8;
    cursor: pointer;
}

.pd-business-login__visibility svg {
    width: 21px;
    height: 21px;
}

.pd-business-login__visibility svg [hidden] {
    display: none;
}

.pd-business-login__visibility:focus-visible {
    outline: 2px solid var(--pd-business-blue);
    outline-offset: 1px;
}

/* 로그인 버튼 */
.pd-business-login__submit {
    display: grid;
    place-items: center;
    width: 100%;
    min-height: 40px;
    margin-top: 14px;
    padding: 10px 16px;
    border: 0;
    border-radius: 10px;
    background: var(--pd-business-blue);
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.pd-business-login__submit:hover {
    background: #1d4ed8;
}

.pd-business-login__submit:active {
    transform: scale(.995);
}

/* 개인정보처리방침 · 이용약관 링크 */
.pd-business-login__links {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 16px;
    color: #7a8594;
    font-size: 13px;
    line-height: 1.5;
}

.pd-business-login__links a {
    color: inherit;
    text-decoration: none;
}

.pd-business-login__links a:hover {
    color: var(--pd-business-blue);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pd-business-login__separator {
    color: #c5cbd2;
}

/* 로그인 오류 안내 */
.pd-business-login__error {
    margin: 0 0 18px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #fff1f2;
    color: #b91c1c;
    font-size: 12px;
    line-height: 1.6;
}

/* 작은 모바일 */
@media (max-width: 360px) {
    .pd-business-login {
        padding: 42px 16px max(24px, env(safe-area-inset-bottom));
    }

    .pd-business-login__intro h1 {
        font-size: 22px;
    }
}

/* 높이가 낮은 화면 */
@media (max-height: 550px) {
    .pd-business-login {
        padding-top: 24px;
    }
}

/* 11. 접근성: 모션 축소 환경 */
@media (prefers-reduced-motion: reduce) {
    .pd-register-consent-preview > .pd-register-progress,
    .pd-register-consent-preview > .pd-register-intro,
    .pd-register-consent-preview > .pd-signup-terms,
    .pd-register-consent-preview > .pd-signup-permissions,
    .pd-register-consent-preview > .pd-register-consent-preview-footer,
    .pd-register > .pd-register-step:not([hidden]),
    .pd-login .pd-auth-simple,
    .pd-business-login__inner {
        animation: none;
    }

    .pd-signup-agree-check { transition: none; }
}