@charset "UTF-8";

/* =========================================================
   themes.css (프리셋 3종 / 오늘 퍼블용)
   - 규칙: "변수 값만" 덮어쓰기
   - 사용: <div class="background t-skin-beige"> 처럼 background에 붙이기
========================================================= */

/* ================================
   1) INK / BLACK (타이포 카드 + 라인)
================================ */
.t-skin-black {
    /* Font-face */
    --font-main: "Wanted Sans Variable", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    --font-title: "MaruBuri", "Noto Serif KR", serif;
    --font-effective-main: var(--font-user-main, var(--font-main));
    font-family: inherit;

    /* 기본 폰트 사이즈 */
    --body-size: 1.6rem;
    --body-line: 2;

    /* Colors */
    --color-bg: #f8f8f8;
    --color-text: #272a2b;
    --color-accent: #272a2b;
    --color-cover-text01: #272a2b;
    --color-cover-text02: #272a2b;
    --color-section-title: #505658;
    --color-line: #e6e7e8;

    --section-bg: #ffffff;
    --surface-bg: #f9fafa;

    --wax-color: #272a2b;
    --wax-mask-dark: url("../images/cover01-seal-dark.png");
    --wax-mask-light: url("../images/cover01-seal-light.png");

    /* 달력 */
    --dday-bg: #272a2b;
    --dday-card-bg: #f9fafa;
    --dday-card-border: #e6e7e8;
    --dday-card-tag: #777f82;
    --dday-card-value: #272a2b;
    --dday-card-colon: #b5bbbd;

    /* 오시는 길 */
    --location-item-border: #e6e7e8;

    /* 안내 사항 */
    --info-item-bg: #ffffff;
    --info-item-border: #b5bbbd;
    --info-item-text-color: #505658;

    /* 타임라인 */
    --timeline-line: #e6e7e8;
    --timeline-dot-border: #979fa1;
    --timeline-dot: #fff;
    --timeline-title-color: #272a2b;
    --timeline-desc-color: #505658;

    /* 방명록 */
    --guestbook-item-border: #e6e7e8;
    --guestbook-item-bg: #f9fafa;
    --guestbook-item-name-color: #272a2b;
    --guestbook-item-text-color: #505658;

    /* 페이지네이션 스타일 */
    --pagination-bg: #ffffff;
    --pagination-border: #e6e7e8;
    --pagination-text: #272a2b;
    --pagination-active-bg: #272a2b;
    --pagination-active-border: #272a2b;
    --pagination-active-text: #ffffff;
    --pagination-hover-bg: #f3f4f4;
    --pagination-hover-border: #b5bbbd;
    --pagination-hover-text: #272a2b;

    /* 계좌 정보 */
    --account-accordion-btn-bg: #fff;
    --account-accordion-border: #e6e7e8;
    --account-accordion-header-color: #272a2b;
    --account-accordion-body-bg: #f9fafa;
    --account-accordion-active-border: #272a2b;

    /* 커버 */
    --cover-bg: #272a2b;
    --cover-text: var(--font-title);
    --cover-fg: #272a2b;
    --cover-muted: #272a2b;

    /* Section rhythm */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* Buttons */
    --btn-radius: 0.8rem;
    --btn-border: 0.1rem solid #272a2b;
    --btn-bg: #fff;
    --btn-text-color: #272a2b;
    --btn-weight: 600;
    --btn-padding: 1.2rem 1.6rem;
    --btn-hover-color-bg: var(--neutral-100);
    --btn-hover-color-text: #272a2b;
    --btn-hover-color-border: #272a2b;
}

