@charset "UTF-8";

/**
 * ==========================================================================
 * [1] 차일드 테마 style.css 이관 영역 (품절 상품 표시 제어)
 * ==========================================================================
 */

/* 품절된 상품의 이미지를 자연스럽게 어둡게 만들기 */
.product.outofstock .ct-image-container img,
.outofstock img {
    filter: brightness(0.6) !important;
}

/* ==========================================================================
   [Final] My Account page - Premium shadcn UI & Tailwind CSS Theme
   ========================================================================== */
body.se-my-account-page {
    /* shadcn UI Zinc & Slate CSS variables */
    --ma-background: #ffffff;
    --ma-foreground: #09090b; /* zinc-950 */
    --ma-card: #ffffff;
    --ma-card-foreground: #09090b;
    --ma-primary: #18181b; /* zinc-900 */
    --ma-primary-foreground: #fafafa; /* zinc-50 */
    --ma-secondary: #f4f4f5; /* zinc-100 */
    --ma-secondary-foreground: #18181b;
    --ma-muted: #f4f4f5;
    --ma-muted-foreground: #71717a; /* zinc-500 */
    --ma-accent: #f4f4f5;
    --ma-accent-foreground: #18181b;
    --ma-border: #e4e4e7; /* zinc-200 */
    --ma-input: #e4e4e7;
    --ma-radius: 0.75rem; /* rounded-xl */
    
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, sans-serif !important;
}

/* 1. 블록시 테마 본연의 뼈대 레이아웃 완벽 복원 (헤더/배너 찌그러짐 원천 해결) */
body.se-my-account-page .entry-content {
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ma-foreground) !important;
}

/* 2. 오직 본문 우커머스 실 영역에만 가로폭 제한 및 중앙 정렬 격리 이관 */
body.se-my-account-page .entry-content > .woocommerce {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 24px 16px 64px 16px !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 32px !important;
    align-items: flex-start !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. 네비게이션 사이드바 (데스크톱) - 정밀 징크 카드 핏 */
body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation {
    flex: 0 0 240px !important;
    width: 240px !important;
    min-width: 240px !important;
    border: 1px solid var(--ma-border) !important;
    border-radius: var(--ma-radius) !important;
    background: var(--ma-card) !important;
    padding: 16px !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05) !important;
    position: sticky !important;
    top: 40px !important;
    box-sizing: border-box !important;
}

body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation ul {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation li {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation a {
    display: flex !important;
    align-items: center !important;
    height: 40px !important;
    padding: 0 12px !important;
    border-radius: calc(var(--ma-radius) - 4px) !important;
    color: var(--ma-muted-foreground) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: background-color 0.2s, color 0.2s !important;
}

body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation a:hover {
    background: var(--ma-secondary) !important;
    color: var(--ma-foreground) !important;
}

/* 활성화 메뉴 - 시크 다크 징크 캡슐 */
body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation li.is-active a {
    background: var(--ma-primary) !important;
    color: var(--ma-primary-foreground) !important;
    font-weight: 600 !important;
}

/* 4. 본문 콘텐츠 래퍼 */
body.se-my-account-page .entry-content .woocommerce-MyAccount-content {
    flex: 1 !important;
    min-width: 0 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

body.se-my-account-page .entry-content .woocommerce-MyAccount-content > p {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: var(--ma-muted-foreground) !important;
    margin-bottom: 24px !important;
}

/* 5. 우커머스 알림(Notice) -> shadcn Alert 컴포넌트 리모델링 */
body.se-my-account-page .entry-content .woocommerce-message,
body.se-my-account-page .entry-content .woocommerce-info,
body.se-my-account-page .entry-content .woocommerce-error {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 16px !important;
    border-radius: var(--ma-radius) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    margin: 0 0 24px 0 !important;
    border: 1px solid transparent !important;
    line-height: 1.5 !important;
}

body.se-my-account-page .entry-content .woocommerce-message {
    background: #f0fdf4 !important;
    border-color: #bbf7d0 !important;
    color: #15803d !important;
}

body.se-my-account-page .entry-content .woocommerce-info {
    background: #f0f9ff !important;
    border-color: #bae6fd !important;
    color: #0369a1 !important;
}

body.se-my-account-page .entry-content .woocommerce-error {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
    color: #b91c1c !important;
    list-style: none !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

body.se-my-account-page .entry-content .woocommerce-error li {
    margin: 0 !important;
}

body.se-my-account-page .entry-content .woocommerce-message a.button,
body.se-my-account-page .entry-content .woocommerce-info a.button {
    margin-left: auto !important;
    background: var(--ma-primary) !important;
    color: var(--ma-primary-foreground) !important;
    height: 32px !important;
    line-height: 32px !important;
    font-size: 12px !important;
    padding: 0 12px !important;
    border-radius: 6px !important;
}

/* 6. 주문 테이블 스타일링 */
body.se-my-account-page .entry-content table.shop_table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid var(--ma-border) !important;
    border-radius: var(--ma-radius) !important;
    background: var(--ma-card) !important;
    overflow: hidden !important;
    margin: 0 0 32px 0 !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

body.se-my-account-page .entry-content table.shop_table th {
    background: var(--ma-muted) !important;
    color: var(--ma-foreground) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--ma-border) !important;
    text-align: left !important;
}

body.se-my-account-page .entry-content table.shop_table td {
    padding: 16px !important;
    border-bottom: 1px solid var(--ma-border) !important;
    font-size: 14px !important;
    color: var(--ma-foreground) !important;
    vertical-align: middle !important;
}

body.se-my-account-page .entry-content table.shop_table tr:last-child td {
    border-bottom: none !important;
}

body.se-my-account-page .entry-content table.shop_table .button {
    background: var(--ma-secondary) !important;
    color: var(--ma-secondary-foreground) !important;
    border: 1px solid var(--ma-border) !important;
    border-radius: 6px !important;
    height: 32px !important;
    line-height: 30px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
}

body.se-my-account-page .entry-content table.shop_table .button:hover {
    background: var(--ma-border) !important;
}

/* 7. 폼 레이아웃 & 징크 필드 컨트롤 */
body.se-my-account-page .entry-content form.edit-account,
body.se-my-account-page .entry-content form.woocommerce-EditAccountForm,
body.se-my-account-page .entry-content form.woocommerce-address-fields,
body.se-my-account-page .entry-content .woocommerce-Addresses {
    background: var(--ma-card) !important;
    border: 1px solid var(--ma-border) !important;
    border-radius: var(--ma-radius) !important;
    padding: 28px !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05) !important;
    margin-bottom: 32px !important;
}

body.se-my-account-page .entry-content .woocommerce-Addresses {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 24px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

body.se-my-account-page .entry-content .woocommerce-Address {
    background: var(--ma-card) !important;
    border: 1px solid var(--ma-border) !important;
    border-radius: var(--ma-radius) !important;
    padding: 24px !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05) !important;
}

body.se-my-account-page .entry-content .woocommerce-Address header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 16px !important;
    border-bottom: 1px solid var(--ma-border) !important;
    padding-bottom: 12px !important;
}

body.se-my-account-page .entry-content .woocommerce-Address h3 {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

body.se-my-account-page .entry-content .woocommerce-Address .edit {
    font-size: 13px !important;
    color: var(--ma-muted-foreground) !important;
    text-decoration: underline !important;
}

body.se-my-account-page .entry-content .woocommerce-Address address {
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: var(--ma-foreground) !important;
}

body.se-my-account-page .entry-content form .form-row {
    margin-bottom: 20px !important;
}

body.se-my-account-page .entry-content form label {
    display: block !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--ma-foreground) !important;
    margin-bottom: 6px !important;
}

body.se-my-account-page .entry-content input[type="text"],
body.se-my-account-page .entry-content input[type="email"],
body.se-my-account-page .entry-content input[type="tel"],
body.se-my-account-page .entry-content input[type="password"],
body.se-my-account-page .entry-content input[type="number"],
body.se-my-account-page .entry-content select,
body.se-my-account-page .entry-content textarea {
    width: 100% !important;
    height: 40px !important;
    padding: 8px 12px !important;
    background-color: var(--ma-background) !important;
    border: 1px solid var(--ma-input) !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    color: var(--ma-foreground) !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.02) !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    outline: none !important;
    box-sizing: border-box !important;
}

