/**
 * ITF Korea — header
 * Figma PC 6069:9753 · 1024 6069:9856 · 390 6069:9889
 *
 * PC: logo 250×50 | nav midTxt/700 pad 36 | util gap 20 · icon 28
 * ≤1024: logo|util only · pad var(--inPd) · logo 200×40 · util gap 16
 * ≤768 (390): pad var(--inPd) · logo 150×30 · util gap 16
 */

/* PC: 인라인 nav만 — 토글 숨김 (≤1024에서만 토글) */
@media screen and (min-width: 1025px) {
    body.nav-mode-auto.itf-site .drawer-toggle {
        display: none !important;
    }
}

/* Figma tablet 기준 — 1024부터 nav 숨김 · 2열 */
@media screen and (max-width: 1024px) {
    body.nav-mode-auto.itf-site .header .nav {
        display: none;
    }

    body.nav-mode-auto.itf-site .drawer-toggle {
        display: flex;
    }

    body.nav-mode-auto.itf-site .header .header-in {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.nav-mode-auto.itf-site .header .util-wrap {
        grid-column: 2;
    }
}

.itf-site .header .header-in {
    padding: 0 var(--hdIn, 40px);
}

.itf-site .header .logo {
    width: 250px;
    max-width: 250px;
    height: 50px;
    min-height: 50px;
}

.itf-site .header .nav .menu > li > a,
.itf-site .header .nav ul > li > a {
    padding: 0 3.6rem;
    font-size: var(--midTxt);
    font-weight: 700;
    color: var(--txtBlack1);
    line-height: var(--txtLine, 1.5);
    transition: color 0.2s ease;
}

@media (hover: hover) {
    .itf-site .header .nav .menu > li > a:hover,
    .itf-site .header .nav ul > li > a:hover {
        color: var(--primary);
    }
}

/* 도장/클럽 일시 폐쇄 — 메뉴 클릭 불가 */
.itf-site .header .nav .menu > li.is-disabled > a,
.itf-site .header .nav a.is-disabled,
.itf-site .drawer a.is-disabled {
    cursor: default;
    pointer-events: none;
    opacity: 0.45;
}

@media (hover: hover) {
    .itf-site .header .nav .menu > li.is-disabled > a:hover,
    .itf-site .header .nav a.is-disabled:hover,
    .itf-site .drawer a.is-disabled:hover {
        color: var(--txtBlack1);
    }
}

.itf-site .header .util-wrap {
    /* 첨부 아이콘과 동일 stroke */
    --header-util-stroke: 1.5px;
    gap: 20px;
}

/* 기본 로그인 버튼 숨김 — 회원 icon-box로 대체 */
.itf-site .header .pc-login-widget {
    display: none !important;
}

.itf-site .header-util-btn,
.itf-site .header .drawer-toggle {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--txtBlack1);
    cursor: pointer;
    flex-shrink: 0;
    text-decoration: none;
    overflow: hidden;
}

.itf-site .header-util-btn svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: var(--header-util-stroke);
    stroke-linecap: round;
    stroke-linejoin: round;
}

.itf-site .header-util-btn svg * {
    fill: none;
    stroke: inherit;
    stroke-width: inherit;
    stroke-linecap: inherit;
    stroke-linejoin: inherit;
}

/* 로그인(회원) ↔ 로그아웃 간격은 util-wrap gap으로만 */

/*
 * Toggle — 로그아웃 실효 두께에 맞춤
 * util SVG는 24→28 스케일로 stroke가 ~1.75px로 보임 · bar 1.75
 * viewBox 22×18 · bar 1.75 · y 0 / 8.125 / 16.25
 */
.itf-site .header .drawer-toggle {
    position: relative;
    flex-direction: column;
    gap: 0;
    padding: 0;
}

.itf-site .header .drawer-toggle__line {
    display: none;
}

.itf-site .header .drawer-toggle::before {
    content: '';
    display: block;
    width: 22px;
    height: 18px;
    background: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 18'%3E%3Crect width='22' height='1.75' rx='0.875'/%3E%3Crect y='8.125' width='22' height='1.75' rx='0.875'/%3E%3Crect y='16.25' width='22' height='1.75' rx='0.875'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 18'%3E%3Crect width='22' height='1.75' rx='0.875'/%3E%3Crect y='8.125' width='22' height='1.75' rx='0.875'/%3E%3Crect y='16.25' width='22' height='1.75' rx='0.875'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

@media screen and (max-width: 1024px) {
    .itf-site .header .header-in {
        padding: 0 var(--inPd);
    }

    .itf-site .header .logo {
        width: 200px;
        max-width: 200px;
        height: 40px;
        min-height: 40px;
    }

    .itf-site .header .util-wrap {
        gap: 16px;
    }
}

@media screen and (max-width: 768px) {
    .itf-site .header .logo {
        width: 150px;
        max-width: 150px;
        height: 30px;
        min-height: 30px;
    }

    .itf-site .header .util-wrap {
        gap: 16px;
    }

    /* util 3종(회원·로그아웃·토글) 28 → 26 */
    .itf-site .header-util-btn,
    .itf-site .header .drawer-toggle {
        width: 26px;
        height: 26px;
    }

    .itf-site .header .drawer-toggle::before {
        width: 20px;
        height: 17px;
    }
}

/*
 * 로그인 모달 닫기 — 배경 사각형 radius 100
 */
.itf-site .dialog__panel--form.auth-modal .dialog__close,
.itf-site .dialog__panel--form.auth-modal .auth-modal-close,
.itf-site .dialog__panel--form.auth-modal .close-icon {
    border-radius: 100px;
    overflow: hidden;
}

/*
 * Front UI line icons — 게시판 첨부와 동일 (stroke 1.5 · round)
 * 브랜드 PNG(SNS·진입카드·로고) · auth 입력 fill 아이콘은 제외
 */
.itf-site .archive-search-submit svg,
.itf-site .auth-modal-close svg,
.itf-site .auth-back-btn svg,
.itf-site .dialog .dialog-close svg,
.itf-site .board-password-modal .dialog__close svg,
.itf-site .btn-admin-icon svg,
.itf-site .dojang-club-sect__pager-btn svg,
.itf-site .dojang-club-single__map-address-copy svg,
.itf-site .itf-quick-menu .quick-menu__top .icon-box svg,
.itf-site .sub-visual .lnb-home svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.itf-site .archive-search-submit svg *,
.itf-site .auth-modal-close svg *,
.itf-site .auth-back-btn svg *,
.itf-site .dialog .dialog-close svg *,
.itf-site .board-password-modal .dialog__close svg *,
.itf-site .btn-admin-icon svg *,
.itf-site .dojang-club-sect__pager-btn svg *,
.itf-site .dojang-club-single__map-address-copy svg *,
.itf-site .itf-quick-menu .quick-menu__top .icon-box svg *,
.itf-site .sub-visual .lnb-home svg * {
    fill: none;
    stroke: inherit;
    stroke-width: inherit;
    stroke-linecap: inherit;
    stroke-linejoin: inherit;
}

/* 드로어 X — bar 두께 첨부 stroke와 맞춤 */
.itf-site .drawer-close__line {
    height: 1.5px;
    border-radius: 999px;
}