/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/


/* single post spacing general salient   */
.nectar_hook_before_content_global_section:first-of-type .vc_row:first-of-type > .span_12 {
    padding-top: 0px;
}

.featured-media-under-header__featured-media[data-align="center"] .post-featured-img img{
    border-radius: 20px;
}
.nectar_hook_global_section_footer .row-bg{
    background-repeat: no-repeat;
}

@media only screen and (max-width: 400px) {
 .macros-row { grid-template-columns:repeat(1, 1fr); }
.swap-row {
        grid-template-columns: 1fr auto 1fr;  /* left | icon | right */
        gap: 10px;
        text-align: left;
    }
.swap-mid {
        justify-content: flex-start;
    }
    .row .col img.macro-ic {
    margin-bottom: 0px;
    max-width: 20px !important;
}
}



@media only screen and (max-width: 690px) {
 .macros-row { grid-template-columns:repeat(2, 1fr); }
.swap-row {
        grid-template-columns: 1fr auto 1fr;  /* left | icon | right */
        gap: 10px;
        text-align: left;
    }
.swap-mid {
        justify-content: flex-start;
    }
}

@media only screen and (min-width: 691px) {
.macros-row { grid-template-columns: repeat(4, 1fr); }
}

@media only screen and (min-width: 1000px) {
 .macros-row { grid-template-columns: repeat(4, 1fr); }
}
@media only screen and (max-width: 999px) {}

/* 4 equal columns; responsive wrap */




.macros-row {
    display: grid;
gap: 14px;
    align-items: stretch;
}

.macro-col {
    display: flex;
    align-items: center;
    justify-content: left;
    gap: 8px;
    padding: 12px;
    border-radius: 10px;
    /* background: #1a2026;
    border: 1px solid rgba(255,255,255,0.08); */
    color: #e9eff5;
    text-align: center;
}

.macro-ic { width: 18px; height: 18px; object-fit: contain;  margin-bottom:0px;}
.row .col img.macro-ic { margin-bottom:0px;max-width: 48px !important; }
.macro-val { font-weight: 700; color: #1a2026; }
.macro-label { margin-left: 4px; color: #1a2026; }


/* swaps */
.recipe-swaps.card {
    /* background: #151a1f; */
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 14px;
    /* padding: 18px 20px; */
}
.swaps-hd {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 600;
    color: #1a2026;
    margin: 0 0 12px;
}
.swaps-grid {
    display: grid;
    gap: 12px;
}
.swap-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;  /* left | icon | right */
    gap: 16px;
    align-items: center;
    /* background: #161b21; */
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 10px;
    /* padding: 14px 16px; */
}
.swap-from,
.swap-to {
    display: flex;
    align-items: center;
    min-height: 44px;
}
.swap-mid {
    display: flex;
    align-items: center;
    justify-content: center;
}
img.swap-ic {
    width: 28px;
    height: 28px;
    padding: 6px;
    border-radius: 10px;
    /* background: #1a2026; */
    border: 1px solid rgba(255,255,255,0.08);
    object-fit: contain;
    margin-bottom: 0px !important;
}
.swap-text {
    color: #1a2026;
    line-height: 1.4;
    font-size: 16px;
}
.swap-to .swap-text {
    color: #1a2026;
}


/* times */

.time-row {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    align-items: center;
    justify-content: center;
}
.time-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #1a2026;
    border: 1px solid rgba(255,255,255,0.08);
    color: #e9eff5;
}
.time-ic { width: 18px; height: 18px; object-fit: contain; }
.time-val { font-weight: 700; }
.time-label { margin-left: 4px; color: #b9c5cf; }



/* Button styling in header */
.recipe-print-bar {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 12px;
    position: fixed;
    right: 34px;
    top: 34px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    z-index: 1000;
}

.recipe-print-btn {
    appearance: none;
    background: #1a2026;
    color: #e9eff5;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 13px;
    cursor: pointer;
    display:none; /*for now*/

}
.recipe-print-btn:hover { background: #222a31; }

/* Print rules */
@media print {

    /* Remove all default chrome */
    header, footer,
    #header-outer, #header-secondary-outer,
    #footer-outer, #sidebar,
    .nectar-social, .nectar-social-fixed,
    .sharing-default-minimal, .default-minimal-bottom-meta,
    .nectar-recent-posts-single, .post-meta-bar, .post-nav,
    .comment-wrap, .comments-section, .related-posts,
    .nectar-page-subscribe, .wpb_row:not(.recipe-print-allow),
    .nectar_cascading_images, .nectar-fancy-box,
    .nectar-video-lightbox, .nectar_icon_wrap,
   .nectar-split-heading {
        display: none !important;
    }

    /* Hide media/images to print text only */
    .featured-media, .post-featured-img, .post-featured-video,
    .recipe-hero, .recipe-hero-media,
    img, video, iframe {
        display: none !important;
    }

    /* Hide the print button itself */
    .recipe-print-bar, .recipe-print-btn {
        display: none !important;
    }

    /* Make main content full width for print */
    .container-wrap, .container, .main-content, .post-area, .row, .col, .span_12, .span_9, .span_7, .span_5 {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        display: block !important;
    }

    /* Ensure recipe text blocks print */
    .recipe-header-metrics,
    .recipe-description,
    .ingredients, .instructions,
    .recipe-bullets, .recipe-steps,
    .recipe-swaps, .swaps-grid, .swap-row,
    .time-row, .time-chip,
    .macros-row, .macro-col,
    .post-content {
        display: block !important;
        visibility: visible !important;
    }

    /* Typography for print */
    body {
        background: #fff !important;
        color: #000 !important;
    }
    h1, h2, h3, h4, h5, h6 {
        color: #000 !important;
        page-break-after: avoid;
    }

    /* Optional: tighten spacing for print */
    .recipe-header-metrics { margin: 0 0 12px 0 !important; }
    .ingredients.card, .instructions.card, .recipe-swaps.card {
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        box-shadow: none !important;
    }

    /* Page breaks (optional) */
    .instructions { page-break-inside: avoid; }
    .recipe-swaps { page-break-inside: avoid; }
}