body.se-my-account-page .entry-content textarea {
    height: 120px !important;
    resize: vertical !important;
}

body.se-my-account-page .entry-content input:focus,
body.se-my-account-page .entry-content select:focus,
body.se-my-account-page .entry-content textarea:focus {
    border-color: var(--ma-primary) !important;
    box-shadow: 0 0 0 2px rgba(24, 24, 27, 0.08) !important;
}

/* 8. shadcn UI 올블랙 버튼 */
body.se-my-account-page .entry-content button[type="submit"],
body.se-my-account-page .entry-content .woocommerce-Button,
body.se-my-account-page .entry-content button.button,
body.se-my-account-page .entry-content .button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--ma-primary) !important;
    color: var(--ma-primary-foreground) !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    height: 40px !important;
    cursor: pointer !important;
    transition: background-color 0.2s !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

body.se-my-account-page .entry-content button[type="submit"]:hover,
body.se-my-account-page .entry-content .woocommerce-Button:hover,
body.se-my-account-page .entry-content button.button:hover,
body.se-my-account-page .entry-content .button:hover {
    background: #27272a !important;
}

body.se-my-account-page .entry-content form fieldset {
    border: 1px solid var(--ma-border) !important;
    border-radius: var(--ma-radius) !important;
    padding: 20px !important;
    margin-top: 24px !important;
    margin-bottom: 20px !important;
}

body.se-my-account-page .entry-content form fieldset legend {
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 8px !important;
    color: var(--ma-foreground) !important;
}

/* WooCommerce Points and Rewards 지원 */
body.se-my-account-page .entry-content .my-points-wrapper,
body.se-my-account-page .entry-content .points-history {
    background: var(--ma-card) !important;
    border: 1px solid var(--ma-border) !important;
    border-radius: var(--ma-radius) !important;
    padding: 24px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05) !important;
}

/* 9. 📱 모바일 반응형 조율 (768px 이하) - 가로 스크롤형 칩바 변환 */
@media (max-width: 768px) {
    body.se-my-account-page .entry-content {
        padding: 0 12px !important;
    }

    body.se-my-account-page .entry-content > .woocommerce {
        flex-direction: column !important;
        gap: 20px !important;
        padding: 20px 0 40px 0 !important;
        width: 100% !important;
    }

    body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation {
        flex: none !important;
        width: 100% !important;
        min-width: 100% !important;
        position: static !important;
        border: none !important;
        border-bottom: 1px solid var(--ma-border) !important;
        border-radius: 0 !important;
        background: transparent !important;
        padding: 0 0 8px 0 !important;
        box-shadow: none !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation::-webkit-scrollbar {
        display: none !important;
    }
    body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation {
        -ms-overflow-style: none !important;
        scrollbar-width: none !important;
    }

    body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation ul {
        flex-direction: row !important;
        gap: 8px !important;
        width: max-content !important;
        padding: 4px 0 !important;
    }

    body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation a {
        height: 34px !important;
        padding: 0 14px !important;
        font-size: 13px !important;
        border-radius: 20px !important;
        border: 1px solid var(--ma-border) !important;
        background: #ffffff !important;
    }

    body.se-my-account-page .entry-content .woocommerce-MyAccount-navigation li.is-active a {
        background: var(--ma-primary) !important;
        color: var(--ma-primary-foreground) !important;
        border-color: var(--ma-primary) !important;
    }

    body.se-my-account-page .entry-content .woocommerce-MyAccount-content {
        width: 100% !important;
    }

    body.se-my-account-page .entry-content form.edit-account,
    body.se-my-account-page .entry-content form.woocommerce-EditAccountForm,
    body.se-my-account-page .entry-content form.woocommerce-address-fields {
        padding: 16px !important;
    }

    body.se-my-account-page table.shop_table {
        font-size: 13px !important;
    }

    body.se-my-account-page table.shop_table th {
        padding: 10px 12px !important;
    }

    body.se-my-account-page table.shop_table td {
        padding: 12px !important;
    }
    
    body.se-my-account-page table.shop_table td.woocommerce-orders-table__cell-order-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
    }
}

/* 필터 위젯에서 '품절' 선택지 숨기기 */
.widget_layered_nav li.out-of-stock,
.widget_layered_nav li:contains("품절"),
.ct-sidebar .widget_layered_nav li:last-child:contains("품절") {
    display: none !important;
}

/* 필터 위젯에서 '품절' 체크박스 아예 안 보이게 삭제 */
.widget_layered_nav li.out-of-stock,
.ct-sidebar .widget ul li:nth-child(2) {
    display: none !important;
}


/**
 * ==========================================================================
 * [2] 블록시 추가 CSS 이관 영역
 * ==========================================================================
 */

/* 📝 우커머스 상품 제목 무조건 1줄 제한 및 말줄임(...) 강제 적용 */
.product .woocommerce-loop-product__title,
.product h2,
.product h3,
.product .product-title,
.product .ct-product-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 1 !important; /* 무조건 1줄에서 자르고 ... 표시 */
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    width: 100% !important;
    margin-bottom: 10px !important;
}

/* 링크 영역이 썸네일을 벗어나지 않도록 방어 */
.woocommerce-LoopProduct-link {
    display: block !important;
    max-width: 100% !important;
}

/* [공통] 상품 속성 표 기본 설정 */
.final-attr-wrapper table.woocommerce-product-attributes.shop_attributes {
    margin: 15px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    border-top: 2px solid #333 !important;
    border-bottom: 1px solid #eee !important;
    display: table !important;
    background-color: #ffffff !important;
    border-collapse: collapse !important;
}

.final-attr-wrapper table.woocommerce-product-attributes.shop_attributes tr {
    background-color: transparent !important;
}

