/**
 * Print Stylesheet for Ed's BBQ Recipe Pages
 * Optimized for clean, readable recipe printouts
 */

/* ============================================
   Reset & Base Styles
   ============================================ */

* {
    background: white !important;
    color: black !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

body {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 12pt;
    line-height: 1.6;
    margin: 0;
    padding: 20px;
}

/* ============================================
   Hide Elements Not Needed for Print
   ============================================ */

/* Navigation and header */
.site-header,
.nav-menu,
.nav-toggle,
.header-search,
.main-nav {
    display: none !important;
}

/* Footer and newsletter */
.footer,
.newsletter-section {
    display: none !important;
}

/* Video embed and related video content */
.video-embed,
.recipe-video-section,
.video-actions,
.youtube-link {
    display: none !important;
}

/* Related recipes sections */
.related-recipes-section,
.related-recipes-card,
.related-recipes-list {
    display: none !important;
}

/* Temperature guide callout */
.temp-guide-callout {
    display: none !important;
}

/* Share buttons */
.share-card,
.share-buttons {
    display: none !important;
}

/* Print button itself */
.print-recipe-btn {
    display: none !important;
}

/* Back to recipes link */
a[href="/recipes"].btn {
    display: none !important;
}

/* Breadcrumb navigation */
.recipe-breadcrumb {
    display: none !important;
}

/* ============================================
   Page Layout
   ============================================ */

.container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.recipe-layout {
    display: block !important;
}

.recipe-content-main {
    width: 100% !important;
    max-width: 100% !important;
}

.recipe-sidebar {
    display: block !important;
    width: 100% !important;
    margin-top: 0 !important;
    float: none !important;
}

/* ============================================
   Recipe Hero / Header
   ============================================ */

.recipe-hero {
    background: white !important;
    background-image: none !important;
    padding: 0 !important;
    margin-bottom: 20pt;
    border-bottom: 2pt solid #333;
    padding-bottom: 15pt;
}

.recipe-category-badge {
    display: inline-block;
    font-size: 10pt;
    padding: 3pt 8pt;
    border: 1pt solid #666;
    margin-bottom: 8pt;
}

.recipe-hero h1 {
    font-family: 'Arial Black', Helvetica, sans-serif;
    font-size: 24pt;
    margin: 0 0 10pt 0;
    text-transform: uppercase;
    letter-spacing: 1pt;
}

.recipe-hero-desc {
    font-size: 11pt;
    font-style: italic;
    margin-bottom: 15pt;
    max-width: none !important;
}

/* ============================================
   Recipe Stats Bar
   ============================================ */

.recipe-stats-bar {
    display: flex !important;
    flex-wrap: wrap;
    gap: 15pt;
    padding: 10pt 0;
    border-top: 1pt solid #ccc;
    margin-top: 10pt;
}

.recipe-stat {
    display: flex;
    flex-direction: column;
}

.recipe-stat-label {
    font-size: 8pt;
    text-transform: uppercase;
    letter-spacing: 0.5pt;
    color: #666 !important;
}

.recipe-stat-value {
    font-size: 11pt;
    font-weight: bold;
}

/* ============================================
   Quick Info Card (Sidebar)
   ============================================ */

.recipe-info-card {
    border: 1pt solid #333;
    padding: 12pt;
    margin-bottom: 20pt;
    page-break-inside: avoid;
}

.recipe-info-card h3 {
    font-family: 'Arial Black', Helvetica, sans-serif;
    font-size: 14pt;
    text-transform: uppercase;
    margin: 0 0 10pt 0;
    padding-bottom: 8pt;
    border-bottom: 1pt solid #ccc;
}

.info-row {
    display: flex;
    justify-content: space-between;
    padding: 5pt 0;
    border-bottom: 1pt dotted #ddd;
}

.info-row:last-child {
    border-bottom: none;
}

.info-label {
    font-size: 10pt;
    color: #666 !important;
}

.info-value {
    font-size: 10pt;
    font-weight: bold;
}

.info-total {
    margin-top: 5pt;
    padding-top: 8pt;
    border-top: 1pt solid #333;
}

/* ============================================
   Recipe Sections
   ============================================ */

.recipe-section {
    margin-bottom: 20pt;
    page-break-inside: avoid;
}

.recipe-section h2 {
    font-family: 'Arial Black', Helvetica, sans-serif;
    font-size: 16pt;
    text-transform: uppercase;
    border-bottom: 2pt solid #333;
    padding-bottom: 5pt;
    margin-bottom: 12pt;
}

/* ============================================
   Ingredients
   ============================================ */

.ingredient-section-title {
    font-family: 'Arial Black', Helvetica, sans-serif;
    font-size: 12pt;
    margin: 12pt 0 8pt 0;
    text-transform: uppercase;
}

.ingredient-list {
    list-style: disc;
    margin-left: 20pt;
    padding: 0;
}

.ingredient-list li {
    font-size: 11pt;
    margin-bottom: 4pt;
    line-height: 1.4;
}

/* ============================================
   Method Steps
   ============================================ */

.method-list {
    list-style: decimal;
    margin-left: 20pt;
    padding: 0;
}

.method-list li {
    font-size: 11pt;
    margin-bottom: 10pt;
    line-height: 1.5;
    padding-left: 5pt;
}

/* ============================================
   Tips Section
   ============================================ */

.tips-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tips-list li {
    font-size: 11pt;
    margin-bottom: 8pt;
    padding-left: 15pt;
    position: relative;
    line-height: 1.4;
}

.tips-list li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    font-weight: bold;
}

/* ============================================
   Print Header & Footer
   ============================================ */

/* Add site URL at top of print */
.recipe-detail::before {
    content: "Ed's BBQ - edsbbq.com";
    display: block;
    font-family: 'Arial Black', Helvetica, sans-serif;
    font-size: 10pt;
    text-transform: uppercase;
    letter-spacing: 1pt;
    color: #666 !important;
    padding-bottom: 10pt;
    margin-bottom: 10pt;
    border-bottom: 1pt solid #ddd;
}

/* Add recipe URL at bottom */
@page {
    margin: 0.75in;
}

/* ============================================
   Links
   ============================================ */

a {
    text-decoration: none;
}

/* Show URL for external links if desired */
a[href^="http"]:not([href*="edsbbq.com"])::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #666 !important;
}

/* ============================================
   Page Breaks
   ============================================ */

h1, h2, h3 {
    page-break-after: avoid;
}

.recipe-section {
    page-break-inside: avoid;
}

.recipe-info-card {
    page-break-inside: avoid;
}

/* ============================================
   Utility Classes
   ============================================ */

.site-main {
    display: block !important;
}

/* Hide any remaining buttons */
.btn:not(.print-recipe-btn) {
    display: none !important;
}

/* Ensure proper rendering */
img {
    max-width: 100% !important;
    height: auto !important;
}

/* Hide hero background image container if it has one */
.recipe-hero[style*="background-image"] {
    background-image: none !important;
}