/**
 * KN Ads Frontend Styles
 * Strict isolation to prevent ad types from interfering with each other
 */

/* ============================================================
   CONSENT GATING (cache-safe)
   Do not rely on PHP output differences (page caches).
   Only show ad visuals after JS adds `html.kn-cookie-marketing-consent`.
   ============================================================ */
html:not(.kn-cookie-marketing-consent) .kn-ad-wrapper-own-banner,
html:not(.kn-cookie-marketing-consent) .kn-ad-responsive-fallback-img {
    display: none !important;
}

/* Outer wrapper: no extra space; when empty and option on, hidden via .kn-ad-wrapper-empty */
.kn-ad-wrapper {
    margin: 0;
    padding: 0;
    display: block;
    box-sizing: border-box;
}

/* Base container - no sizing rules here to prevent interference */
.kn-ad-container {
    display: block !important;
    position: relative;
    overflow: visible; /* Changed from hidden to visible so ads can be seen */
    box-sizing: border-box;
    visibility: visible !important; /* Ensure containers are visible */
    opacity: 1 !important; /* Ensure containers are not transparent */
    margin: 0; /* Remove default margins that might cause spacing issues */
    padding: 0; /* Remove default padding */
    clear: both; /* Ensure ads don't float into each other */
}

/* Fallback image for mobile/tablet: hidden on desktop, shown on small screens (resized full banner) */
.kn-ad-responsive-fallback-img {
    display: none !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    vertical-align: middle;
}

/* ============================================
   OWN BANNER (uploaded image + link; responsive, no crop)
   Selected size = MAXIMUM; ad can only get smaller on small screens.
   Constrain both wrapper and container so theme/other CSS cannot override.
   ============================================ */
.kn-ad-wrapper-own-banner {
    display: block;
    margin: 0;
    padding: 0;
}
/* Selected size = max on WRAPPER (Adition + own banner) so block never exceeds chosen size */
.kn-ad-wrapper.kn-ad-rectangle {
    max-width: 300px !important;
    width: 100% !important;
}
.kn-ad-wrapper.kn-ad-skyscraper {
    max-width: 450px !important;
    width: 100% !important;
}
.kn-ad-wrapper.kn-ad-billboard {
    max-width: 970px !important;
    width: 100% !important;
}
/* Own-banner wrapper (redundant with above but explicit) */
.kn-ad-wrapper.kn-ad-wrapper-own-banner.kn-ad-rectangle {
    max-width: 300px !important;
    width: 100% !important;
}
.kn-ad-wrapper.kn-ad-wrapper-own-banner.kn-ad-skyscraper {
    max-width: 450px !important;
    width: 100% !important;
}
.kn-ad-wrapper.kn-ad-wrapper-own-banner.kn-ad-billboard {
    max-width: 970px !important;
    width: 100% !important;
}
.kn-ad-container.kn-ad-own-banner {
    display: block !important;
    width: 100% !important;
    min-width: 0;
    height: auto !important;
    margin: 0;
    padding: 0;
    overflow: visible;
    box-sizing: border-box;
}
/* Selected size = max on container as well (double lock) */
.kn-ad-container.kn-ad-own-banner.kn-ad-rectangle {
    max-width: 300px !important;
}
.kn-ad-container.kn-ad-own-banner.kn-ad-skyscraper {
    max-width: 450px !important;
}
.kn-ad-container.kn-ad-own-banner.kn-ad-billboard {
    max-width: 970px !important;
}
.kn-ad-own-banner-link {
    display: block;
    line-height: 0;
}
.kn-ad-own-banner-img {
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    vertical-align: middle;
}

/* ============================================
   FIXED SIZE ADS - Strict sizing rules
   ============================================ */