/* [PC 상세페이지] 여유 있는 간격 */
.final-attr-wrapper table.woocommerce-product-attributes.shop_attributes th {
    width: 180px !important;
    min-width: 120px !important;
    padding: 10px 15px !important;
    background-color: rgba(0, 0, 0, 0.03) !important;
    border: none !important;
    border-bottom: 1px solid #fff !important;
    font-size: 12px !important;
    text-align: left !important;
    white-space: nowrap !important;
    color: #444 !important;
    font-weight: 500 !important;
}

.final-attr-wrapper table.woocommerce-product-attributes.shop_attributes td {
    padding: 10px 15px !important;
    border: none !important;
    border-bottom: 1px solid #eee !important;
    font-size: 12px !important;
    color: #111 !important;
    font-weight: 400 !important;
}

/* [퀵뷰(모달) 전용] 공간 절약을 위해 아주 컴팩트하게 조정 */
.ct-quick-view-card .final-attr-wrapper table.woocommerce-product-attributes.shop_attributes {
    margin: 5px 0 !important;
}

.ct-quick-view-card .final-attr-wrapper table.woocommerce-product-attributes.shop_attributes th,
.ct-quick-view-card .final-attr-wrapper table.woocommerce-product-attributes.shop_attributes td {
    padding: 6px 12px !important;
    font-size: 12px !important;
}

/* [모바일] 768px 이하 대응 */
@media (max-width: 768px) {
    .final-attr-wrapper table.woocommerce-product-attributes.shop_attributes th {
        width: 120px !important;
        min-width: 90px !important;
        padding: 6px 10px !important;
        font-size: 11px !important; /* 👈 기존 8px에서 11px로 살짝 키워 시인성 극대화 */
        white-space: normal !important;
    }
    
    .final-attr-wrapper table.woocommerce-product-attributes.shop_attributes td {
        padding: 6px 15px !important;
        font-size: 11px !important; /* 👈 기존 8px에서 11px로 살짝 키워 시인성 극대화 */
    }
}

/* [Clean-up] Removed duplicate Block */

/* 여백 정리 */
.final-attr-wrapper table.woocommerce-product-attributes.shop_attributes p {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
}

/* --- 상품 간소화: 썸네일 크기에 완벽히 연동되는 % 비율 버전 --- */

/* 1. 전체 리스트 묶음 */
.coin-feature-grid-vertical {
    display: flex !important;
    flex-direction: column !important;
    width: 80% !important; 
    margin: 0 auto !important;
    gap: 0 !important;
}

/* 2. 개별 카드 및 밑줄 담당 */
.coin-feature-card {
    display: grid !important;
    grid-template-columns: 25% 60% !important; 
    align-items: center !important;
    padding: 2% 0 !important; 
    border-bottom: 1px solid #eee !important;
    width: 100% !important; 
    box-sizing: border-box !important;
}

.coin-feature-card:last-child { 
    border-bottom: none !important; 
}

/* 3. 아이콘 구역 (왼쪽 정렬) */
.cf-icon {
    display: flex !important;
    justify-content: flex-start !important; 
    align-items: center !important;
    padding-left: 15% !important; 
}

/* 아이콘 크기 방어 */
.cf-icon-img, .cf-icon-img img, .cf-icon svg {
    max-width: 100% !important; 
    width: 18px !important; 
    height: auto !important;
    max-height: 18px !important;
    margin: 0 !important; 
    object-fit: contain !important;
}

/* 4. 텍스트 구역 (중앙 정렬) */
.cf-text {
    display: flex !important;
    justify-content: center !important; 
    align-items: center !important;
    width: 100% !important;
    padding-right: 15% !important; 
}

/* 텍스트 글꼴 설정 */
.cf-value {
    font-size: clamp(7px, 1.2vw, 11px) !important; 
    font-weight: 400 !important;
    color: #333 !important;
    text-align: center !important; 
    white-space: normal !important; 
    word-break: keep-all !important;
    line-height: 1.3 !important;
}

/* 라벨(METAL, WEIGHT 등) 숨김 */
.cf-label {
    display: none !important;
}

/* ==========================================================================
   🛒 우커머스 호환 100%: 가장 안정적이고 고급스러운 이미지 중앙 슬라이드 줌 호버 버튼
   ========================================================================== */

/* 이미지 컨테이너 기본 설정 복구 (이미지를 가리지 않음) */
.product .ct-media-container { 
    position: relative !important; 
    overflow: hidden !important;
}

/* 1. 장바구니 버튼을 썸네일 이미지 박스 내부 하단에 정밀 정렬 (처음엔 화이트 버튼 + 블랙 텍스트) */
.woocommerce ul.products li.product .ct-media-container .add_to_cart_button,
.woocommerce ul.products li.product .ct-media-container .ct-cart-button,
.woocommerce ul.products li.product .ct-media-container .button,
.product .add_to_cart_button,
.product .ct-cart-button,
.product .button[class*="product_type_"] {
    position: absolute !important; /* 👈 이미지 박스를 기준으로 절대 배치 */
    top: auto !important;
    left: 50% !important;
    
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    
    width: 75% !important; /* 👈 이미지의 양옆 여백을 넉넉히 남기는 세련된 가로폭 */
    max-width: 200px !important;
    height: 36px !important;
    
    font-size: 11px !important;
    line-height: 36px !important; /* 높이 변화에 맞춤형 라인높이 보정 */
    font-weight: 600 !important;
    border-radius: 30px !important; /* 👈 고급 명품숍의 알약 형태 적용 */
    
    /* [컬러 피드백] 화이트 배경 + 블랙 텍스트 (테두리 완전 제거) */
    border: none !important; /* 👈 검은색 테두리 완전히 제거 */
    background: #ffffff !important; 
    background-color: #ffffff !important; 
    color: #000000 !important; 
    
    z-index: 99 !important;
    cursor: pointer !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important; /* 👈 인위적이지 않게 아주 살짝만 들어간 명품 은은한 그림자 */
    
    /* 평소에는 썸네일 바깥(하단)에 완전히 숨김 처리 */
    bottom: -50px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(-50%) !important; /* 가로 방향 정중앙 정렬 */
    
    /* 물 흐르듯 가속도가 붙는 세련된 슬라이드 업 애니메이션 매핑 */
    transition: bottom 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
                opacity 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
                background-color 0.25s ease, 
                background 0.25s ease, 
                color 0.25s ease,
                box-shadow 0.25s ease !important;
}

/* 2. 상품 카드에 마우스 호버 시, 썸네일 내부 하단에서 스무스하게 슬라이드 업 등장 */
.product:hover .add_to_cart_button,
.product:hover .ct-cart-button,
.product:hover .button[class*="product_type_"],
.woocommerce ul.products li.product:hover .ct-media-container .add_to_cart_button,
.woocommerce ul.products li.product:hover .ct-media-container .ct-cart-button,
.woocommerce ul.products li.product:hover .ct-media-container .button {
    bottom: 12px !important; /* 👈 썸네일 이미지 하단 안쪽 12px 자리에 정밀 고착 */
    opacity: 1 !important;
    visibility: visible !important;
}

