/**
 * GSAVE SITE - Print Styles
 * Optimized styles for printing
 *
 * Features:
 * - Hide non-printable elements (header, footer, sidebar, nav, modals, tooltips)
 * - Reset colors to black/white for ink saving
 * - Show URLs after links
 * - Smart page breaks (avoid orphans/widows)
 * - Hide video/audio elements
 * - Visible table borders
 * - Reset background-image
 */

@media print {
  /* ============================================
   * HIDE NON-PRINTABLE ELEMENTS
   * ============================================ */

  .site-header,
  .site-footer,
  .gsave-header,
  .gsave-footer,
  header,
  footer,
  .sidebar,
  .widget-area,
  nav,
  .main-navigation,
  .main-nav,
  .mobile-menu,
  .hamburger,
  .menu-toggle,
  .nav-toggle,
  button:not(.print-visible),
  .btn:not(.print-visible),
  .btn-cta-primary:not(.print-visible),
  .btn-cta-secondary:not(.print-visible),
  .modal,
  .modal-backdrop,
  .tooltip,
  .popover,
  .dropdown-menu,
  .toast,
  .notification,
  .cookie-banner,
  .cookie-notice,
  .chat-widget,
  .chat-bubble,
  .scroll-to-top,
  .back-to-top,
  .floating-cta,
  .sticky-cta,
  .header-cta,
  .hero-cta-group,
  .mia-native-cta,
  .gway-cta,
  .footer-cta,
  .no-print,
  [data-no-print],
  video,
  audio,
  iframe[src*="youtube"],
  iframe[src*="vimeo"],
  iframe[src*="maps.google"],
  .video-container,
  .video-wrapper,
  .audio-player,
  .social-share,
  .share-buttons,
  .related-posts,
  .comments-area,
  #comments,
  .wp-block-embed,
  .pricing-toggle,
  .billing-toggle,
  .lang-switcher,
  .scenario-toggle,
  .calculator-inputs {
    display: none !important;
  }

  /* ============================================
   * RESET COLORS TO BLACK/WHITE
   * ============================================ */

  body {
    color: #000 !important;
    background: #fff !important;
    font-size: 12pt !important;
    line-height: 1.5 !important;
  }

  /* ============================================
   * TEXT COLORS
   * ============================================ */

  p,
  span,
  div,
  h1, h2, h3, h4, h5, h6,
  td, th,
  li,
  label,
  strong,
  em,
  blockquote,
  figcaption,
  .hero__title,
  .hero__subtitle,
  .section-title,
  .section-badge,
  .section-subtitle,
  .card__title,
  .card__text,
  .hero-subheadline,
  .hero-eyebrow,
  .step-text,
  .benefit-item,
  .trust-item strong,
  .trust-item p,
  .module-header h3,
  .module-card p,
  .mia-card h4,
  .mia-card p,
  .gway-card h4,
  .problem-card-v3 h3,
  .problem-card-v3 p {
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
    background: none !important;
  }

  a {
    color: #000 !important;
    text-decoration: underline !important;
  }

  /* ============================================
   * SHOW LINK URLS
   * ============================================ */

  /* Show URLs for external links */
  a[href^="http"]::after,
  a[href^="https"]::after {
    content: " (" attr(href) ")";
    font-size: 0.8em;
    color: #666;
    font-weight: normal;
  }

  /* Don't show URL for internal/anchor links */
  a[href^="#"]::after,
  a[href^="javascript"]::after,
  a[href^="mailto"]::after,
  a[href^="tel"]::after,
  a.no-print-url::after,
  .logo a::after,
  nav a::after,
  .site-header a::after,
  .site-footer a::after {
    content: "" !important;
  }

  /* ============================================
   * RESET BACKGROUNDS & SHADOWS
   * ============================================ */

  *,
  *::before,
  *::after {
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  .card,
  .pricing-card,
  .feature-card,
  .bento-item,
  .testimonial-card,
  .module-card,
  .mia-card,
  .gway-card,
  .problem-card-v3,
  .trust-item,
  .benefit-item,
  .flow-step-item,
  article,
  section {
    background: #fff !important;
    border: 1px solid #ddd !important;
  }

  /* Preserve essential images */
  img,
  .logo,
  .logo-img,
  .brand-logo,
  figure img {
    background-image: unset !important;
  }

  /* ============================================
   * LAYOUT ADJUSTMENTS
   * ============================================ */

  .container,
  .container-wide,
  .content-wrapper,
  .page-content,
  main,
  article {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 auto !important;
  }

  /* Remove grid/flex for simpler print layout */
  .grid,
  .bento-grid,
  .modules-grid,
  .mia-grid,
  .pricing-grid,
  .trust-grid,
  .problem-grid-2col {
    display: block !important;
  }

  .grid > *,
  .bento-grid > *,
  .modules-grid > *,
  .mia-grid > *,
  .pricing-grid > *,
  .trust-grid > *,
  .problem-grid-2col > * {
    width: 100% !important;
    margin-bottom: 1rem !important;
  }

  /* ============================================
   * PAGE BREAKS (SMART)
   * ============================================ */

  /* Utility classes */
  .page-break-before {
    page-break-before: always;
    break-before: page;
  }

  .page-break-after {
    page-break-after: always;
    break-after: page;
  }

  .no-page-break,
  .avoid-break {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Keep headings with content */
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    break-after: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Keep images with captions */
  figure, img {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Avoid orphans and widows */
  p, li, blockquote {
    orphans: 3;
    widows: 3;
  }

  /* Keep lists together when possible */
  ul, ol {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Keep cards/sections together */
  .card,
  .pricing-card,
  .feature-card,
  .testimonial-card,
  .module-card,
  .mia-card,
  .gway-card,
  .problem-card-v3,
  .trust-item,
  article {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Avoid breaking inside code blocks */
  pre, code {
    page-break-inside: avoid;
    break-inside: avoid;
    white-space: pre-wrap;
    word-wrap: break-word;
    background: #f5f5f5 !important;
    border: 1px solid #ddd !important;
    color: #000 !important;
  }

  /* ============================================
   * TABLES
   * ============================================ */

  table {
    page-break-inside: auto;
    break-inside: auto;
    border-collapse: collapse;
    width: 100%;
    border: 1px solid #000 !important;
  }

  tr {
    page-break-inside: avoid;
    break-inside: avoid;
    page-break-after: auto;
  }

  thead {
    display: table-header-group;
  }

  tfoot {
    display: table-footer-group;
  }

  th, td {
    border: 1px solid #000 !important;
    padding: 0.5rem !important;
    background: #fff !important;
    color: #000 !important;
  }

  th {
    background: #f0f0f0 !important;
    font-weight: bold;
    border-bottom: 2px solid #000 !important;
  }

  /* Zebra striping for better readability */
  tr:nth-child(even) td {
    background: #f9f9f9 !important;
  }

  /* ============================================
   * PRICING TABLES
   * ============================================ */

  .pricing-table,
  .pricing-grid {
    display: block !important;
  }

  .pricing-card {
    display: block !important;
    width: 100% !important;
    margin-bottom: 2rem !important;
    border: 2px solid #000 !important;
    padding: 1rem !important;
  }

  .pricing-card.featured,
  .pricing-card.popular {
    border-width: 3px !important;
  }

  .price,
  .pricing-price {
    font-size: 1.5rem !important;
    font-weight: bold !important;
    color: #000 !important;
  }

  /* ============================================
   * IMAGES
   * ============================================ */

  img {
    max-width: 100% !important;
    height: auto !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* ============================================
   * FORMS
   * ============================================ */

  input, select, textarea {
    border: 1px solid #000 !important;
    background: #fff !important;
    color: #000 !important;
  }

  /* ============================================
   * BADGES & TAGS
   * ============================================ */

  .badge,
  .tag,
  .chip,
  .label,
  .status,
  .module-chip {
    border: 1px solid #666 !important;
    background: transparent !important;
    color: #000 !important;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  /* ============================================
   * FAQ SECTIONS
   * ============================================ */

  .faq-item,
  .accordion-item {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .faq-answer,
  .accordion-content {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* ============================================
   * HERO SECTIONS
   * ============================================ */

  .hero,
  .hero-section,
  .hero-v3 {
    min-height: auto !important;
    height: auto !important;
    padding: 2rem 0 !important;
  }

  /* ============================================
   * UTILITY CLASSES FOR PRINT
   * ============================================ */

  .print-only {
    display: block !important;
  }

  .screen-only {
    display: none !important;
  }

  .print-full-width {
    width: 100% !important;
    max-width: 100% !important;
  }

  .print-compact {
    padding: 0.25rem !important;
    margin: 0.25rem !important;
  }

  .print-center {
    text-align: center !important;
  }

  /* ============================================
   * PAGE SETUP
   * ============================================ */

  @page {
    margin: 1.5cm;
    size: A4;
  }

  @page :first {
    margin-top: 2cm;
  }

  @page :left {
    margin-left: 2cm;
    margin-right: 1.5cm;
  }

  @page :right {
    margin-left: 1.5cm;
    margin-right: 2cm;
  }
}

/* ============================================
 * SCREEN-ONLY STYLES
 * ============================================ */

.print-only {
  display: none;
}

@media screen {
  .screen-only {
    display: block;
  }
}