/* Fixed Skyscraper: 300x600 - STRICT, no interference */
.kn-ad-container.kn-ad-fixed.kn-ad-skyscraper {
    width: 300px !important;
    height: 600px !important;
    max-width: 300px !important;
    max-height: 600px !important;
    min-width: 300px;
    min-height: 600px;
    aspect-ratio: unset !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* Fixed Rectangle: 300x250 - STRICT, no interference */
.kn-ad-container.kn-ad-fixed.kn-ad-rectangle {
    width: 300px !important;
    height: 250px !important;
    max-width: 300px !important;
    max-height: 250px !important;
    min-width: 300px;
    min-height: 250px;
    aspect-ratio: unset !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* Fixed Billboard: 970x250 - STRICT, no interference */
.kn-ad-container.kn-ad-fixed.kn-ad-billboard {
    width: 970px !important;
    height: 250px !important;
    max-width: 970px !important;
    max-height: 250px !important;
    min-width: 970px !important;
    min-height: 250px !important;
    aspect-ratio: unset !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* Ensure billboard container always has proper size */
.kn-ad-container.kn-ad-billboard {
    min-width: 970px !important;
    min-height: 250px !important;
}

/* Backward compatibility - if no responsive class, treat as fixed */
.kn-ad-container.kn-ad-skyscraper:not(.kn-ad-responsive) {
    width: 300px !important;
    height: 600px !important;
    max-width: 300px !important;
    max-height: 600px !important;
    aspect-ratio: unset !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

.kn-ad-container.kn-ad-rectangle:not(.kn-ad-responsive) {
    width: 300px !important;
    height: 250px !important;
    max-width: 300px !important;
    max-height: 250px !important;
    aspect-ratio: unset !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

.kn-ad-container.kn-ad-billboard:not(.kn-ad-responsive) {
    width: 970px !important;
    height: 250px !important;
    max-width: 970px !important;
    max-height: 250px !important;
    min-width: 970px !important;
    min-height: 250px !important;
    aspect-ratio: unset !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* ============================================
   RESPONSIVE ADS - Strict proportional scaling
   ============================================ */

/* Responsive Billboard: 970x250 ratio - STRICT, isolated */
.kn-ad-container.kn-ad-responsive.kn-ad-billboard {
    width: 100% !important;
    max-width: 970px !important;
    min-width: 0;
    height: auto !important;
    aspect-ratio: 970 / 250 !important; /* Strict ratio - 3.88:1 */
    /* Prevent interference from other ad types */
    min-height: 0;
    max-height: none;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* Responsive Rectangle: 300x250 ratio - STRICT, isolated */
.kn-ad-container.kn-ad-responsive.kn-ad-rectangle {
    width: 100% !important;
    max-width: 300px !important;
    min-width: 0;
    height: auto !important;
    aspect-ratio: 300 / 250 !important; /* Strict ratio - 1.2:1 */
    /* Prevent interference from other ad types */
    min-height: 0;
    max-height: none;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* Responsive Skyscraper: range 300x600–450x900 (1:2 ratio) - STRICT, isolated */
.kn-ad-container.kn-ad-responsive.kn-ad-skyscraper {
    width: 100% !important;
    min-width: 300px !important;
    max-width: 450px !important;
    height: auto !important;
    aspect-ratio: 300 / 600 !important; /* Strict ratio 1:2 - same as 450/900 */
    /* Prevent interference from other ad types */
    min-height: 0;
    max-height: none;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* ============================================
   AD SLOT STYLING - Type-specific isolation
   ============================================ */

/* Base ad slot */
.kn-ad-slot {
    display: block !important;
    width: 100%;
    height: 100%;
    min-height: 50px;
    box-sizing: border-box;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
    z-index: auto; /* Ensure proper stacking */
}

/* Ensure multiple ad slots can display together */
.kn-ad-slot + .kn-ad-slot {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Billboard ad slot - ensure proper sizing */
.kn-ad-container.kn-ad-billboard .kn-ad-slot {
    width: 100% !important;
    height: 100% !important;
    min-width: 970px !important;
    min-height: 250px !important;
}

/* Fixed billboard ad slot - exact dimensions */
.kn-ad-container.kn-ad-fixed.kn-ad-billboard .kn-ad-slot,
.kn-ad-container.kn-ad-billboard:not(.kn-ad-responsive) .kn-ad-slot {
    width: 970px !important;
    height: 250px !important;
    min-width: 970px !important;
    min-height: 250px !important;
}

/* Fixed-size ad slots - fill container exactly */
.kn-ad-container.kn-ad-fixed .kn-ad-slot,
.kn-ad-container:not(.kn-ad-responsive) .kn-ad-slot {
    width: 100% !important;
    height: 100% !important;
    position: relative;
    display: block;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Responsive ad slots - fill container proportionally */
.kn-ad-container.kn-ad-responsive .kn-ad-slot {
    width: 100% !important;
    height: 100% !important;
    display: block;
    position: relative; /* Changed from absolute to relative for better visibility */
    top: 0;
    left: 0;
    box-sizing: border-box;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Billboard responsive slot - specific */
.kn-ad-container.kn-ad-responsive.kn-ad-billboard .kn-ad-slot {
    width: 100% !important;
    height: 100% !important;
}

/* Rectangle responsive slot - specific */
.kn-ad-container.kn-ad-responsive.kn-ad-rectangle .kn-ad-slot {
    width: 100% !important;
    height: 100% !important;
}

/* Skyscraper responsive slot - specific */
.kn-ad-container.kn-ad-responsive.kn-ad-skyscraper .kn-ad-slot {
    width: 100% !important;
    height: 100% !important;
}

/* ============================================
   AD CONTENT SCALING - Prevent interference
   ============================================ */

/* Responsive ad content - Billboard specific */
.kn-ad-container.kn-ad-responsive.kn-ad-billboard .kn-ad-slot > *,
.kn-ad-container.kn-ad-responsive.kn-ad-billboard .kn-ad-slot iframe,
.kn-ad-container.kn-ad-responsive.kn-ad-billboard .kn-ad-slot img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    display: block;
    object-fit: contain;
}

/* Responsive ad content - Rectangle specific */
.kn-ad-container.kn-ad-responsive.kn-ad-rectangle .kn-ad-slot > *,
.kn-ad-container.kn-ad-responsive.kn-ad-rectangle .kn-ad-slot iframe,
.kn-ad-container.kn-ad-responsive.kn-ad-rectangle .kn-ad-slot img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    display: block;
    object-fit: contain;
}

/* Responsive ad content - Skyscraper specific */
.kn-ad-container.kn-ad-responsive.kn-ad-skyscraper .kn-ad-slot > *,
.kn-ad-container.kn-ad-responsive.kn-ad-skyscraper .kn-ad-slot iframe,
.kn-ad-container.kn-ad-responsive.kn-ad-skyscraper .kn-ad-slot img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    display: block;
    object-fit: contain;
}

/* Fixed-size ad content - fill exactly */
.kn-ad-container.kn-ad-fixed .kn-ad-slot iframe,
.kn-ad-container:not(.kn-ad-responsive) .kn-ad-slot iframe {
    width: 100% !important;
    height: 100% !important;
    border: none;
    display: block;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Ensure all ad content is visible */
.kn-ad-container .kn-ad-slot * {
    visibility: visible !important;
    opacity: 1 !important;
}

/* ============================================
   RESPONSIVE - Simple: container and image scale down (no crop)
   Like: width 100%, max-width, height auto. Image shows completely, gets smaller on small screens.
   ============================================ */

/* Responsive: container and slot shrink; content fills slot. Ads show; no scaling (avoids footer issue). */
@media screen and (max-width: 1024px) {
    .kn-ad-container {
        max-width: 100% !important;
        display: block !important;
    }
    .kn-ad-container + .kn-ad-container {
        margin-top: 20px !important;
    }
    
    /* When banner image URL is set: show image (full banner, no crop) */
    .kn-ad-container.kn-ad-has-fallback .kn-ad-responsive-fallback-img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }
    .kn-ad-container.kn-ad-has-fallback .kn-ad-slot {
        display: none !important;
    }
    
    /* Container: responsive size */
    .kn-ad-container.kn-ad-billboard,
    .kn-ad-container.kn-ad-fixed.kn-ad-billboard,
    .kn-ad-container.kn-ad-billboard:not(.kn-ad-responsive) {
        width: 100% !important;
        max-width: 970px !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        aspect-ratio: 970 / 250 !important;
    }
    .kn-ad-container.kn-ad-rectangle,
    .kn-ad-container.kn-ad-fixed.kn-ad-rectangle,
    .kn-ad-container.kn-ad-rectangle:not(.kn-ad-responsive) {
        width: 100% !important;
        max-width: 300px !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: 300 / 250 !important;
    }
    .kn-ad-container.kn-ad-skyscraper,
    .kn-ad-container.kn-ad-fixed.kn-ad-skyscraper,
    .kn-ad-container.kn-ad-skyscraper:not(.kn-ad-responsive) {
        width: 100% !important;
        max-width: 450px !important;
        min-width: 0 !important;
        height: auto !important;
        aspect-ratio: 300 / 600 !important;
    }
    
    /* Slot fills container */
    .kn-ad-container .kn-ad-slot,
    .kn-ad-container.kn-ad-billboard .kn-ad-slot,
    .kn-ad-container.kn-ad-fixed.kn-ad-billboard .kn-ad-slot,
    .kn-ad-container.kn-ad-billboard:not(.kn-ad-responsive) .kn-ad-slot {
        width: 100% !important;
        height: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        position: relative !important;
    }
    
    /* Image: full size, no crop */
    .kn-ad-container .kn-ad-slot img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
        object-fit: contain !important;
    }
    
    /* Iframe and content: fill slot (no position absolute, no scale – avoids going under footer) */
    .kn-ad-container .kn-ad-slot iframe,
    .kn-ad-container .kn-ad-slot > * {
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        display: block !important;
        border: none !important;
    }
    
    .kn-ad-container.kn-ad-billboard .kn-ad-slot:empty::before,
    .kn-ad-container.kn-ad-billboard .kn-ad-slot.kn-ad-empty::before {
        min-width: 0 !important;
        min-height: 0 !important;
    }
}

@media screen and (max-width: 768px) {
    .kn-ad-container {
        max-width: 100% !important;
    }
    .kn-ad-container + .kn-ad-container {
        margin-top: 20px !important;
    }
    
    .kn-ad-container .kn-ad-slot,
    .kn-ad-container.kn-ad-billboard .kn-ad-slot,
    .kn-ad-container.kn-ad-fixed.kn-ad-billboard .kn-ad-slot,
    .kn-ad-container.kn-ad-billboard:not(.kn-ad-responsive) .kn-ad-slot {
        min-width: 0 !important;
        min-height: 0 !important;
    }
    
    .kn-ad-container.kn-ad-billboard,
    .kn-ad-container.kn-ad-fixed.kn-ad-billboard,
    .kn-ad-container.kn-ad-billboard:not(.kn-ad-responsive) {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        aspect-ratio: 970 / 250 !important;
    }
    .kn-ad-container.kn-ad-rectangle,
    .kn-ad-container.kn-ad-fixed.kn-ad-rectangle,
    .kn-ad-container.kn-ad-rectangle:not(.kn-ad-responsive) {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        aspect-ratio: 300 / 250 !important;
    }
    .kn-ad-container.kn-ad-skyscraper,
    .kn-ad-container.kn-ad-fixed.kn-ad-skyscraper,
    .kn-ad-container.kn-ad-skyscraper:not(.kn-ad-responsive) {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        aspect-ratio: 300 / 600 !important;
    }
    
    .kn-ad-container .kn-ad-slot img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }
    
    .kn-ad-container.kn-ad-billboard .kn-ad-slot:empty::before,
    .kn-ad-container.kn-ad-billboard .kn-ad-slot.kn-ad-empty::before {
        min-width: 0 !important;
        min-height: 0 !important;
    }
}

/* ============================================
   ADDITIONAL ISOLATION RULES
   ============================================ */

/* Prevent any global styles from affecting ad containers */
.kn-ad-container * {
    box-sizing: border-box;
}

/* Ensure each ad container is isolated but can display multiple ads */
.kn-ad-container {
    /* Removed isolation: isolate as it might prevent multiple ads from displaying */
    /* Each container should be independent but not isolated from the page flow */
}

/* Prevent flexbox/grid from interfering */
.kn-ad-container.kn-ad-fixed.kn-ad-skyscraper,
.kn-ad-container.kn-ad-fixed.kn-ad-rectangle,
.kn-ad-container.kn-ad-fixed.kn-ad-billboard {
    flex: none !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
}

/* Ensure multiple ads can display together without interference */
.kn-ad-container + .kn-ad-container {
    margin-top: 20px; /* Add spacing between multiple ads - prevents overlap */
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Ensure each ad container maintains its own space (desktop: clear so they don't overlap) */
.kn-ad-container {
    float: none !important;
    clear: both !important;
}

/* Prevent responsive ads from being affected by parent containers */
.kn-ad-container.kn-ad-responsive {
    /* Removed isolation: isolate to allow multiple ads to display together */
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* ============================================
   LOADING STATE / EMPTY AD PLACEHOLDER
   ============================================ */

/* Loading state / Empty ad placeholder */
.kn-ad-slot:empty::before {
    content: 'Werbung';
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 50px;
    background: #f0f0f0;
    border: 1px dashed #ccc;
    color: #999;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    box-sizing: border-box;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
    z-index: 1;
}

/* Billboard empty placeholder - ensure full size */
.kn-ad-container.kn-ad-billboard .kn-ad-slot:empty::before,
.kn-ad-container.kn-ad-fixed.kn-ad-billboard .kn-ad-slot:empty::before {
    width: 100% !important;
    height: 100% !important;
    min-width: 970px !important;
    min-height: 250px !important;
}

/* Show placeholder for empty ad slots */
.kn-ad-slot.kn-ad-empty::before {
    content: 'Werbung';
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 50px;
    background: #f0f0f0;
    border: 1px dashed #ccc;
    color: #999;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    box-sizing: border-box;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
    z-index: 1;
}

/* Billboard empty placeholder - ensure full size */
.kn-ad-container.kn-ad-billboard .kn-ad-slot.kn-ad-empty::before,
.kn-ad-container.kn-ad-fixed.kn-ad-billboard .kn-ad-slot.kn-ad-empty::before {
    width: 100% !important;
    height: 100% !important;
    min-width: 970px !important;
    min-height: 250px !important;
}

/* When "Show Werbung placeholder" is OFF in settings: hide placeholder and collapse empty slots */
body.kn-ads-hide-empty-placeholder .kn-ad-slot:empty::before,
body.kn-ads-hide-empty-placeholder .kn-ad-slot.kn-ad-empty::before {
    display: none !important;
    content: none !important;
    visibility: hidden !important;
}
body.kn-ads-hide-empty-placeholder .kn-ad-slot:empty,
body.kn-ads-hide-empty-placeholder .kn-ad-slot.kn-ad-empty {
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    border: none !important;
    background: transparent !important;
}

/* When "Don't use space when no ad" is ON: hide entire block so it uses zero space */
body.kn-ads-collapse-empty-no-space .kn-ad-wrapper.kn-ad-wrapper-empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    border: none !important;
    visibility: hidden !important;
    line-height: 0 !important;
}
/* Collapse theme/editor wrapper (e.g. paragraph) when it only contains an empty ad block */
@supports selector(:has(*)) {
    body.kn-ads-collapse-empty-no-space p:has(> .kn-ad-wrapper.kn-ad-wrapper-empty:only-child),
    body.kn-ads-collapse-empty-no-space div:has(> .kn-ad-wrapper.kn-ad-wrapper-empty:only-child) {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        display: none !important;
    }
}
body.kn-ads-collapse-empty-no-space .kn-ad-container.kn-ad-container-empty,
body.kn-ads-collapse-empty-no-space .kn-ad-container.kn-ad-container-empty.kn-ad-fixed,
body.kn-ads-collapse-empty-no-space .kn-ad-container.kn-ad-container-empty.kn-ad-billboard,
body.kn-ads-collapse-empty-no-space .kn-ad-container.kn-ad-container-empty.kn-ad-rectangle,
body.kn-ads-collapse-empty-no-space .kn-ad-container.kn-ad-container-empty.kn-ad-skyscraper,
body.kn-ads-collapse-empty-no-space .kn-ad-container.kn-ad-container-empty.kn-ad-responsive {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    border: none !important;
    visibility: hidden !important;
}

/* ============================================
   ALIGNMENT OPTIONS - Type-specific
   ============================================ */

/* Align options - ensure they don't affect sizing */
.kn-ad-container.kn-ad-align-left {
    margin-left: 0;
    margin-right: auto;
}

.kn-ad-container.kn-ad-align-right {
    margin-left: auto;
    margin-right: 0;
}

.kn-ad-container.kn-ad-align-center {
    margin-left: auto;
    margin-right: auto;
}

/* Alignment should not interfere with sizing (desktop) */
.kn-ad-container.kn-ad-align-left,
.kn-ad-container.kn-ad-align-right,
.kn-ad-container.kn-ad-align-center {
    width: inherit !important;
    height: inherit !important;
    max-width: inherit !important;
    max-height: inherit !important;
}

/* Tablet/mobile: aligned ads must still fit viewport (override above) */
@media screen and (max-width: 1024px) {
    .kn-ad-container.kn-ad-align-left,
    .kn-ad-container.kn-ad-align-right,
    .kn-ad-container.kn-ad-align-center {
        max-width: 100% !important;
    }
}
@media screen and (max-width: 768px) {
    .kn-ad-container.kn-ad-align-left,
    .kn-ad-container.kn-ad-align-right,
    .kn-ad-container.kn-ad-align-center {
        max-width: 100% !important;
    }
}