/* [호버 반전] 버튼 자체 마우스 호버 시 세련된 올 블랙 반전 피드백 (글자 하얀색) */
.woocommerce ul.products li.product .ct-media-container .add_to_cart_button:hover,
.woocommerce ul.products li.product .ct-media-container .ct-cart-button:hover,
.woocommerce ul.products li.product .ct-media-container .button:hover,
.product .add_to_cart_button:hover,
.product .ct-cart-button:hover,
.product .button[class*="product_type_"]:hover {
    background: #000000 !important; /* 👈 시크한 블랙으로 반전 */
    background-color: #000000 !important;
    color: #ffffff !important; 
    border: none !important; /* 👈 호버 시에도 테두리 없음 유지 */
    transform: translateX(-50%) scale(1.03) !important; /* 정렬 방해 없이 미세한 줌업 */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important; /* 👈 호버 시 자연스럽게 깊어지는 미세 입체 섀도우 */
}

/* 3. 모바일 반응형 최적화 (768px 이하) - 모바일 사이즈에서는 상품 리스트의 장바구니 버튼을 완벽히 숨김 */
@media (max-width: 768px) {
    .woocommerce ul.products li.product .ct-media-container .add_to_cart_button,
    .woocommerce ul.products li.product .ct-media-container .ct-cart-button,
    .woocommerce ul.products li.product .ct-media-container .button,
    .product .add_to_cart_button,
    .product .ct-cart-button,
    .product .button[class*="product_type_"] {
        display: none !important;
    }
    
    /* 모바일 호버/터치 모션 시에도 활성화 방지 */
    .product:hover .add_to_cart_button,
    .product:hover .ct-cart-button,
    .product:hover .button[class*="product_type_"],
    .woocommerce ul.products li.product:hover .ct-media-container .add_to_cart_button,
    .woocommerce ul.products li.product:hover .ct-media-container .ct-cart-button,
    .woocommerce ul.products li.product:hover .ct-media-container .button {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
}

/* 상품 제목 텍스트 마진 원상 복구 */
.product .woocommerce-loop-product__title,
.product h2,
.product h3,
.product .product-title,
.product .ct-product-title {
    margin-top: 10px !important;
}

/* 우커머스가 중복으로 자동 삽입하는 '장바구니 보기' 텍스트 링크 완벽 숨김 */
.product .added_to_cart {
    display: none !important;
}

/* 우커머스 가격 표시 레이아웃 */
.kr-custom-price-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 5px;
    line-height: 1.2;
}

/* 정가 및 취소선 영역 */
.kr-regular-price {
    font-size: 12px;
    font-weight: 400;
    color: #a0a0a0;
    margin-bottom: 0px;
}
.kr-regular-price del {
    text-decoration: line-through;
}

/* 가격과 (할인율↓) 묶음 */
.kr-sale-price-row {
    display: flex;
    align-items: baseline;
    gap: 5px;
}

/* 실제 결제할 가격 */
.kr-sale-price {
    font-size: 14px;
    font-weight: 400;
    color: #111111; 
}

/* 빨간색 (할인율↓) */
.kr-discount-rate {
    font-size: 10px;
    font-weight: 500;
    color: #e53935;
}

/* 할인이 없을 때는 위아래 구분이 필요 없으므로 배치 수정 */
.kr-custom-price-wrap.kr-no-sale {
    flex-direction: row;
    justify-content: center;
    width: 100%;
}

.product .price, .product-price {
    display: block !important;
}

/* 📱 모바일 반응형 (768px 이하 화면에서 비율 유지 축소) */
@media (max-width: 768px) {
    .kr-regular-price {
        font-size: 9px;
    }
    
    .kr-sale-price-row {
        gap: 4px;
    }
    
    .kr-sale-price {
        font-size: 11.5px;
    }
    
    .kr-discount-rate {
        font-size: 8px;
    }
}

/* 🔍 상품 상세 페이지(Single Product) 내 가격 정보 40% 확대 및 왼쪽 정렬 */
.single-product .summary .kr-custom-price-wrap,
.single-product .entry-summary .kr-custom-price-wrap {
    margin-bottom: 12px; 
    align-items: flex-start !important;
}

/* 할인이 없는 상품일 경우에도 상세 페이지에서는 왼쪽 정렬 */
.single-product .summary .kr-custom-price-wrap.kr-no-sale,
.single-product .entry-summary .kr-custom-price-wrap.kr-no-sale {
    justify-content: flex-start !important;
}

/* 정가 확대 */
.single-product .summary .kr-regular-price,
.single-product .entry-summary .kr-regular-price {
    font-size: 15.5px;
}

/* 간격 확대 */
.single-product .summary .kr-sale-price-row,
.single-product .entry-summary .kr-sale-price-row {
    gap: 7px;
}

/* 현재 가격 확대 */
.single-product .summary .kr-sale-price,
.single-product .entry-summary .kr-sale-price {
    font-size: 19.5px;
}

/* 할인율 확대 */
.single-product .summary .kr-discount-rate,
.single-product .entry-summary .kr-discount-rate {
    font-size: 14px;
}

/* ==========================================================================
   블록시(Blocksy) Pro 가격 필터 위젯 커스텀
   ========================================================================== */

/* 1. "Price:" 단어가 들어간 첫 번째 span 요소만 선택해서 숨김 */
.ct-price-filter-values > span:first-child {
    display: none !important;
}

/* 2. 남은 가격 숫자들과 대시(-) 기호의 폰트 크기를 12px로 변경 */
.ct-price-filter-values,
.ct-price-filter-values span {
    font-size: 12px !important;
}

/* 브랜드 이름 (Art Mint, CIT 등) 글자 크기 조절 */
.ct-filter-widget .ct-filter-label {
    font-size: 13px !important;
    font-weight: 400 !important;
    font-family: 'Pretendard', sans-serif !important;
}

/* 브랜드 옆의 개수 숫자 (2, 11 등) 글자 크기 조절 */
.ct-filter-widget .ct-filter-count {
    font-size: 11px !important;
}

/* 체크박스 정렬 보정 */
.ct-filter-widget .ct-checkbox {
    width: 10px !important;
    height: 16px !important;
}

/* 🛒 "장바구니 추가 완료" 안내 메시지 폰트 및 레이아웃 보정 */
.ct-added-to-cart-message {
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #111111 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* 3. 닫기 버튼 붕 뜸 현상 제어: 상단 여백이 사라진 장바구니 오프캔버스 내부 우측에 자연스럽게 동기화 (has 격리) */
.ct-panel:has(.widget_shopping_cart) .ct-panel-actions,
.ct-panel:has(.woocommerce-mini-cart) .ct-panel-actions,
.ct-panel:has(.empty-cart-premium-wrapper) .ct-panel-actions,
#offcanvas:has(.widget_shopping_cart) .ct-panel-actions,
#offcanvas:has(.woocommerce-mini-cart) .ct-panel-actions,
#offcanvas:has(.empty-cart-premium-wrapper) .ct-panel-actions {
    top: 20px !important;
    right: 20px !important;
    z-index: 9999 !important;
}

