@charset "UTF-8";

/* =========================================================
   tokens.css (최소 세트 / 오늘 퍼블용)
   - base.css에서 참조하는 var(--*)가 전부 폴백을 갖도록 구성
   - themes.css / inline style에서 필요 값만 덮어쓰면 됨
========================================================= */

/* WantedSans 폰트 임포트 */
@import url("/static/fonts/WantedSans/WantedSansVariable.css");

/* 폰트 정의 */
@font-face {
    font-family: "Sun Batang";
    src: url("/static/fonts/SunBatang/SunBatang-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Sun Batang";
    src: url("/static/fonts/SunBatang/SunBatang-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Sun Batang";
    src: url("/static/fonts/SunBatang/SunBatang-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream1.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream2.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream3.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream4.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream5.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream6.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream7.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream8.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "S-Core Dream";
    src: url("/static/fonts/S-Core_Dream/SCDream9.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-Thin.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-ExtraLight.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUIT";
    src: url("/static/fonts/SUIT-ttf/SUIT-Heavy.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SUITE";
    src: url("/static/fonts/SUITE-ttf/SUITE-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Pretendard";
    src: url("/static/fonts/Pretendard/PretendardVariable.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gowun Dodum";
    src: url("/static/fonts/GowunDodum/GowunDodum-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gowun Batang";
    src: url("/static/fonts/GowunBatang/GowunBatang-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "MaruBuri";
    src: url("/static/fonts/maruburi/MaruBuri-ExtraLight.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "MaruBuri";
    src: url("/static/fonts/maruburi/MaruBuri-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "MaruBuri";
    src: url("/static/fonts/maruburi/MaruBuri-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "MaruBuri";
    src: url("/static/fonts/maruburi/MaruBuri-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "MaruBuri";
    src: url("/static/fonts/maruburi/MaruBuri-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Gmarket Sans";
    src: url("/static/fonts/GmarketSansTTF/GmarketSansTTFMedium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Barun Pen";
    src: url("/static/fonts/nanum-barun-pen/NanumBarunpenR.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square";
    src: url("/static/fonts/nanum-square/NanumSquare_acL.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square";
    src: url("/static/fonts/nanum-square/NanumSquare_acR.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square";
    src: url("/static/fonts/nanum-square/NanumSquare_acB.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square";
    src: url("/static/fonts/nanum-square/NanumSquare_acEB.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square Neo";
    src: url("/static/fonts/nanum-square-neo/NanumSquareNeoTTF-aLt.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square Neo";
    src: url("/static/fonts/nanum-square-neo/NanumSquareNeoTTF-bRg.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square Neo";
    src: url("/static/fonts/nanum-square-neo/NanumSquareNeoTTF-cBd.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square Neo";
    src: url("/static/fonts/nanum-square-neo/NanumSquareNeoTTF-dEb.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Square Neo";
    src: url("/static/fonts/nanum-square-neo/NanumSquareNeoTTF-eHv.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Mapo Flower Island";
    src: url("/static/fonts/MapoFlowerIsland/MapoFlowerIsland.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "ChosunNm";
    src: url("/static/fonts/ChosunNm/ChosunNmSlim.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "ChosunGu";
    src: url("/static/fonts/ChosunGu/ChosunGu.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "NEXON Lv1 Gothic";
    src: url("/static/fonts/NEXON_Lv1_Gothic/NEXONLv1GothicRegular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nelphim";
    src: url("/static/fonts/Nelphim/Nephilm.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* 26.02.13 추가 */
@font-face {
    font-family: "Sansita Swashed";
    src: url("/static/fonts/SansitaSwashed/SansitaSwashed-VariableFont_wght.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Noto Serif KR" serif;
    src: url("/static/fonts/NotoSerifKR/NotoSerifKR-VariableFont_wght.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* 26.02.22 추가 */
@font-face {
    font-family: "ClashDisplay";
    src: url("/static/fonts/ClashDisplay/ClashDisplay-Variable.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* 26.03.03 추가 */
@font-face {
    font-family: "Nanum Gothic";
    src: url("/static/fonts/nanum-gothic/NanumGothicLight.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Gothic";
    src: url("/static/fonts/nanum-gothic/NanumGothic.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Gothic";
    src: url("/static/fonts/nanum-gothic/NanumGothicBold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Gothic";
    src: url("/static/fonts/nanum-gothic/NanumGothicExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Myeongjo";
    src: url("/static/fonts/nanum-myeongjo/NanumMyeongjo.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Myeongjo";
    src: url("/static/fonts/nanum-myeongjo/NanumMyeongjoBold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Nanum Myeongjo";
    src: url("/static/fonts/nanum-myeongjo/NanumMyeongjoExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* =========================
   Tokens
========================= */
:root {
    --neutral-50: #f9fafa;
    --neutral-100: #f3f4f4;
    --neutral-200: #e6e7e8;
    --neutral-300: #d1d5d6;
    --neutral-400: #b5bbbd;
    --neutral-500: #979fa1;
    --neutral-600: #777f82;
    --neutral-700: #61686a;
    --neutral-800: #505658;
    --neutral-900: #45484a;
    --neutral-950: #272a2b;
    --white: #ffffff;
    --error: #e11d48;

    /* =====================================================
     Typography (기본 폰트)
  ===================================================== */
    --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: "Gowun Batang", "Noto Serif KR", serif;

    /* 기본 폰트 사이즈 */
    --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;

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

    /* 오시는 길 */
    --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;

    /* =====================================================
     Layout: page width
  ===================================================== */
    --page-max-width: 39rem;

    /* =====================================================
     Cover
  ===================================================== */
    --cover-bg: #272a2b;
    --cover-text: "Wanted Sans Variable" sans-serif;
    --cover-fg: #272a2b;
    --cover-muted: #272a2b;

    /* =====================================================
     Sections (공통 리듬)
  ===================================================== */
    --section-padding-y: 4.8rem;
    --section-padding-x: 2rem;
    --section-gap: 1.6rem;
    --section-title-size: 2rem;
    --section-divider: 0px solid transparent;

    /* =====================================================
     Components (옵션: base.css 공통 유틸)
  ===================================================== */
    --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;
}