/* ================================
   2) PINK (핑크 포인트)
================================ */
.t-skin-pink {
    /* Font-face */
    --font-main: "SUIT", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
    --font-title: "Wanted Sans Variable", sans-serif;
    --font-effective-main: var(--font-user-main, var(--font-main));
    font-family: inherit;

    /* 기본 폰트 사이즈 */
    --body-size: 1.6rem;
    --body-line: 2;

    /* Colors */
    --color-bg: #f8f8f8;
    --color-text: #505658;
    --color-accent: #f8607a;
    --color-cover-text01: #fff;
    --color-cover-text02: #fff;
    --color-section-title: #fea6b1;
    --color-line: #e6e7e8;

    --section-bg: #ffffff;
    --surface-bg: #fff8f9;

    /* 달력 */
    --dday-bg: #fea6b1;
    --dday-card-bg: #ffffff;
    --dday-card-border: #e6e7e8;
    --dday-card-tag: #777f82;
    --dday-card-value: #272a2b;
    --dday-card-colon: #d1d5d6;

    /* 오시는 길 */
    --location-item-border: #fea6b1;

    /* 안내 사항 */
    --info-item-bg: #ffffff;
    --info-item-border: #fea6b1;
    --info-item-text-color: #505658;

    /* 타임라인 */
    --timeline-line: #ffd2d8;
    --timeline-dot-border: #fea6b1;
    --timeline-dot: #fff;
    --timeline-title-color: #272a2b;
    --timeline-desc-color: #505658;

    /* 방명록 */
    --guestbook-item-border: #e6e7e8;
    --guestbook-item-bg: #fff;
    --guestbook-item-name-color: #272a2b;
    --guestbook-item-text-color: #505658;

    /* 페이지네이션 스타일 */
    --pagination-bg: #fff8f9;
    --pagination-border: #ffd2d8;
    --pagination-text: #fe9aa9;
    --pagination-active-bg: #fea6b1;
    --pagination-active-border: #fea6b1;
    --pagination-active-text: #ffffff;
    --pagination-hover-bg: #fe9aa9;
    --pagination-hover-border: #fe9aa9;
    --pagination-hover-text: #272a2b;

    /* 계좌 정보 */
    --account-accordion-btn-bg: #fff;
    --account-accordion-border: #ffd2d8;
    --account-accordion-header-color: #f8607a;
    --account-accordion-body-bg: #fff8f9;
    --account-accordion-active-border: #fea6b1;

    /* 커버 */
    --cover-bg: #fe9aa9;
    --cover-text: var(--font-title);
    --cover-fg: #fff;
    --cover-muted: #fff;

    /* Section rhythm */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* Buttons */
    --btn-radius: 0.8rem;
    --btn-border: 0.1rem solid #fea6b1;
    --btn-bg: #fea6b1;
    --btn-text-color: var(--white);
    --btn-weight: 600;
    --btn-padding: 1.2rem 1.6rem;
    --btn-hover-color-bg: #fe9aa9;
    --btn-hover-color-text: var(--white);
    --btn-hover-color-border: #fe9aa9;
}

/* ================================
   3) BEIGE (아치+베이지 톤)
================================ */
.t-skin-beige {
    /* Font-face */
    --font-main: "Noto Serif KR", serif;
    --font-title: "Sansita Swashed", serif;
    --font-effective-main: var(--font-user-main, var(--font-main));
    font-family: inherit;

    /* 기본 폰트 사이즈 */
    --body-size: 1.6rem;
    --body-line: 2;

    /* Colors */
    --color-bg: #f8f8f8;
    --color-text: #272a2b;
    --color-accent: #b2886a;
    --color-cover-text01: #272a2b;
    --color-cover-text02: #61686a;
    --color-section-title: #c6a88d;
    --color-line: #e6e7e8;

    --section-bg: #ffffff;
    --surface-bg: #f9f9f9;

    /* 달력 */
    --dday-bg: #c6a88d;
    --dday-card-bg: #fbfaf8;
    --dday-card-border: #efe9dd;
    --dday-card-tag: #b2886a;
    --dday-card-value: #7c5b48;
    --dday-card-colon: #e5d9c8;

    /* 오시는 길 */
    --location-item-border: #e3d8c3;

    /* 안내 사항 */
    --info-item-bg: #fbfaf8;
    --info-item-border: #c6a88d;
    --info-item-text-color: #272a2b;

    /* 타임라인 */
    --timeline-line: #e3d8c3;
    --timeline-dot-border: #efe9dd;
    --timeline-dot: #997054;
    --timeline-title-color: #272a2b;
    --timeline-desc-color: #272a2b;

    /* 방명록 */
    --guestbook-item-border: #efe9dd;
    --guestbook-item-bg: #fbfaf8;
    --guestbook-item-name-color: #272a2b;
    --guestbook-item-text-color: #272a2b;

    /* 페이지네이션 스타일 */
    --pagination-bg: #fbfaf8;
    --pagination-border: #e3d8c3;
    --pagination-text: #c6a88d;
    --pagination-active-bg: #c6a88d;
    --pagination-active-border: #c6a88d;
    --pagination-active-text: #ffffff;
    --pagination-hover-bg: #f7f4ed;
    --pagination-hover-border: #c6a88d;
    --pagination-hover-text: #272a2b;

    /* 계좌 정보 */
    --account-accordion-btn-bg: #fff;
    --account-accordion-border: #e6e7e8;
    --account-accordion-header-color: #272a2b;
    --account-accordion-body-bg: #f9fafa;
    --account-accordion-active-border: #b5bbbd;

    /* 커버 */
    --cover-bg: #f7f4ed;
    --cover-text: var(--font-title);
    --cover-fg: #272a2b;
    --cover-muted: #272a2b;

    /* Section rhythm */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* Buttons */
    --btn-radius: 0.8rem;
    --btn-border: 0.1rem solid #e6e7e8;
    --btn-bg: #fff;
    --btn-text-color: #272a2b;
    --btn-weight: 600;
    --btn-padding: 1.2rem 1.6rem;
    --btn-hover-color-bg: #fff;
    --btn-hover-color-text: #272a2b;
    --btn-hover-color-border: #b5bbbd;
}

