/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Print styles for reviews */
@media print {
  /* Hide navigation and action buttons */
  nav,
  .flex.flex-wrap.gap-3,
  a[href*="edit"],
  a[href*="reviews"],
  button[type="submit"],
  button[onclick*="print"] {
    display: none !important;
  }

  /* Base styles */
  body {
    color: #000 !important;
    background: #fff !important;
    font-size: 0.625rem !important;
    line-height: 1.4 !important;
  }

  /* Typography */
  h1 { font-size: 0.9375rem !important; line-height: 1.3 !important; }
  h3 { font-size: 0.75rem !important; line-height: 1.4 !important; }
  p { font-size: 0.625rem !important; line-height: 1.4 !important; }
  .text-xl { font-size: 0.75rem !important; }
  .text-base { font-size: 0.625rem !important; }
  .text-sm { font-size: 0.5625rem !important; }
  .text-xs { font-size: 0.5rem !important; }
  .leading-snug { line-height: 1.2 !important; }
  .leading-relaxed { line-height: 1.3 !important; }

  /* Backgrounds - all white for print */
  .bg-gradient-to-r,
  .bg-blue-50,
  .bg-gray-50 {
    background: #fff !important;
  }

  /* Text colors - all black for readability */
  .bg-gradient-to-r h1,
  .bg-gradient-to-r h3,
  .bg-gradient-to-r p {
    color: #000 !important;
  }

  /* Borders - simple black border around responsibilities only */
  [id^="responsibility-"] {
    border: 1px solid #000 !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  [data-rating] {
    border: none !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* Remove decorative elements */
  .rounded-lg,
  .rounded-md,
  .rounded-t-lg {
    border-radius: 0 !important;
  }

  .shadow-sm {
    box-shadow: none !important;
  }

  /* Spacing - reduced for compact layout */
  .px-6 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
  .py-4 { padding-top: 0.375rem !important; padding-bottom: 0.375rem !important; }
  .px-4 { padding-left: 0.375rem !important; padding-right: 0.375rem !important; }
  .py-2\.5 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
  .p-3 { padding: 0.25rem !important; }
  .mb-6 { margin-bottom: 0.375rem !important; }
  .mb-4 { margin-bottom: 0.25rem !important; }
  .mb-3 { margin-bottom: 0.25rem !important; }
  .mb-2 { margin-bottom: 0.1875rem !important; }
  .mt-1 { margin-top: 0.125rem !important; }
  .gap-3 { gap: 0.25rem !important; }
  .gap-2 { gap: 0.1875rem !important; }
}