/* Mobile Text Color Fix - 모바일 환경에서 카드 내 텍스트 색상 명확하게 표시 */
/* 2025년 1월 3일 - 모바일에서 흐릿한 회색 텍스트 문제 해결 */

/* 전역 텍스트 렌더링 최적화 */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* 모바일 환경에서 카드 내 모든 텍스트 요소 강제 검은색 */
@media (max-width: 768px) {
    /* 카드 내 리스트 아이템 - 최우선 순위 */
    .management-features li,
    .feature-list li,
    .tab-pane .management-features li,
    .tab-pane .feature-list li,
    .common-management .management-features li,
    .dashboard-grid .feature-list li,
    .module-card ul li,
    .management-card ul li,
    .feature-card ul li,
    ul.management-features li,
    ul.feature-list li,
    div.management-card ul li,
    div.module-card ul li {
        color: #000000 !important;  /* 순수 검은색 */
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
        font-weight: 500 !important;
        text-shadow: none !important;
    }
    
    /* 리스트 아이템의 모든 자식 요소도 검은색 */
    .management-features li *:not(i),
    .feature-list li *:not(i),
    .tab-pane .management-features li *:not(i),
    .tab-pane .feature-list li *:not(i) {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
    }
    
    /* 카드 본문 텍스트 */
    .management-card p,
    .module-card p,
    .feature-card p,
    .tab-pane .management-card p,
    .tab-pane .module-card p,
    div.management-card p,
    div.module-card p {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
    }
    
    /* 카드 설명 텍스트 */
    .management-description,
    .feature-description,
    .module-description,
    .card-description,
    .management-card .description,
    .module-card .description,
    .tab-pane .management-description,
    .tab-pane .feature-description,
    div[class*="description"] {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
    }
    
    /* 카드 내 span 요소 */
    .management-card span,
    .module-card span,
    .feature-card span,
    .tab-pane .management-card span,
    .tab-pane .module-card span,
    div.management-card span:not(.icon),
    div.module-card span:not(.icon) {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
    }
    
    /* 카드 내 div 요소 (아이콘 제외) */
    .management-card div:not(.management-icon):not(.module-icon),
    .module-card div:not(.management-icon):not(.module-icon),
    .tab-pane .management-card div:not(.management-icon):not(.module-icon),
    .tab-pane .module-card div:not(.management-icon):not(.module-icon) {
        color: #000000 !important;
    }
    
    /* 부모 요소의 opacity 초기화 */
    .management-card,
    .module-card,
    .feature-card,
    .tab-pane .management-card,
    .tab-pane .module-card,
    .common-management .management-card,
    .dashboard-grid .module-card,
    div.management-card,
    div.module-card {
        opacity: 1 !important;
    }
    
    /* 그라데이션 텍스트가 아닌 일반 텍스트는 검은색 */
    .management-card *:not(.management-title):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(i),
    .module-card *:not(.module-title):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(i),
    .tab-pane .management-card *:not(.management-title):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(i),
    .tab-pane .module-card *:not(.module-title):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(i) {
        color: #000000 !important;
    }
}

/* 아주 작은 모바일 기기 (480px 이하) */
@media (max-width: 480px) {
    .management-features li,
    .feature-list li,
    .tab-pane .management-features li,
    .tab-pane .feature-list li {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
        font-size: 0.95rem !important;
        font-weight: 500 !important;
        line-height: 1.6 !important;
    }
}

/* 중간 모바일 기기 (481px ~ 640px) */
@media (min-width: 481px) and (max-width: 640px) {
    .management-features li,
    .feature-list li,
    .tab-pane .management-features li,
    .tab-pane .feature-list li {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
        font-size: 1rem !important;
        font-weight: 500 !important;
    }
}

/* 큰 모바일/작은 태블릿 (641px ~ 768px) */
@media (min-width: 641px) and (max-width: 768px) {
    .management-features li,
    .feature-list li,
    .tab-pane .management-features li,
    .tab-pane .feature-list li {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
        font-size: 1.05rem !important;
        font-weight: 500 !important;
    }
}

/* iOS Safari 특수 처리 */
@supports (-webkit-touch-callout: none) {
    @media (max-width: 768px) {
        .management-features li,
        .feature-list li,
        .tab-pane .management-features li,
        .tab-pane .feature-list li {
            color: #000000 !important;
            opacity: 1 !important;
            -webkit-text-fill-color: #000000 !important;
            -webkit-appearance: none !important;
        }
    }
}

/* Android Chrome 특수 처리 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    @media (max-width: 768px) {
        .management-features li,
        .feature-list li,
        .tab-pane .management-features li,
        .tab-pane .feature-list li {
            color: #000000 !important;
            opacity: 1 !important;
            -webkit-text-fill-color: #000000 !important;
        }
    }
}

/* 다크 모드에서도 검은색 유지 */
@media (prefers-color-scheme: dark) {
    @media (max-width: 768px) {
        .management-features li,
        .feature-list li,
        .tab-pane .management-features li,
        .tab-pane .feature-list li,
        .management-card p,
        .module-card p,
        .management-description,
        .feature-description {
            color: #000000 !important;
            opacity: 1 !important;
            -webkit-text-fill-color: #000000 !important;
            background-color: transparent !important;
        }
    }
}

/* 터치 기반 기기 전용 */
@media (hover: none) and (pointer: coarse) {
    .management-features li,
    .feature-list li,
    .tab-pane .management-features li,
    .tab-pane .feature-list li {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
    }
}

/* 최종 강제 적용 - 모든 다른 CSS보다 우선 */
@media (max-width: 768px) {
    body .management-features li,
    body .feature-list li,
    body .tab-pane .management-features li,
    body .tab-pane .feature-list li,
    html body .management-features li,
    html body .feature-list li {
        color: #000000 !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #000000 !important;
    }
}