.adsense-placement {
    position: relative;
    width: 100%;
    margin: 32px auto;
    box-sizing: border-box;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
}

/* AdSense uses ins elements, which inherit the global diff highlight. */
ins.adsbygoogle {
    background: transparent;
}

.adsense-placement[role="note"] {
    min-height: 136px;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px;
    background: linear-gradient(135deg, #fcfbff, #f5f1fd);
    color: #493d63;
    overflow: hidden;
}

.adsense-placement.ad-rectangle[role="note"] {
    min-height: 220px;
    max-width: 760px;
}

.adsense-placement[role="note"] .card-body {
    position: relative;
    width: 100%;
    padding: 22px;
}

.adsense-placement-label {
    position: absolute;
    top: 14px;
    right: 16px;
    padding: 4px 10px;
    border: 1px solid #d6c7f6;
    border-radius: 999px;
    background: #eee8fb;
    color: #6038ef;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.2;
}
.adsense-placement[role="note"] strong {
    font-size: 14px;
    line-height: 1.4;
}

.adsense-placement-caption {
    margin-top: 3px;
    color: #8a809a;
    font-size: 12px;
}

@media (max-width: 720px) {
    .adsense-placement { margin: 24px auto; }
    .adsense-placement[role="note"] { min-height: 116px; }
    .adsense-placement.ad-rectangle[role="note"] { min-height: 170px; }
}

.article-page .ad-article-mid,
.article-page .ad-article-bottom {
    width: 100%;
    max-width: var(--content-w, 1200px);
    box-sizing: border-box;
}

.article-page .ad-article-mid { margin: 28px 0; }
.article-page .ad-article-bottom { margin: 40px auto 24px; }
.news-page #side_wrap .ad-sidebar { width: 100%; margin: 20px 0 0; }
.news-page #side_wrap .ad-sidebar[role="note"] { min-height: 240px; }

@media (max-width: 720px) {
    .article-page .ad-article-mid { margin: 24px 0; }
    .article-page .ad-article-bottom { margin: 16px auto 20px; }
}
#body_wrap.content-detail .text-post .adsense-placement-label { font-size: 11px !important; line-height: 1.2 !important; }
#body_wrap.content-detail .text-post .adsense-placement-caption { font-size: 12px !important; line-height: 1.4 !important; }
#body_wrap.content-detail .text-post .adsense-placement strong { font-size: 14px !important; line-height: 1.4 !important; }
@media (max-width: 720px) {
    .article-page .ad-article-bottom { width: calc(100% - 50px); }
}
.search-page .ad-search-bottom {
    width: 100%;
    max-width: var(--content-w, 1200px);
    margin: 16px auto 24px;
    box-sizing: border-box;
}
@media (max-width: 720px) {
    .search-page .ad-search-bottom { margin: 12px auto 20px; }
}
#content_wrap .ad-section-bottom {
    width: 100%;
    margin: 36px auto 24px;
    box-sizing: border-box;
}
@media (max-width: 720px) {
    #content_wrap .ad-section-bottom { margin: 28px auto 20px; }
}
.page_content_wrap .ad-page-bottom {
    width: 100%;
    max-width: var(--content-w, 1200px);
    margin: 36px auto 24px;
    box-sizing: border-box;
}
@media (max-width: 720px) {
    .page_content_wrap .ad-page-bottom { margin: 28px auto 20px; }
    .page_content_wrap > .ad-page-bottom { width: calc(100% - 30px); }
}
.search-page .search-carousel-wrap .news-carousel { margin-bottom: 0; }
.section-ad-page #side_wrap .ad-sidebar { width: 100%; margin: 20px 0 0; }
.section-ad-page #side_wrap .ad-sidebar[role="note"] { min-height: 240px; }
.search-page .label-v-middle { min-height: 220px; }
@media (max-width: 720px) {
    .search-page .label-v-middle { min-height: 160px; }
}
/* Remove the wrapper and its spacing after AdSense reports no ad. */
.adsense-placement.adsense-unfilled { display: none !important; }
.adsense-placement:not(.adsense-local):not(.adsense-loaded) { min-height: 136px; }
.adsense-placement.ad-rectangle:not(.adsense-local):not(.adsense-loaded) { min-height: 220px; }
.adsense-placement.ad-sidebar:not(.adsense-local):not(.adsense-loaded) { min-height: 240px; }
.adsense-placement .adsense-loading {
    display: flex;
    position: absolute;
    inset: 0;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    color: #827b8e;
    font-size: 12px;
}
.adsense-loading-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #ddd8e8;
    border-top-color: #7556c6;
    border-radius: 50%;
    animation: adsense-loading-spin .8s linear infinite;
}
@keyframes adsense-loading-spin { to { transform: rotate(360deg); } }
.adsense-placement.adsense-loaded .adsense-loading { display: none; }
.adsense-local .adsense-local-placeholder { display: none; }
.adsense-local.adsense-loaded .adsense-local-placeholder { display: block; }
.adsense-local-placeholder strong,
.adsense-local-placeholder .adsense-placement-caption { display: block; }
@media (max-width: 720px) {
    .adsense-placement:not(.adsense-local):not(.adsense-loaded) { min-height: 116px; }
    .adsense-placement.ad-rectangle:not(.adsense-local):not(.adsense-loaded) { min-height: 170px; }
}