/* ================================
   4) PINK+GRAY (핑크+그레이 혼합)
================================ */
.t-skin-pink-gray {
    /* Font-face */
    --font-main: "Nanum Square Neo", sans-serif;
    --font-title: "S-Core Dream", sans-serif;
    --font-effective-main: var(--font-user-main, var(--font-main));
    font-family: inherit;

    /* 기본 폰트 사이즈 */
    --body-size: 1.6rem;
    --body-line: 2;

    /* Colors */
    --color-bg: #f8f8f8;
    --color-text: #272a2b;
    --color-accent: #ca6973;
    --color-cover-text01: #272a2b;
    --color-cover-text02: #505658;
    --color-section-title: #db9196;
    --color-line: #e6e7e8;

    --section-bg: #ffffff;
    --surface-bg: #f9fafa;

    /* 달력 */
    --dday-bg: #db9196;
    --dday-card-bg: #f9fafa;
    --dday-card-border: #e6e7e8;
    --dday-card-tag: #db9196;
    --dday-card-value: #ca6973;
    --dday-card-colon: #d1d5d6;

    /* 오시는 길 */
    --location-item-border: #fea6b1;

    /* 안내 사항 */
    --info-item-bg: #fff;
    --info-item-border: #e8b9bb;
    --info-item-text-color: #272a2b;

    /* 타임라인 */
    --timeline-line: #f9eaea;
    --timeline-dot-border: #f9eaea;
    --timeline-dot: #db9196;
    --timeline-title-color: #272a2b;
    --timeline-desc-color: #272a2b;

    /* 방명록 */
    --guestbook-item-border: #e6e7e8;
    --guestbook-item-bg: #fff;
    --guestbook-item-name-color: #272a2b;
    --guestbook-item-text-color: #272a2b;

    /* 페이지네이션 스타일 */
    --pagination-bg: #fff;
    --pagination-border: #e6e7e8;
    --pagination-text: #db9196;
    --pagination-active-bg: #db9196;
    --pagination-active-border: #db9196;
    --pagination-active-text: #ffffff;
    --pagination-hover-bg: #fff8f9;
    --pagination-hover-border: #f3d8da;
    --pagination-hover-text: #db9196;

    /* 계좌 정보 */
    --account-accordion-btn-bg: #fff;
    --account-accordion-border: #e6e7e8;
    --account-accordion-header-color: #272a2b;
    --account-accordion-body-bg: #f9fafa;
    --account-accordion-active-border: #b5bbbd;

    /* 커버 */
    --cover-bg: #fff;
    --cover-text: var(--font-title);
    --cover-fg: #272a2b;
    --cover-muted: #272a2b;

    /* Section rhythm */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* Buttons */
    --btn-radius: 0.8rem;
    --btn-border: 0.1rem solid #e6e7e8;
    --btn-bg: #fff;
    --btn-text-color: #272a2b;
    --btn-weight: 600;
    --btn-padding: 1.2rem 1.6rem;
    --btn-hover-color-bg: #fff;
    --btn-hover-color-text: #272a2b;
    --btn-hover-color-border: #b5bbbd;
}