/* ==========================================================================
   🛒 텅 빈 장바구니 프리미엄 브랜드 컬렉션 커스텀 스타일
   ========================================================================== */
.empty-cart-premium-wrapper {
    padding: 30px 10px 40px 10px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 메인 제목 */
.ec-title {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin: 0 0 10px 0 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.3 !important;
}

/* 보조 가이드 텍스트 */
.ec-subtitle {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #777777 !important;
    line-height: 1.5 !important;
    margin: 0 0 24px 0 !important;
}

/* 브랜드 리스트 묶음 */
.ec-collections-grid {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 320px !important;
    gap: 10px !important;
}

/* 개별 브랜드 알약 버튼 */
.ec-col-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: 48px !important;
    padding: 0 24px !important;
    background: #f8f8f8 !important; /* 연한 회색 배경 */
    color: #111111 !important;
    text-decoration: none !important;
    border-radius: 30px !important; /* 명품 알약형 캡슐 형태 */
    font-family: 'Pretendard', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    transition: all 0.22s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-sizing: border-box !important;
}

/* 마우스 호버 시 세련된 시크 블랙 반전 피드백 */
.ec-col-btn:hover {
    background: #000000 !important; /* 블랙 반전 */
    color: #ffffff !important;
    transform: translateY(-2px) !important; /* 미세한 팝업 모션 */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1) !important;
}

.ec-col-btn .btn-arrow {
    font-size: 14px !important;
    font-weight: 400 !important;
    transition: transform 0.22s ease !important;
}

.ec-col-btn:hover .btn-arrow {
    transform: translateX(4px) !important; /* 화살표 오른쪽으로 슬라이딩 모션 */
}

/* 모바일 반응형 조율 */
@media (max-width: 768px) {
    .empty-cart-premium-wrapper {
        padding: 20px 8px 30px 8px !important;
    }
    .ec-title {
        font-size: 18px !important;
        margin-bottom: 8px !important;
    }
    .ec-subtitle {
        font-size: 12px !important;
        margin-bottom: 20px !important;
    }
    .ec-col-btn {
        height: 42px !important;
        font-size: 12px !important;
        padding: 0 20px !important;
    }
}

/* ==========================================================================
   🛒 장바구니 드로어 내 2단 탭 (Cart / Last viewed) 및 최근 본 상품 리스트
   ========================================================================== */

/* 1. 2단 탭 헤더 영역 */
.kcb-cart-tabs {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
}

.kcb-tab-btn {
    background: transparent !important;
    border: none !important;
    font-family: 'Pretendard', sans-serif !important;
    font-size: 18px !important; /* 스샷 크기와 일치화 */
    font-weight: 700 !important;
    color: #cccccc !important; /* 비활성화 탭은 희뿌연 회색 */
    cursor: pointer !important;
    padding: 0 0 4px 0 !important;
    margin: 0 !important;
    transition: color 0.2s ease !important;
    border-bottom: 2px solid transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

.kcb-tab-btn.is-active {
    color: #111111 !important; /* 활성화 탭은 올 블랙 */
}

/* 2. 최근 본 상품 패널 및 리스트 */
.kcb-last-viewed-panel {
    width: 100% !important;
    padding: 16px 20px 40px 20px !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    max-height: calc(100vh - 100px) !important;
}

.kcb-lv-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    width: 100% !important;
}

/* 개별 상품 아이템 */
.kcb-lv-item {
    display: grid !important;
    grid-template-columns: 60px 1fr auto !important; /* 이미지 - 제목/가격 - 담기버튼 정렬 */
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid #f1f1f1 !important;
}

.kcb-lv-item:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

/* 상품 썸네일 이미지 */
.kcb-lv-thumb {
    width: 60px !important;
    height: 60px !important;
    object-fit: cover !important;
    border-radius: 50% !important; /* 캡처본에 따라 완벽한 원형 둥글기 적용! */
    background: #f8f8f8 !important;
    border: 1px solid #eeeeee !important;
    display: block !important;
}

/* 상품 정보 (제목 및 가격) */
.kcb-lv-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    min-width: 0 !important;
    text-align: left !important;
}

.kcb-lv-title {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 11.5px !important; /* 아주 컴팩트하고 깔끔한 크기 */
    font-weight: 500 !important;
    color: #333333 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important; /* 2줄 제한 */
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    word-break: keep-all !important;
}

.kcb-lv-title-link {
    text-decoration: none !important;
}

.kcb-lv-title-link:hover .kcb-lv-title {
    color: #000000 !important;
    text-decoration: underline !important;
}

.kcb-lv-price {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #888888 !important;
}

/* 액션 버튼 (+ Add, Sold Out) */
.kcb-lv-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 30px !important;
    padding: 0 16px !important;
    font-family: 'Pretendard', sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 6px !important; /* 명품 컴팩트 라운딩 */
    box-sizing: border-box !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
}

/* 담기 버튼 (+ Add) */
.kcb-lv-btn.add_to_cart_button {
    background: #111111 !important;
    color: #ffffff !important;
    border: none !important;
}

.kcb-lv-btn.add_to_cart_button:hover {
    background: #000000 !important;
    transform: scale(1.03) !important;
}

/* 품절 버튼 (Sold Out) */
.kcb-lv-btn.out-of-stock {
    background: #888888 !important;
    color: #ffffff !important;
    border: none !important;
    cursor: not-allowed !important;
}

/* 모바일 반응형 조정 */
@media (max-width: 768px) {
    .kcb-tab-btn {
        font-size: 16px !important;
    }
    .kcb-last-viewed-panel {
        padding: 12px 14px 30px 14px !important;
    }
    .kcb-lv-item {
        grid-template-columns: 50px 1fr auto !important;
        gap: 10px !important;
        padding-bottom: 12px !important;
    }
    .kcb-lv-thumb {
        width: 50px !important;
        height: 50px !important;
    }
    .kcb-lv-title {
        font-size: 10.5px !important;
    }
    .kcb-lv-btn {
        height: 28px !important;
        padding: 0 12px !important;
        font-size: 10.5px !important;
    }
}

/* 체크 아이콘 크기 축소 */
.ct-added-to-cart-message .ct-check-icon {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
}

/* 🛒 장바구니 알림 팝업 내 개별 상품 가격 줄바꿈(2줄) 원천 차단 */
.ct-added-to-cart-product .price,
.ct-added-to-cart-product .amount {
    white-space: nowrap !important;
    display: inline-block !important;
}

