.elementor-21 .elementor-element.elementor-element-25e8a4b{--display:flex;}.elementor-21 .elementor-element.elementor-element-ff3b61f{--spacer-size:50px;}.elementor-21 .elementor-element.elementor-element-4b2d0d6{--spacer-size:50px;}/* Start custom CSS for wc-elements, class: .elementor-element-b8eb139 *//* * WooCommerce 'My Account' 위젯 스타일
 * (nunbusinhaebssal.com 테마 적용)
 *
 * .account 클래스를 가진 위젯 래퍼를 기준으로 합니다.
 */

/* --- 색상 변수 (눈부신햅쌀 기준) --- */
:root {
    --rice-green: #0E3E42;  /* 메인 딥 그린 */
    --rice-gold: #B5945F;  /* 포인트 골드 */
    --rice-beige: #F8F5F0; /* 메인 배경 베이지 */
    --rice-text-dark: #202A38; /* 다크 네이비 (제목용) */
    --rice-text: #444444;    /* 일반 텍스트 */
    --rice-border: #EAEAEA;  /* 연한 테두리 */
}

/* --- 1. 위젯 전체 컨테이너 --- */
/* .account 클래스가 있는 컨테이너 (위젯 전체) */
.account {
    /* 상품 카드와 동일한 스타일 적용 */
    background-color: var(--rice-beige); 
    border: 1px solid var(--rice-border);
    border-radius: 12px; /* 사이트와 동일한 둥근 모서리 */
    padding: 25px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); /* 은은한 그림자 */
}

/* --- 2. 위젯 제목 (예: "My Account") --- */
.account .widget-title {
    color: var(--rice-text-dark);
    font-size: 20px; 
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 20px;
    padding-bottom: 15px;
    /* 포인트 색상으로 하단 라인 */
    border-bottom: 2px solid var(--rice-gold);
}

/* --- 3. 환영 메시지 (예: "안녕하세요, [이름]님") --- */
.account p:first-of-type {
    font-size: 15px;
    color: var(--rice-text);
    margin-bottom: 25px;
    line-height: 1.6;
    border-bottom: 1px solid var(--rice-border);
    padding-bottom: 20px;
}
.account p:first-of-type a {
    color: var(--rice-green); /* 링크는 딥 그린 */
    font-weight: 600;
    text-decoration: none;
}
.account p:first-of-type a:hover {
    color: var(--rice-gold); /* 호버 시 골드 */
}

/* --- 4. 네비게이션 메뉴 (핵심) --- */
/* (Dashboard, Orders, Downloads, Logout 등) */
.account .woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.account .woocommerce-MyAccount-navigation li {
    margin: 0;
}

.account .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 14px 10px;
    color: var(--rice-text-dark);
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    transition: all 0.3s ease;
    border-bottom: 1px solid var(--rice-border); /* 각 메뉴를 라인으로 구분 */
    position: relative;
    padding-left: 28px; /* 아이콘을 위한 공간 */
}

/* 마지막 메뉴의 하단 라인만 제거 */
.account .woocommerce-MyAccount-navigation li:last-child a {
    border-bottom: none;
}

/* --- 5. 메뉴 앞 아이콘 (›) --- */
.account .woocommerce-MyAccount-navigation li a::before {
    content: '›';
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    font-weight: 700;
    color: var(--rice-gold); /* 포인트 골드 색상 */
    transition: all 0.3s ease;
}

/* --- 6. 호버 (마우스 올렸을 때) --- */
.account .woocommerce-MyAccount-navigation li a:hover {
    background-color: #ffffff; /* 배경 베이지 -> 호버 시 흰색 */
    color: var(--rice-green); /* 텍스트를 딥 그린으로 */
}
.account .woocommerce-MyAccount-navigation li a:hover::before {
    color: var(--rice-green); /* 아이콘도 딥 그린으로 */
    left: 12px; /* 살짝 오른쪽으로 움직이는 효과 */
}

/* --- 7. 활성 메뉴 (현재 페이지) --- */
.account .woocommerce-MyAccount-navigation li.is-active > a {
    background-color: var(--rice-green); /* 배경 딥 그린 */
    color: #ffffff; /* 텍스트 흰색 */
    border-color: var(--rice-green); /* 하단 라인도 동일하게 */
}
.account .woocommerce-MyAccount-navigation li.is-active > a::before {
    color: var(--rice-gold); /* 딥 그린 배경 + 골드 아이콘 */
    left: 12px;
}/* End custom CSS */