/* ================================
   5) BEIGE+PINK (베이지+핑크 혼합)
================================ */
.t-skin-beige-pink {
    /* Font-face */
    --font-main: "Pretendard", sans-serif;
    --font-title: "Gowun Batang", sans-serif;
    --font-effective-main: var(--font-user-main, var(--font-main));
    font-family: inherit;

    /* 기본 폰트 사이즈 */
    --body-size: 1.6rem;
    --body-line: 2;

    /* Colors */
    --color-bg: #f8f8f8;
    --color-text: #272a2b;
    --color-accent: #ca6973;
    --color-cover-text01: #fff;
    --color-cover-text02: #fff;
    --color-section-title: #ca6973;
    --color-line: #e6e7e8;

    --section-bg: #ffffff;
    --surface-bg: #fbfaf8;

    /* 달력 */
    --dday-bg: #d3bda3;
    --dday-card-bg: #fbfaf8;
    --dday-card-border: #efe9dd;
    --dday-card-tag: #979fa1;
    --dday-card-value: #b2886a;
    --dday-card-colon: #e5d9c8;

    /* 오시는 길 */
    --location-item-border: #e3d8c3;

    /* 안내 사항 */
    --info-item-bg: #fff;
    --info-item-border: #c6a88d;
    --info-item-text-color: #272a2b;

    /* 타임라인 */
    --timeline-line: #f9eaea;
    --timeline-dot-border: #f9eaea;
    --timeline-dot: #db9196;
    --timeline-title-color: #272a2b;
    --timeline-desc-color: #272a2b;

    /* 방명록 */
    --guestbook-item-border: #efe9dd;
    --guestbook-item-bg: #fbfaf8;
    --guestbook-item-name-color: #272a2b;
    --guestbook-item-text-color: #272a2b;

    /* 페이지네이션 스타일 */
    --pagination-bg: #fff;
    --pagination-border: #e6e7e8;
    --pagination-text: #db9196;
    --pagination-active-bg: #db9196;
    --pagination-active-border: #db9196;
    --pagination-active-text: #ffffff;
    --pagination-hover-bg: #fff8f9;
    --pagination-hover-border: #f3d8da;
    --pagination-hover-text: #db9196;

    /* 계좌 정보 */
    --account-accordion-btn-bg: #fff;
    --account-accordion-border: #e6e7e8;
    --account-accordion-header-color: #272a2b;
    --account-accordion-body-bg: #f9fafa;
    --account-accordion-active-border: #b5bbbd;

    /* 커버 */
    --cover-bg: #fff;
    --cover-text: var(--font-title);
    --cover-fg: #fff;
    --cover-muted: #272a2b;

    /* Section rhythm */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* Buttons */
    --btn-radius: 0.8rem;
    --btn-border: 0.1rem solid #e6e7e8;
    --btn-bg: #fff;
    --btn-text-color: #272a2b;
    --btn-weight: 600;
    --btn-padding: 1.2rem 1.6rem;
    --btn-hover-color-bg: #fff;
    --btn-hover-color-text: #272a2b;
    --btn-hover-color-border: #b5bbbd;
}

/* ================================
   6) navy
================================ */
.t-skin-navy {
    /* Font-face */
    --font-main: "Pretendard", sans-serif;
    --font-title: "Sun Batang", sans-serif;
    --font-effective-main: var(--font-user-main, var(--font-main));
    font-family: inherit;

    /* 기본 폰트 사이즈 */
    --body-size: 1.6rem;
    --body-line: 2;

    /* Colors */
    --color-bg: #f8f8f8;
    --color-text: #272a2b;
    --color-accent: #5770a0;
    --color-cover-text01: #272a2b;
    --color-cover-text02: #272a2b;
    --color-section-title: #5770a0;
    --color-line: #e6e7e8;

    --section-bg: #ffffff;
    --surface-bg: #f5f6fa;

    /* 달력 */
    --dday-bg: #5770a0;
    --dday-card-bg: #ffffff;
    --dday-card-border: #d0d7e7;
    --dday-card-tag: #a7b5d2;
    --dday-card-value: #5770a0;
    --dday-card-colon: #d0d7e7;

    /* 오시는 길 */
    --location-item-border: #d0d7e7;

    /* 안내 사항 */
    --info-item-bg: #fff;
    --info-item-border: #788eb8;
    --info-item-text-color: #272a2b;

    /* 타임라인 */
    --timeline-line: #eaedf4;
    --timeline-dot-border: #eaedf4;
    --timeline-dot: #5770a0;
    --timeline-title-color: #272a2b;
    --timeline-desc-color: #272a2b;

    /* 방명록 */
    --guestbook-item-border: #d0d7e7;
    --guestbook-item-bg: #ffffff;
    --guestbook-item-name-color: #272a2b;
    --guestbook-item-text-color: #272a2b;

    /* 페이지네이션 스타일 */
    --pagination-bg: #fff;
    --pagination-border: #e6e7e8;
    --pagination-text: #788eb8;
    --pagination-active-bg: #788eb8;
    --pagination-active-border: #788eb8;
    --pagination-active-text: #ffffff;
    --pagination-hover-bg: #f5f6fa;
    --pagination-hover-border: #d0d7e7;
    --pagination-hover-text: #788eb8;

    /* 계좌 정보 */
    --account-accordion-btn-bg: #fff;
    --account-accordion-border: #d0d7e7;
    --account-accordion-header-color: #5770a0;
    --account-accordion-body-bg: #f9fafa;
    --account-accordion-active-border: #788eb8;

    /* 커버 */
    --cover-bg: #fff;
    --cover-text: var(--font-title);
    --cover-fg: #a7b5d2;
    --cover-muted: #272a2b;

    /* Section rhythm */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* Buttons */
    --btn-radius: 0.8rem;
    --btn-border: 0.1rem solid #a7b5d2;
    --btn-bg: #f5f6fa;
    --btn-text-color: #272a2b;
    --btn-weight: 600;
    --btn-padding: 1.2rem 1.6rem;
    --btn-hover-color-bg: #d0d7e7;
    --btn-hover-color-text: #272a2b;
    --btn-hover-color-border: #788eb8;
}