/**
 * WIA Books - My Account Cyberpunk Style v3
 * 사이버펑크 테마 스타일 (최강 셀렉터)
 */

/* ===== 전체 배경 투명화 ===== */
body.woocommerce-account .entry-content,
body.woocommerce-account .site-content,
body.woocommerce-account .inside-article,
body.woocommerce-account article,
body.woocommerce-account .content-area {
    background: transparent !important;
}

/* ===== 메인 컨테이너 ===== */
body.woocommerce-account .woocommerce,
.woocommerce-account .woocommerce {
    background: linear-gradient(180deg, rgba(26, 26, 46, 0.98) 0%, rgba(22, 33, 62, 0.98) 100%) !important;
    border-radius: 20px !important;
    padding: 40px !important;
    position: relative !important;
    box-shadow: 0 0 50px rgba(0, 212, 255, 0.25), 
                0 0 100px rgba(255, 0, 255, 0.1),
                inset 0 0 60px rgba(0, 0, 0, 0.4) !important;
    margin: 20px auto !important;
    max-width: 1100px !important;
    border: 2px solid rgba(0, 212, 255, 0.5) !important;
}

/* 네온 글로우 테두리 */
body.woocommerce-account .woocommerce::before {
    content: '' !important;
    position: absolute !important;
    top: -3px !important;
    left: -3px !important;
    right: -3px !important;
    bottom: -3px !important;
    background: linear-gradient(135deg, #ff00ff, #00d4ff, #ff00ff, #00d4ff) !important;
    border-radius: 22px !important;
    z-index: -1 !important;
    animation: neonPulse 3s ease-in-out infinite !important;
    opacity: 0.5 !important;
    filter: blur(3px) !important;
}

@keyframes neonPulse {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.7; }
}

/* ===== 페이지 타이틀 ===== */
body.woocommerce-account .entry-title,
body.woocommerce-account h1.entry-title,
.woocommerce-account .entry-title {
    font-size: 48px !important;
    font-weight: 800 !important;
    text-align: center !important;
    background: linear-gradient(135deg, #00ffcc, #00d4ff, #00ffcc) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    margin-bottom: 30px !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
}

/* ===== 로그인/회원가입 폼 컨테이너 (비로그인) ===== */
body.woocommerce-account .u-columns,
body.woocommerce-account .woocommerce > .u-columns,
.woocommerce-account .u-columns {
    display: flex !important;
    gap: 30px !important;
    flex-wrap: wrap !important;
}

body.woocommerce-account .u-columns .u-column1,
body.woocommerce-account .u-columns .u-column2,
body.woocommerce-account .u-columns .col-1,
body.woocommerce-account .u-columns .col-2,
body.woocommerce-account .col-1,
body.woocommerce-account .col-2,
.woocommerce-account .col-1,
.woocommerce-account .col-2 {
    flex: 1 !important;
    min-width: 300px !important;
}

/* ===== 로그인 폼 박스 ===== */
body.woocommerce-account .woocommerce-form-login,
body.woocommerce-account .woocommerce-form-register,
body.woocommerce-account form.woocommerce-form-login,
body.woocommerce-account form.woocommerce-form-register,
body.woocommerce-account form.login,
body.woocommerce-account form.register,
.woocommerce-form-login,
.woocommerce-form-register,
form.woocommerce-form-login,
form.woocommerce-form-register {
    background: rgba(0, 0, 0, 0.5) !important;
    border-radius: 16px !important;
    padding: 35px !important;
    border: 1px solid rgba(0, 212, 255, 0.4) !important;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.4), 
                inset 0 0 30px rgba(0, 212, 255, 0.05) !important;
}

/* ===== 폼 타이틀 h2 ===== */
body.woocommerce-account h2,
body.woocommerce-account .woocommerce h2,
body.woocommerce-account form h2,
.woocommerce-form-login h2,
.woocommerce-form-register h2 {
    color: #00d4ff !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    margin-bottom: 30px !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    border-bottom: 2px solid rgba(0, 212, 255, 0.3) !important;
    padding-bottom: 15px !important;
    text-align: center !important;
}

/* ===== 입력 필드 ===== */
body.woocommerce-account input[type="text"],
body.woocommerce-account input[type="email"],
body.woocommerce-account input[type="password"],
body.woocommerce-account input[type="tel"],
body.woocommerce-account input[type="number"],
body.woocommerce-account textarea,
body.woocommerce-account select,
body.woocommerce-account .input-text,
body.woocommerce-account .woocommerce-Input,
.woocommerce-form-login input[type="text"],
.woocommerce-form-login input[type="password"],
.woocommerce-form-register input[type="text"],
.woocommerce-form-register input[type="email"],
.woocommerce-form-register input[type="password"] {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(0, 212, 255, 0.4) !important;
    border-radius: 10px !important;
    padding: 15px 18px !important;
    color: #fff !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

body.woocommerce-account input:focus,
body.woocommerce-account textarea:focus,
body.woocommerce-account select:focus {
    outline: none !important;
    border-color: #00d4ff !important;
    background: rgba(0, 212, 255, 0.15) !important;
    box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.2), 
                0 0 25px rgba(0, 212, 255, 0.15) !important;
}

body.woocommerce-account input::placeholder {
    color: #666 !important;
}

/* ===== 라벨 ===== */
body.woocommerce-account label,
body.woocommerce-account .woocommerce-form-row label,
.woocommerce-form-login label,
.woocommerce-form-register label {
    color: #80e5ff !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 10px !important;
    display: block !important;
}

/* 필수 표시 (*) */
body.woocommerce-account label .required,
.woocommerce-form-login label .required,
.woocommerce-form-register label .required {
    color: #ff00ff !important;
}

