/**
 * 11-print.css
 * Print stylesheet for board-ready PDF generation
 * Optimized for professional document printing with proper page breaks
 *
 * @version 1.0.0
 * @author IFS SP Group Frontend Team
 */

@media print {

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

  /**
   * Page margins and size
   */
  @page {
    size: A4;
    margin: 2cm 1.5cm;
  }

  /**
   * Page headers and footers
   */
  @page {
    @top-center {
      content: 'SP Group | IFS Digital Transformation Business Case';
      font-size: 9pt;
      font-weight: 600;
      color: #4a5568;
      padding-bottom: 0.5cm;
      border-bottom: 1pt solid #cbd5e0;
    }

    @bottom-right {
      content: 'Page ' counter(page) ' of ' counter(pages);
      font-size: 9pt;
      color: #718096;
    }

    @bottom-left {
      content: 'Confidential';
      font-size: 9pt;
      color: #718096;
      font-style: italic;
    }
  }

  /**
   * First page (cover) customization
   */
  @page :first {
    margin-top: 0;

    @top-center {
      content: none;
    }
  }

  /* ============================================================================
     GLOBAL RESET
     ============================================================================ */

  * {
    background: transparent;
    color: #000;
    box-shadow: none;
    text-shadow: none;
  }

  /**
   * Force black text on white background
   */
  body {
    margin: 0;
    padding: 0;
    background: #ffffff;
    color: #000000;
    font-size: 11pt;
    line-height: 1.5;
  }

  /* ============================================================================
     HIDE UI ELEMENTS
     ============================================================================ */

  /**
   * Hide all interactive and navigation elements
   */
  .sidebar-nav,
  .page-header,
  .nav-toggle,
  .hamburger-menu,
  .mobile-menu-overlay,
  .reading-progress-container,
  .reading-progress-vertical,
  .breadcrumb,
  .page-footer,
  .nav-search,
  .nav-collapse-all,
  button,
  .btn,
  .action-button {
    display: none;
  }

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

  /**
   * Full-width content
   */
  .main-layout {
    display: block;
    grid-template-columns: 1fr;
    max-width: 100%;
    padding: 0;
    margin: 0;
  }

  .document-content {
    max-width: 100%;
    padding: 0;
    box-shadow: none;
    border-radius: 0;
    margin: 0;
  }

  .content-section {
    margin-bottom: 1.5cm;
  }

  /* ============================================================================
     PAGE BREAKS
     ============================================================================ */

  /**
   * Always break before major sections
   */
  .process-area-page,
  .value-driver-page,
  .scenario-section,
  .chapter,
  .major-section {
    page-break-before: always;
    page-break-inside: avoid;
  }

  /**
   * Avoid breaks inside these elements
   */
  .process-card,
  .value-driver-card,
  .feature-card,
  .stat-card,
  .opportunity-callout,
  .content-callout,
  .timeline-item,
  figure,
  table,
  .content-grid-2 > *,
  .content-grid-3 > * {
    page-break-inside: avoid;
  }

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

  /**
   * Prevent orphans and widows
   */
  p {
    orphans: 3;
    widows: 3;
  }

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

  /* ============================================================================
     TYPOGRAPHY
     ============================================================================ */

  /**
   * Optimized heading sizes for print
   */
  h1 {
    font-size: 20pt;
    font-weight: 700;
    margin: 0 0 0.5cm 0;
    color: #0077B6;
  }

  h2 {
    font-size: 16pt;
    font-weight: 700;
    margin: 0.75cm 0 0.4cm 0;
    color: #1a202c;
  }

  h3 {
    font-size: 14pt;
    font-weight: 600;
    margin: 0.6cm 0 0.3cm 0;
    color: #2d3748;
  }

  h4 {
    font-size: 12pt;
    font-weight: 600;
    margin: 0.5cm 0 0.3cm 0;
    color: #2d3748;
  }

  h5, h6 {
    font-size: 11pt;
    font-weight: 600;
    margin: 0.4cm 0 0.2cm 0;
    color: #4a5568;
  }

  /**
   * Paragraph spacing
   */
  p {
    margin: 0 0 0.4cm 0;
    line-height: 1.5;
  }

  /**
   * List styling
   */
  ul, ol {
    margin: 0.4cm 0;
    padding-left: 1cm;
  }

  li {
    margin-bottom: 0.2cm;
  }

  /**
   * Blockquotes
   */
  blockquote {
    margin: 0.5cm 0.5cm 0.5cm 1cm;
    padding: 0.3cm 0.5cm;
    border-left: 3pt solid #7B2CBF;
    background: #f7fafc;
    font-style: italic;
  }

  /**
   * Code blocks (print as plain text with border)
   */
  pre, code {
    font-family: 'Courier New', monospace;
    font-size: 9pt;
    white-space: pre-wrap;
    word-wrap: break-word;
  }

  pre {
    padding: 0.3cm;
    border: 1pt solid #cbd5e0;
    background: #f7fafc;
    margin: 0.4cm 0;
  }

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

  /**
   * Table optimization for print
   */
  table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.5cm 0;
    font-size: 9pt;
  }

  /**
   * Prevent table breaks when possible
   */
  table {
    page-break-inside: auto;
  }

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

  /**
   * Table headers
   */
  thead {
    display: table-header-group;
    background: #f0f4f8;
  }

  thead th {
    padding: 0.3cm 0.2cm;
    text-align: left;
    font-weight: 700;
    color: #1a202c;
    border-bottom: 2pt solid #000;
    background: #f0f4f8;
  }

  /**
   * Table body
   */
  tbody td {
    padding: 0.25cm 0.2cm;
    border-bottom: 0.5pt solid #cbd5e0;
    color: #000;
  }

  tbody tr:nth-child(even) {
    background: #fafbfc;
  }

  /**
   * Table footer
   */
  tfoot {
    display: table-footer-group;
    font-weight: 700;
    border-top: 2pt solid #000;
  }

  tfoot td {
    padding: 0.3cm 0.2cm;
  }

  /* ============================================================================
     COLOR PRESERVATION FOR CRITICAL ELEMENTS
     ============================================================================ */

  /**
   * Preserve colors for financial data
   */
  .financial-table .positive {
    color: #065f46;
    font-weight: 700;
  }

  .financial-table .negative {
    color: #991b1b;
    font-weight: 700;
  }

  .financial-table .total-row {
    background: #f0f4f8;
    border-top: 2pt solid #000;
  }

  /**
   * Preserve callout colors with borders
   */
  .opportunity-callout {
    border: 2pt solid #d62828;
    background: #ffffff;
    padding: 0.4cm;
    margin: 0.5cm 0;
  }

  .opportunity-callout-value {
    color: #d62828;
    font-weight: 800;
  }

  .content-callout {
    border: 1.5pt solid #000;
    padding: 0.3cm;
    margin: 0.4cm 0;
    background: #ffffff;
  }

  .content-callout.info {
    border-color: #0077B6;
  }

  .content-callout.warning {
    border-color: #f59e0b;
  }

  .content-callout.success {
    border-color: #06a77d;
  }

  .content-callout.error {
    border-color: #d62828;
  }

  .content-callout.purple {
    border-color: #7B2CBF;
  }

  /* ============================================================================
     CARDS AND COMPONENTS
     ============================================================================ */

  /**
   * Process area cards
   */
  .process-area-page {
    border-left: 4pt solid #7B2CBF;
    padding: 0.5cm;
    margin-bottom: 0.5cm;
    background: #ffffff;
  }

  .process-card,
  .value-driver-card,
  .feature-card {
    border: 1pt solid #cbd5e0;
    padding: 0.4cm;
    margin-bottom: 0.4cm;
    background: #ffffff;
  }

  /**
   * Stat cards
   */
  .stat-card {
    border: 1pt solid #cbd5e0;
    padding: 0.3cm;
    text-align: center;
  }

  .stat-card-value {
    font-size: 18pt;
    font-weight: 700;
    color: #0077B6;
  }

  /**
   * Timeline
   */
  .timeline {
    padding-left: 1cm;
    position: relative;
  }

  .timeline::before {
    content: '';
    position: absolute;
    left: 0.2cm;
    top: 0;
    bottom: 0;
    width: 2pt;
    background: #cbd5e0;
  }

  .timeline-marker {
    position: absolute;
    left: -0.4cm;
    width: 0.4cm;
    height: 0.4cm;
    border: 2pt solid #7B2CBF;
    background: #ffffff;
  }

  .timeline-content {
    border: 1pt solid #cbd5e0;
    padding: 0.3cm;
    margin-bottom: 0.4cm;
  }

  /* ============================================================================
     GRID LAYOUTS
     ============================================================================ */

  /**
   * Multi-column grids (simplified for print)
   */
  .content-grid-2,
  .content-grid-3,
  .content-grid-4,
  .feature-comparison {
    display: block;
  }

  .content-grid-2 > *,
  .content-grid-3 > *,
  .content-grid-4 > *,
  .feature-comparison > * {
    margin-bottom: 0.5cm;
  }

  /* ============================================================================
     IMAGES AND FIGURES
     ============================================================================ */

  /**
   * Image optimization
   */
  img {
    max-width: 100%;
    height: auto;
    page-break-inside: avoid;
  }

  /**
   * Figures with captions
   */
  figure {
    margin: 0.5cm 0;
    page-break-inside: avoid;
  }

  figcaption {
    font-size: 9pt;
    font-style: italic;
    color: #4a5568;
    margin-top: 0.2cm;
    text-align: center;
  }

  /* ============================================================================
     BADGES AND LABELS
     ============================================================================ */

  /**
   * Badges (simplified for print)
   */
  .badge,
  .process-card-badge,
  .feature-card-badge,
  .impact-indicator {
    border: 1pt solid #000;
    padding: 0.1cm 0.2cm;
    font-size: 8pt;
    font-weight: 700;
    background: #ffffff;
  }

  /* ============================================================================
     LINKS
     ============================================================================ */

  /**
   * Link styling for print
   */
  a {
    text-decoration: none;
    color: #000;
  }

  /**
   * Show URLs after external links
   */
  a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #4a5568;
  }

  /**
   * Don't show URLs for internal links
   */
  a[href^="#"]:after {
    content: "";
  }

  /* ============================================================================
     COVER PAGE
     ============================================================================ */

  /**
   * Cover page styling
   */
  .cover-page {
    page-break-after: always;
    text-align: center;
    padding-top: 5cm;
  }

  .cover-page h1 {
    font-size: 28pt;
    font-weight: 800;
    color: #0077B6;
    margin-bottom: 1cm;
  }

  .cover-page h2 {
    font-size: 18pt;
    font-weight: 600;
    color: #4a5568;
    margin-bottom: 3cm;
  }

  .cover-page .metadata {
    font-size: 11pt;
    color: #718096;
  }

  /* ============================================================================
     TABLE OF CONTENTS
     ============================================================================ */

  /**
   * Table of contents styling
   */
  .toc-page {
    page-break-after: always;
  }

  .toc-list {
    list-style: none;
    padding: 0;
  }

  .toc-list li {
    margin-bottom: 0.3cm;
    display: flex;
    justify-content: space-between;
  }

  .toc-list a {
    text-decoration: none;
  }

  .toc-list a:after {
    content: "";
  }

  .toc-page-number {
    font-weight: 700;
  }

  /* ============================================================================
     EXECUTIVE SUMMARY
     ============================================================================ */

  /**
   * Executive summary page
   */
  .executive-summary {
    page-break-after: always;
  }

  .executive-summary h2 {
    color: #0077B6;
    border-bottom: 2pt solid #0077B6;
    padding-bottom: 0.2cm;
  }

  /* ============================================================================
     FINANCIAL SECTIONS
     ============================================================================ */

  /**
   * Financial highlights
   */
  .financial-highlights {
    border: 2pt solid #0077B6;
    padding: 0.5cm;
    margin: 0.5cm 0;
    background: #f7fafc;
  }

  .financial-highlights h3 {
    color: #0077B6;
    margin-top: 0;
  }

  /* ============================================================================
     UTILITIES
     ============================================================================ */

  /**
   * Force page break
   */
  .page-break {
    page-break-after: always;
  }

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

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

  /**
   * Print-only elements
   */
  .print-only {
    display: block;
  }

  .screen-only {
    display: none;
  }

  /**
   * Simplify shadows and effects
   */
  .no-print-effects {
    box-shadow: none;
    text-shadow: none;
    transition: none;
  }

}