/* ==========================================================================
   AtoZToolbox — Responsive & Print Media Styles
   ========================================================================== */

/* Breakpoint: <= 1024px */
@media (max-width: 1024px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
  }
}

/* Breakpoint: <= 768px */
@media (max-width: 768px) {
  .site-nav {
    display: none;
  }

  .mobile-menu-toggle {
    display: flex;
  }

  .hero-title {
    font-size: 2rem;
  }

  .tool-title {
    font-size: 1.85rem;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  .result-main-value {
    font-size: 1.6rem;
  }

  .tool-card-wrapper {
    padding: var(--space-4);
  }
}

/* Breakpoint: <= 480px */
@media (max-width: 480px) {
  .hero-search-box {
    padding: var(--space-1) var(--space-3);
  }

  .hero-search-box input {
    font-size: 0.95rem;
  }

  .tool-actions {
    flex-direction: column;
  }

  .tool-actions .btn {
    width: 100%;
  }

  .result-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   Print Stylesheet (Invoice & Receipt Printing & PDF Export)
   ========================================================================== */
@media print {
  /* Hide non-printable elements */
  .site-header,
  .site-footer,
  .search-modal-backdrop,
  .breadcrumb,
  .tool-header .tool-subtitle,
  .tool-actions,
  .no-print,
  .prose,
  .faq-list,
  .section-header,
  .tool-grid,
  .category-grid,
  .toast-container,
  .skip-link {
    display: none !important;
  }

  body {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 12pt;
    line-height: 1.4;
    padding: 0 !important;
    margin: 0 !important;
  }

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

  .tool-card-wrapper {
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Printable Document Formatting */
  .printable-document {
    background: #ffffff !important;
    color: #000000 !important;
    padding: 20mm !important;
    margin: 0 auto !important;
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    page-break-after: always;
  }

  .printable-document table {
    width: 100% !important;
    border-collapse: collapse !important;
  }

  .printable-document th,
  .printable-document td {
    border-bottom: 1px solid #ccc !important;
    padding: 8px 4px !important;
  }

  .printable-document th {
    background-color: #f3f4f6 !important;
    color: #000000 !important;
  }

  a[href]::after {
    content: "" !important; /* Avoid printing URLs */
  }
}