/* ===== 버튼 ===== */
body.woocommerce-account button[type="submit"],
body.woocommerce-account input[type="submit"],
body.woocommerce-account .button,
body.woocommerce-account .woocommerce-Button,
body.woocommerce-account .woocommerce-button,
.woocommerce-form-login .button,
.woocommerce-form-login button,
.woocommerce-form-register .button,
.woocommerce-form-register button {
    background: linear-gradient(135deg, #00d4ff 0%, #0088cc 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 15px 35px !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    box-shadow: 0 5px 20px rgba(0, 212, 255, 0.4) !important;
    width: 100% !important;
    margin-top: 10px !important;
}

body.woocommerce-account button[type="submit"]:hover,
body.woocommerce-account input[type="submit"]:hover,
body.woocommerce-account .button:hover {
    background: linear-gradient(135deg, #00e5ff 0%, #00aadd 100%) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 30px rgba(0, 212, 255, 0.6) !important;
}

/* ===== 체크박스 (Remember me) ===== */
body.woocommerce-account input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: #00d4ff !important;
    margin-right: 10px !important;
    vertical-align: middle !important;
}

body.woocommerce-account .woocommerce-form-login__rememberme,
body.woocommerce-account .woocommerce-form__label-for-checkbox,
.woocommerce-form-login__rememberme {
    color: #888 !important;
    display: flex !important;
    align-items: center !important;
    font-size: 14px !important;
    margin: 15px 0 !important;
}

/* ===== Lost Password 링크 ===== */
body.woocommerce-account .woocommerce-LostPassword,
body.woocommerce-account .lost_password,
.woocommerce-LostPassword {
    text-align: center !important;
    margin-top: 20px !important;
}

body.woocommerce-account .woocommerce-LostPassword a,
body.woocommerce-account .lost_password a,
.woocommerce-LostPassword a {
    color: #ff00ff !important;
    font-size: 13px !important;
    text-decoration: none !important;
    transition: all 0.3s !important;
}

body.woocommerce-account .woocommerce-LostPassword a:hover {
    color: #ff66ff !important;
    text-decoration: underline !important;
}

/* ===== 로그인 후 - 네비게이션 ===== */
body.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-navigation {
    background: rgba(0, 0, 0, 0.4) !important;
    border-radius: 15px !important;
    padding: 20px !important;
    border: 1px solid rgba(0, 212, 255, 0.3) !important;
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.3) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin-bottom: 8px !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: flex !important;
    align-items: center !important;
    padding: 14px 18px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 10px !important;
    color: #80e5ff !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background: rgba(0, 212, 255, 0.15) !important;
    border-color: rgba(0, 212, 255, 0.4) !important;
    transform: translateX(5px) !important;
    color: #fff !important;
    box-shadow: 0 0 15px rgba(0, 212, 255, 0.2) !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: linear-gradient(135deg, rgba(0, 212, 255, 0.25), rgba(255, 0, 255, 0.15)) !important;
    border-color: #00d4ff !important;
    color: #fff !important;
    box-shadow: 0 0 20px rgba(0, 212, 255, 0.3) !important;
}

/* 네비게이션 아이콘 */
.woocommerce-MyAccount-navigation-link--dashboard a::before { content: '🏠 '; }
.woocommerce-MyAccount-navigation-link--orders a::before { content: '📦 '; }
.woocommerce-MyAccount-navigation-link--downloads a::before { content: '⬇️ '; }
.woocommerce-MyAccount-navigation-link--edit-address a::before { content: '📍 '; }
.woocommerce-MyAccount-navigation-link--edit-account a::before { content: '👤 '; }
.woocommerce-MyAccount-navigation-link--customer-logout a::before { content: '🚪 '; }

/* ===== 로그인 후 - 콘텐츠 영역 ===== */
body.woocommerce-account .woocommerce-MyAccount-content {
    background: rgba(0, 0, 0, 0.3) !important;
    border-radius: 15px !important;
    padding: 30px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #d0d0d0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content p {
    color: #a0a0a0 !important;
    line-height: 1.8 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content a {
    color: #00d4ff !important;
}

body.woocommerce-account .woocommerce-MyAccount-content a:hover {
    color: #ff00ff !important;
}

/* ===== 알림 메시지 ===== */
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info {
    background: rgba(0, 212, 255, 0.15) !important;
    border-left: 4px solid #00d4ff !important;
    border-radius: 10px !important;
    color: #fff !important;
    padding: 18px 22px !important;
    margin-bottom: 20px !important;
}

body.woocommerce-account .woocommerce-error {
    background: rgba(255, 0, 100, 0.15) !important;
    border-left: 4px solid #ff0064 !important;
    border-radius: 10px !important;
    color: #fff !important;
    padding: 18px 22px !important;
}

/* ===== 테이블 ===== */
body.woocommerce-account table {
    background: rgba(0, 0, 0, 0.2) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid rgba(0, 212, 255, 0.2) !important;
}

body.woocommerce-account table th {
    background: rgba(0, 212, 255, 0.15) !important;
    color: #00d4ff !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    padding: 15px !important;
    border: none !important;
}

body.woocommerce-account table td {
    padding: 15px !important;
    color: #a0a0a0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    background: transparent !important;
}

/* ===== 반응형 ===== */
@media (max-width: 768px) {
    body.woocommerce-account .woocommerce {
        padding: 25px !important;
        margin: 15px !important;
    }
    
    body.woocommerce-account .entry-title {
        font-size: 32px !important;
        letter-spacing: 3px !important;
    }
    
    body.woocommerce-account .u-columns {
        flex-direction: column !important;
    }
}