/* 📱 모바일 대응 */
@media (max-width: 768px) {
    .ct-added-to-cart-product .price,
    .ct-added-to-cart-product .amount {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   🛒 추천 상품 팝업 하단 [추천 상품] 탭 개별 스타일링
   ========================================================================== */

/* 1. 상품 제목 */
.ct-suggested-products--cart-popup [data-products] .ct-product-title {
    --theme-font-size: 12px !important;
    --theme-font-weight: 500 !important;
    font-size: 12px !important; 
    font-weight: 500 !important;
    line-height: 1.3 !important; 
    margin-bottom: 4px !important;
}

/* 2. 판매 가격 */
.ct-suggested-products--cart-popup [data-products] .kr-sale-price {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #111111 !important;
}

/* 3. 섹션 대제목 */
.ct-suggested-products--cart-popup .ct-module-title {
    font-size: 14.5px !important; 
    font-weight: 500 !important;
    letter-spacing: -0.3px !important;
    margin-bottom: 12px !important;
}


/**
 * ==========================================================================
 * [3] 신규 기능 스타일링 영역 (SKU & 관심상품 라벨 고도화)
 * ==========================================================================
 */

/* 4개 항목(SKU, 카테고리, 태그, 브랜드) 전체 폰트 크기 및 두께 제어 */
.product_meta {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.8 !important;
    color: #374151 !important;
}

.product_meta span,
.product_meta a {
    font-size: inherit !important;
    font-family: inherit !important;
}

/* SKU 코드 및 링크들만 볼드 처리 */
.product_meta .sku,
.product_meta a {
    font-weight: 600 !important;
    color: #111111 !important;
    text-decoration: none;
    transition: color 0.2s ease;
}

.product_meta a:hover {
    color: #ffcd05 !important; /* 테마의 시그니처 옐로우 포인트 적용 */
    text-decoration: underline;
}

/* 위시리스트/관심상품 라벨 및 아이콘 최적화 */
/* 위시리스트/관심상품 라벨 및 아이콘 최적화 */
.woo-button-wishlist,
.ct-wishlist-button,
.ct-wishlist-button-single,
.compare-button,
.woosc-btn,
.ct-compare-button,
.ct-compare-button-single {
    font-size: 12px !important;
}

.woo-button-wishlist .ct-label,
.ct-wishlist-button .ct-label,
.ct-wishlist-button-single .ct-label,
.compare-button .ct-label,
.compare-button a,
.woosc-btn .ct-label,
.woosc-btn a,
.woosc-btn span,
.ct-compare-button .ct-label,
.ct-compare-button-single .ct-label {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 12px !important;   /* 데스크탑 12px 고도화 */
    font-weight: 500 !important;
}

.ct-wishlist-button,
.ct-wishlist-button-single,
.compare-button,
.woosc-btn,
.ct-compare-button,
.ct-compare-button-single {
    gap: 6px !important;
}

.ct-wishlist-button svg,
.ct-wishlist-button-single svg,
.compare-button svg,
.woosc-btn svg,
.ct-compare-button svg,
.ct-compare-button-single svg {
    width: 14px !important;  /* 텍스트 크기에 비례한 아이콘 축소 */
    height: 14px !important;
    flex-shrink: 0 !important;
}

/* 📱 모바일 반응형 (768px 이하) - 폰트크기 10px 스케일 다운 및 날렵한 32px 높이 조절 */
@media (max-width: 768px) {
    .woo-button-wishlist,
    .ct-wishlist-button,
    .ct-wishlist-button-single,
    .compare-button,
    .woosc-btn,
    .ct-compare-button,
    .ct-compare-button-single {
        font-size: 10px !important;
        height: 32px !important;            /* 👈 모바일 컴팩트 32px 높이 강제 고정 */
        min-height: auto !important;        /* 👈 테마 기본 최소 높이 초기화 */
        padding: 0 12px !important;         /* 👈 위아래 여백을 깎고 좌우 여백만 날렵하게 설정 */
        display: inline-flex !important;    /* 👈 세로 정렬 균형 완벽화 */
        align-items: center !important;
        justify-content: center !important;
        line-height: 1 !important;
    }
    
    .woo-button-wishlist .ct-label,
    .ct-wishlist-button .ct-label,
    .ct-wishlist-button-single .ct-label,
    .compare-button .ct-label,
    .compare-button a,
    .woosc-btn .ct-label,
    .woosc-btn a,
    .woosc-btn span,
    .ct-compare-button .ct-label,
    .ct-compare-button-single .ct-label {
        font-size: 10px !important;   /* 모바일 10px 고도화 */
        line-height: 1 !important;
    }
}

/* 🛍️ 단일 상품 상세 페이지 내 장바구니 버튼 라운딩(border-radius) 일치화 */
.single-product .single_add_to_cart_button,
.single-product button.single_add_to_cart_button,
.single-product .ct-cart-button,
.single-product .summary .cart .button {
    border-radius: 30px !important; /* 수량 조절 박스와 동일하게 완전한 캡슐 라운드 형태 매핑 */
}

/* 📝 [모바일] 768px 이하 - 상품 상세설명 탭 내부 텍스트 12px로 통일 (인라인 스타일 강제 오버라이드) */
@media (max-width: 768px) {
    #tab-description,
    #tab-description p,
    #tab-description span,
    #tab-description strong,
    #tab-description li,
    #tab-description em,
    .woocommerce-Tabs-panel--description,
    .woocommerce-Tabs-panel--description * {
        font-size: 12px !important;
        line-height: 1.6 !important; /* 모바일 가독성을 위한 줄간격 최적화 */
    }
}

/* 🏷️ [모바일] 768px 이하 - 상세페이지 상품명(H1) 대형 폰트 크기 슬림화 */
@media (max-width: 768px) {
    .single-product h1.product_title,
    .single-product h1.entry-title,
    .single-product h1.ct-dynamic-data,
    h1.product_title.entry-title,
    h1.ct-dynamic-data.has-large-font-size,
    h1.has-large-font-size {
        font-size: 16px !important;    /* 👈 피드백을 적극 수렴하여 세련된 16px 컴팩트 크기로 축소 */
        line-height: 1.35 !important;  /* 👈 16px 크기에 최적화된 안정감 있는 1.35 줄간격 적용 */
        letter-spacing: -0.3px !important; /* 👈 컴팩트 폰트에 걸맞은 자연스러운 미세 자간 설정 */
    }
}

/* ==========================================================================
   📱 Blocksy 모바일 오프캔버스(드로어) 중 오직 [장바구니 드로어]에만 100% 격리 적용
   (has 선택자를 활용해 모바일 메뉴 드로어 오염을 완전히 원천 차단하여 헤더 찌그러짐 버그 완벽 제어)
   ========================================================================== */

/* 1. 최상위 드로어 랩퍼들 투명화 (내부에 장바구니 관련 요소가 존재할 때만 격리 적용) */
.ct-drawer-canvas:has(.widget_shopping_cart),
.ct-drawer-canvas:has(.woocommerce-mini-cart),
.ct-drawer-canvas:has(.empty-cart-premium-wrapper),
#offcanvas:has(.widget_shopping_cart),
#offcanvas:has(.woocommerce-mini-cart),
#offcanvas:has(.empty-cart-premium-wrapper),
.ct-panel:has(.widget_shopping_cart),
.ct-panel:has(.woocommerce-mini-cart),
.ct-panel:has(.empty-cart-premium-wrapper) {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* 2. 진짜 드로어 통합 바디 (.ct-panel-inner)를 층짐 없이 100% 꽉 채우고 라운딩 처리 (장바구니 드로어 격리) */
#offcanvas:has(.widget_shopping_cart) .ct-panel-inner,
#offcanvas:has(.woocommerce-mini-cart) .ct-panel-inner,
#offcanvas:has(.empty-cart-premium-wrapper) .ct-panel-inner,
.ct-panel:has(.widget_shopping_cart) .ct-panel-inner,
.ct-panel:has(.woocommerce-mini-cart) .ct-panel-inner,
.ct-panel:has(.empty-cart-premium-wrapper) .ct-panel-inner {
    border-radius: 30px 0 0 30px !important; /* 기본 우측 드로어: 왼쪽 모서리만 둥글게 */
    background: #ffffff !important; /* 드로어 전체를 층짐 없이 깨끗한 순백색으로 채움 */
    height: 100% !important; /* 모바일 브라우저 하단 오버플로우 방지 */
    height: 100dvh !important; /* 최신 동적 뷰포트 웹표준으로 정확히 기기 바닥 매핑 */
    
    display: flex !important;
    flex-direction: column !important;
    box-shadow: -5px 0 25px rgba(0,0,0,0.15) !important; /* 왼쪽 방향 은은한 그림자 */
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 2-1. [버그 수정] 왼쪽에서 슬라이딩되는 필터 드로어 전용 예외처리 (위치 복원 및 좌우 라운딩 보정) */
#woo-filters-panel .ct-panel-inner {
    border-radius: 0 30px 30px 0 !important; /* 좌측 드로어: 오른쪽 모서리만 둥글게 */
    box-shadow: 5px 0 25px rgba(0,0,0,0.15) !important; /* 오른쪽 방향 그림자 */
}

/* 3. 내부 개별 파트들의 배경색을 모두 투명화하여 일체화 (장바구니 드로어 내부 격리) */
.ct-panel:has(.widget_shopping_cart) .ct-panel-actions,
.ct-panel:has(.woocommerce-mini-cart) .ct-panel-actions,
.ct-panel:has(.empty-cart-premium-wrapper) .ct-panel-actions {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: none !important; /* 닫기 버튼 하단 경계선 제거 */
    padding-top: 24px !important;
    padding-bottom: 8px !important;
    position: static !important; /* 기본 흐름으로 환원하여 본문 영역과 자연스럽게 배치 */
}

.ct-panel:has(.widget_shopping_cart) .ct-panel-content,
.ct-panel:has(.woocommerce-mini-cart) .ct-panel-content,
.ct-panel:has(.empty-cart-premium-wrapper) .ct-panel-content {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    height: auto !important;
    flex: 1 !important; /* 남은 높이 영역을 꽉 채움 */
    padding-top: 0 !important;
    overflow-y: auto !important; /* 👈 세로 스크롤 가능하게 지정 */
    -webkit-overflow-scrolling: touch !important; /* iOS 환경에서 부드러운 스크롤 매핑 */
}

.ct-panel:has(.widget_shopping_cart) .ct-panel-content-inner,
.ct-panel:has(.woocommerce-mini-cart) .ct-panel-content-inner,
.ct-panel:has(.empty-cart-premium-wrapper) .ct-panel-content-inner {
    background: transparent !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

/* ==========================================================================
   🛒 텅 빈 장바구니 내부의 최근 본 상품 미니 섹션 스타일링
   ========================================================================== */
.ec-recently-viewed-section {
    width: 100% !important;
    max-width: 320px !important;
    margin-top: 30px !important;
    padding-top: 24px !important;
    border-top: 1px dashed #e2e8f0 !important;
    text-align: left !important;
}

.ec-rv-title {
    font-family: 'Pretendard', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin: 0 0 16px 0 !important;
    letter-spacing: -0.3px !important;
}

.ec-rv-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    width: 100% !important;
}

/* 모바일 반응형 조율 */
@media (max-width: 768px) {
    .ec-recently-viewed-section {
        margin-top: 20px !important;
        padding-top: 16px !important;
    }
    .ec-rv-title {
        font-size: 12.5px !important;
        margin-bottom: 12px !important;
    }
}

/* ==========================================================================
   🛍️ 프리미엄 상품 카드 테두리, 라운딩 및 은은한 명품 그림자 효과
   ========================================================================== */
/* 1. 공통: 모든 상품 리스트(아카이브, 샵, 연관상품 등)의 상품 카드 스타일링 */
.woocommerce ul.products li.product,
.products .product {
    border: 1px solid #eef2f6 !important; /* 기본적으로 1px 은은한 파스텔톤 테두리 부여 */
    border-radius: 12px !important;       /* 👈 세련된 12px 라운딩 */
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03) !important; /* 👈 자연스럽고 미세한 명품 섀도우 */
    overflow: hidden !important;          /* 👈 모서리 라운딩 영역 밖으로 이미지가 튀어나오지 않게 가둠 */
    background: #ffffff !important;        /* 👈 깨끗한 흰색 배경 보장 */
    padding: 12px !important;             /* 👈 내부 구성 요소들이 테두리에 밀착되지 않도록 컴팩트한 패딩 부여 */
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                box-shadow 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                border-color 0.3s ease !important; /* 👈 부드러운 트랜지션 효과 추가 */
}

/* 2. 썸네일 이미지 영역 간격 보정 */
.woocommerce ul.products li.product figure,
.products .product figure {
    margin: 0 0 10px 0 !important;
    border-radius: 8px !important; /* 👈 이미지 영역도 카드 라운딩에 맞추어 둥글게 */
    overflow: hidden !important;
}

/* 3. 마우스 호버 시 팝업 및 그림자 깊어지는 공통 모션 */
.woocommerce ul.products li.product:hover,
.products .product:hover {
    transform: translateY(-4px) !important; /* 👈 공중으로 4px 살짝 뜨는 세련된 효과 */
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08) !important; /* 👈 호버 시 자연스럽게 깊어지는 미세 입체 섀도우 */
    border-color: #e2e8f0 !important; /* 👈 테두리 색상도 살짝 짙어지며 반응 */
}

/* 4. 예외처리: 연관 상품(Related) 및 추천 상품(Upsells) 카드는 '테두리만 제거' (그림자, 라운딩, 호버효과는 그대로 유지!) */
.single-product .related.products .product:hover,
.single-product .upsells.products .product:hover {
    border-color: transparent !important; /* 👈 호버 시에도 테두리 없음 유지 */
}

/* ==========================================================================
   🇰🇷 한국형 하이브리드 회원가입 약관 동의 모달 커스텀 스타일 (GSAP & Pretendard 통합)
   ========================================================================== */
.kr-signup-modal-wrap {
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, sans-serif !important;
    padding: 10px 0 !important;
    text-align: left !important;
}

.kr-signup-modal-wrap * {
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, sans-serif !important;
}

/* 1. 소셜 로그인 영역 */
.kr-social-signup-box {
    margin-bottom: 20px !important;
}

.kr-social-buttons {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.kr-social-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 44px !important;
    border-radius: 30px !important; /* 명품 알약형 캡슐 형태 */
    font-size: 12.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important;
    cursor: pointer !important;
}

.kr-social-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

/* 카카오 브랜드 컬러 */
.kr-kakao-btn {
    background-color: #fee500 !important;
    color: #191919 !important;
}

/* 네이버 브랜드 컬러 */
.kr-naver-btn {
    background-color: #03c75a !important;
    color: #ffffff !important;
}

/* 구분선 */
.kr-divider {
    display: flex !important;
    align-items: center !important;
    text-align: center !important;
    margin: 20px 0 !important;
    color: #94a3b8 !important;
}

.kr-divider::before,
.kr-divider::after {
    content: '' !important;
    flex: 1 !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.kr-divider span {
    padding: 0 10px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
}

/* 2. 약관 동의 폼 영역 */
.kr-terms-signup-box {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

/* 전체 동의 박스 (강조 배경) */
.kr-terms-agree-all {
    background-color: #f8fafc !important;
    border: 1px solid var(--form-field-border-color, #e2e8f0) !important;
    border-radius: var(--form-field-border-radius, 24px) !important;
    padding: 12px 20px !important; /* 좌우 패딩을 넓혀 둥근 모서리에 정합 */
}

.kr-agree-all-text {
    font-family: var(--theme-font-family, 'Pretendard', sans-serif) !important;
    font-size: var(--form-field-font-size, 13.5px) !important;
    font-weight: 500 !important;
    color: var(--theme-text-color, #334155) !important;
}

/* 약관 리스트 */
.kr-terms-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    background-color: #ffffff !important;
}

.kr-term-item {
    border: 1px solid var(--form-field-border-color, #f1f5f9) !important;
    border-radius: var(--form-field-border-radius, 24px) !important;
    overflow: hidden !important;
}

.kr-term-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 20px !important; /* 모서리 곡률에 맞춘 내부 좌우 여백 */
    background-color: #ffffff !important;
}

.kr-term-label {
    font-family: var(--theme-font-family, 'Pretendard', sans-serif) !important;
    font-size: var(--form-field-font-size, 13px) !important;
    font-weight: 500 !important;
    color: var(--form-label-color, #475569) !important;
}

.kr-required-badge {
    color: #e11d48 !important; /* 필수 빨간색 */
    font-weight: 500 !important;
}

.kr-optional-badge {
    color: #64748b !important; /* 선택 회색 */
    font-weight: 500 !important;
}

/* 아코디언 토글 및 외부 링크 버튼 */
.kr-term-toggle-btn,
.kr-term-link-btn {
    background: transparent !important;
    border: none !important;
    color: #64748b !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    transition: color 0.2s ease !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.kr-term-toggle-btn:hover,
.kr-term-link-btn:hover {
    color: var(--theme-color-1, #0f172a) !important;
    text-decoration: underline !important;
}

/* 약관 상세 내용 텍스트 박스 */
.kr-term-content {
    display: none; /* JS/GSAP에서 보일 예정 */
    border-top: 1px solid var(--form-field-border-color, #f1f5f9) !important;
}

.kr-term-text-inner {
    padding: 12px 20px !important; /* 패딩 확장 */
    background-color: #f8fafc !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    color: #475569 !important;
    max-height: 110px !important;
    overflow-y: auto !important;
    border-bottom-left-radius: var(--form-field-border-radius, 24px) !important;
    border-bottom-right-radius: var(--form-field-border-radius, 24px) !important;
}

/* 3. 다음 단계 버튼 */
.kr-next-step-row {
    margin-top: 10px !important;
}

.kr-btn-next {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 48px !important;
    border-radius: var(--button-border-radius, 8px) !important; /* 로그인 폼 버튼과 통일 */
    font-family: var(--theme-font-family, 'Pretendard', sans-serif) !important;
    font-size: var(--form-field-font-size, 13.5px) !important;
    font-weight: 700 !important;
    background-color: var(--button-background-color, #000000) !important;
    color: var(--button-text-color, #ffffff) !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.kr-btn-next:hover:not(.disabled) {
    background-color: var(--button-hover-background-color, #1e293b) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15) !important;
}

/* 다음 단계 버튼 비활성 상태 */
.kr-btn-next.disabled {
    background-color: #e2e8f0 !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

/* 4. 커스텀 체크박스 스타일링 */
.kr-checkbox-container {
    display: inline-flex !important;
    align-items: center !important;
    position: relative !important;
    padding-left: 26px !important;
    cursor: pointer !important;
    user-select: none !important;
}

.kr-checkbox-container input {
    position: absolute !important;
    opacity: 0 !important;
    cursor: pointer !important;
    height: 0 !important;
    width: 0 !important;
}

.kr-checkmark {
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    transform: translateY(-50%) !important;
    height: 16px !important;
    width: 16px !important;
    background-color: #ffffff !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 4px !important;
    transition: all 0.2s ease !important;
}

/* 체크박스 호버 효과 */
.kr-checkbox-container:hover input ~ .kr-checkmark {
    border-color: #94a3b8 !important;
}

/* 체크박스 선택 시 채워짐 */
.kr-checkbox-container input:checked ~ .kr-checkmark {
    background-color: #000000 !important;
    border-color: #000000 !important;
}

/* 체크박스 내부의 체크 기호(✓) 생성 */
.kr-checkmark::after {
    content: "" !important;
    position: absolute !important;
    display: none !important;
    left: 5px !important;
    top: 2px !important;
    width: 4px !important;
    height: 8px !important;
    border: solid white !important;
    border-width: 0 1.5px 1.5px 0 !important;
    transform: rotate(45deg) !important;
}

/* 체크 상태일 때 체크 표시 켜기 */
.kr-checkbox-container input:checked ~ .kr-checkmark::after {
    display: block !important;
}

/* 가입완료 버튼 비활성화 스타일 */
.kr-btn-submit-signup.disabled {
    background-color: #cbd5e1 !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    opacity: 0.8 !important;
}

/* 인증 피드백 간격 조율 */
#se_otp_feedback {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    font-weight: 600;
}

/* 회원가입 모달을 로그인 입력폼 높이/톤에 맞춤 */
.kr-terms-signup-box {
    gap: 10px !important;
}

.kr-terms-agree-all {
    display: flex !important;
    align-items: center !important;
    min-height: 40px !important;
    background-color: #ffffff !important;
    border-color: #e2e8f0 !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.kr-terms-list {
    gap: 10px !important;
}

.kr-term-row {
    min-height: 40px !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.kr-next-step-row {
    margin-top: 14px !important;
}

.kr-btn-next {
    height: 40px !important;
    box-shadow: none !important;
}

/* ==========================================================================
   [Clean-up] Removed all tail-end duplicated/destructive blocks to restore Blocksy theme functions.
   ========================================================================== */