/*
Theme Name: InkedBooking Child
Template: neve
Author: InkedBooking Team  
Version: 1.1
*/

/* =================================================================== */
/* COMPLETELY HIDE FEATURED IMAGE FROM ink_artist POST TYPE */
/* =================================================================== */

/* Hide any first img immediately after article opening tag */
body.single-ink_artist article > img:first-child,
body.single-ink_artist .nv-content-wrap > article > img:first-child,
body.single-ink_artist article.ink_artist > img:first-child {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Hide wp-post-image class (standard WordPress featured image class) */
body.single-ink_artist .wp-post-image,
body.single-ink_artist article .wp-post-image {
    display: none !important;
    visibility: hidden !important;
}

/* Hide Neve-specific featured image wrappers */
body.single-ink_artist .nv-post-thumbnail-wrap,
body.single-ink_artist .nv-post-thumbnail,
body.single-ink_artist .nv-featured-image,
body.single-ink_artist .post-thumbnail,
body.single-ink_artist .entry-thumbnail {
    display: none !important;
    visibility: hidden !important;
}

/* Hide any figure or div with featured/thumbnail in class */
body.single-ink_artist article [class*="featured"],
body.single-ink_artist article [class*="thumbnail"],
body.single-ink_artist article [class*="post-image"] {
    display: none !important;
    visibility: hidden !important;
}

/* On ink_artist pages, remove Neve's post-specific paddings that constrain width */
body.single-ink_artist .nv-single-post-wrap,
body.single-ink_artist .nv-content-wrap article,
body.single-ink_artist article.post-container {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.single-ink_artist .nv-content-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Artist profile main container - full width */
.ap,
main.ap,
#primary.ap {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Artist profile header sections - full width */
.ap__head-lite,
.ap__head-lite__inner {
    max-width: 100% !important;
    width: 100% !important;
}

/* Artist profile content sections - full width on desktop */
@media (min-width: 768px) {
    .ap__about,
    .ap__work,
    .ap__port,
    .ap__inspiration {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
    
    /* Instagram embeds - full width on desktop */
    .ap__work iframe,
    .ap__inspiration iframe {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Ensure embedded Instagram posts are full width */
.instagram-media,
blockquote.instagram-media {
    max-width: 100% !important;
    width: 100% !important;
}

/* =================================================================== */
/* RESPONSIVE INSTAGRAM GRID */
/* =================================================================== */

/* Instagram Grid Container */
.insta-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding: 0 20px;
    box-sizing: border-box;
}

/* Remove constraining max-widths from parent containers */
.ap__embed.ap__embed--compact,
.ap__panel.ap__recent-work,
.ap__body,
.ap__grid {
    max-width: none !important;
}

/* Make Instagram embeds responsive within the grid */
.insta-grid .instagram-media,
.insta-grid blockquote.instagram-media {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Tablet: 2 columns */
@media (max-width: 1024px) {
    .insta-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
}

/* Mobile: 1 column */
@media (max-width: 768px) {
    .insta-grid {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 0 16px;
    }
}