/* ============================================================
   Google AdSense Safety Layout Template
   Purpose: Prevent accidental clicks / Reduce invalid traffic / Improve ad compliance
   ============================================================ */

/* Base safety rules */
.adsbygoogle {
    display: block;
    clear: both;
    width: 100%;
    max-width: 100%;
    margin: 40px 0 !important;        /* Safe vertical spacing */
    padding: 20px 0;                  /* Internal padding to avoid edge contact */
    overflow: hidden;
    background-color: transparent;    /* Keep background transparent to prevent misleading */
    z-index: 1;
}

/* General ad container */
.ad-container {
    margin: 50px auto;
    max-width: 100%;
    overflow: hidden;
    text-align: center;
    line-height: 1.4;
}

/* Prevent ads from being too close to buttons and interactive elements */
button + .adsbygoogle,
.adsbygoogle + button,
a.inline-flex + .adsbygoogle,
.adsbygoogle + a.inline-flex,
input + .adsbygoogle,
.adsbygoogle + input {
    margin-top: 50px !important;
}

/* Maintain distance from navigation areas */
nav + .adsbygoogle,
.adsbygoogle + nav {
    margin: 60px 0 !important;
}

/* Keep separation from footer content */
footer + .adsbygoogle,
.adsbygoogle + footer {
    margin: 70px 0 !important;
}

/* Avoid ads being too close to images or media */
figure + .adsbygoogle,
.adsbygoogle + figure,
img + .adsbygoogle,
.adsbygoogle + img,
video + .adsbygoogle,
.adsbygoogle + video {
    margin-top: 40px !important;
}

/* ============================================================
   Mobile safety optimization
   ============================================================ */
@media (max-width: 768px) {
    .adsbygoogle {
        margin-top: 30px !important;
        margin-bottom: 30px !important;
        padding: 16px 0;
    }

    .ad-container {
        margin: 40px auto;
        padding: 0 8px;
    }

    button + .adsbygoogle,
    .adsbygoogle + button,
    a.inline-flex + .adsbygoogle,
    .adsbygoogle + a.inline-flex {
        margin-top: 40px !important;
    }

    nav + .adsbygoogle,
    .adsbygoogle + nav {
        margin: 50px 0 !important;
    }
}

/* ============================================================
   Additional safety strategies
   ============================================================ */

/* Prevent ad area click-through */
.adsbygoogle iframe {
    pointer-events: auto !important;
}

/* Prevent ads from exceeding container or distorting */
.adsbygoogle,
.adsbygoogle ins {
    max-width: 100% !important;
    height: auto !important;
}

/* Leave enough space for auto and native ad formats */
ins.adsbygoogle[data-ad-format="auto"],
ins.adsbygoogle[data-ad-format="fluid"] {
    min-height: 120px;
}

/* ============================================================
   Visual enhancement (help users distinguish ads from content)
   ============================================================ */
.ad-container::before {
    content: "Advertisement";
    display: block;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    color: #999;
    text-align: center;
    margin-bottom: 10px;
}