/* Google Ads Styling */
.ad-container {
    width: 100%;
    max-width: 970px;
    margin: 12px auto;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 90px;
    min-width: 320px; /* 최소 너비 보장 */
    overflow: hidden;
}

/* AdSense 광고 기본 스타일 */
.adsbygoogle {
    background-color: transparent;
}

/* 320x50 광고 중앙 정렬 */
.ad-container .adsbygoogle[style*="width:320px"] {
    margin: 0 auto;
}

.ad-placeholder {
    display: none;
}

/* 메인 페이지 광고 */
.ad-top {
    margin-top: 10px;
    margin-bottom: 20px;
}

.ad-bottom {
    margin-top: 30px;
    margin-bottom: 20px;
}

/* 테스트 페이지 광고 */
.ad-test-top {
    margin-bottom: 20px;
}

.ad-test-middle {
    margin: 25px auto;
}

/* 결과 페이지 광고 */
.ad-result-top {
    margin-bottom: 20px;
}

.ad-result-middle {
    margin: 30px auto;
}

.ad-result-bottom {
    margin: 25px auto 20px;
}

/* 공유 페이지 광고 */
.ad-share-top {
    margin-bottom: 16px;
}

.ad-share-middle {
    margin: 20px auto;
    min-width: 336px; /* auto 광고의 최소 너비 보장 */
}

/* 모바일 최적화 */
@media (max-width: 768px) {
    .ad-container {
        margin: 15px auto;
        padding: 0 10px;
    }
    
    /* 728x90 광고를 모바일에서 반응형으로 */
    .ad-container .adsbygoogle[style*="width:728px"] {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
    
    .ad-placeholder {
        max-width: 320px;
        min-height: 50px;
        font-size: 12px;
        padding: 15px;
    }
    
    /* 모바일에서는 광고 간격을 좀 더 줄임 */
    .ad-top,
    .ad-test-top,
    .ad-result-top,
    .ad-share-top {
        margin-bottom: 12px;
    }
    
    .ad-test-middle,
    .ad-result-middle,
    .ad-share-middle {
        margin: 16px auto;
    }
    
    .ad-bottom,
    .ad-result-bottom {
        margin-top: 20px;
        margin-bottom: 15px;
    }
}

/* 태블릿 최적화 */
@media (min-width: 769px) and (max-width: 1024px) {
    .ad-placeholder {
        max-width: 468px;
        min-height: 60px;
    }
}

/* 광고가 로드되지 않았을 때 숨김 처리 */
.ad-container.ad-hidden {
    display: none;
}

/* 광고 로딩 애니메이션 */
.ad-placeholder.loading {
    background: linear-gradient(90deg, #f0f0f0 25%, transparent 37%, #f0f0f0 63%);
    background-size: 400% 100%;
    animation: shimmer 1.5s ease-in-out infinite;
}

@keyframes shimmer {
    0% {
        background-position: 100% 50%;
    }
    100% {
        background-position: -100% 50%;
    }
}