/**
 * PRINT STYLESHEET - Strategy Crafting App
 * =========================================
 * Wird nur beim Drucken geladen (media="print")
 * Höchste Spezifität um Tailwind zu überschreiben
 */

/* Seiteneinstellungen */
@page {
  size: A4 portrait;
  margin: 15mm 12mm 18mm 12mm;
}

/* ============================================
   GLOBALE RESETS MIT HÖCHSTER SPEZIFITÄT
   ============================================ */

html body {
  background: white !important;
  color: #1a1a1a !important;
  font-size: 10pt !important;
  line-height: 1.45 !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Alle Elemente - Basis-Reset */
html body * {
  box-shadow: none !important;
  text-shadow: none !important;
}

/* ============================================
   UI-ELEMENTE KOMPLETT AUSBLENDEN
   ============================================ */

html body button,
html body nav,
html body .print-hidden,
html body [class*="animate-spin"],
html body .fixed.inset-0 > div > header,
html body .fixed.inset-0 > div > footer {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* ============================================
   MODAL-CONTAINER FÜR DRUCK
   ============================================ */

html body .fixed.inset-0 {
  position: static !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  overflow: visible !important;
  height: auto !important;
  min-height: 0 !important;
}

html body .fixed.inset-0 > div {
  position: static !important;
  max-width: 100% !important;
  max-height: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  border: none !important;
  overflow: visible !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Scroll-Container */
html body .overflow-y-auto,
html body .overflow-auto,
html body .overflow-x-auto {
  overflow: visible !important;
  max-height: none !important;
  height: auto !important;
}

/* ============================================
   HÖHEN-RESETS (verhindert Leerseiten)
   ============================================ */

html body .min-h-screen,
html body [class*="min-h-"] {
  min-height: 0 !important;
  height: auto !important;
}

html body .h-screen,
html body [class*="h-screen"],
html body [class*="h-full"] {
  height: auto !important;
}

html body .flex-col {
  height: auto !important;
  min-height: 0 !important;
}

/* ============================================
   CONTAINER-RESETS
   ============================================ */

html body .container,
html body .max-w-4xl,
html body .max-w-5xl,
html body .max-w-7xl,
html body [class*="max-w-"] {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ============================================
   PRINT-HEADER (nur im Druck sichtbar)
   ============================================ */

html body .print-report-header {
  display: block !important;
  margin-bottom: 6mm !important;
  padding-bottom: 3mm !important;
  border-bottom: 0.5pt solid #999 !important;
}

html body .print-report-title {
  font-size: 14pt !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  margin: 0 0 1mm 0 !important;
  line-height: 1.2 !important;
}

html body .print-report-meta {
  font-size: 8pt !important;
  color: #666 !important;
  display: flex !important;
  justify-content: space-between !important;
}

/* ============================================
   TYPOGRAFIE - ÜBERSCHRIFTEN
   ============================================ */

html body .prose h1,
html body .prose h2,
html body .prose .text-2xl,
html body .print-section-title,
html body h2 {
  font-size: 11pt !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  margin: 4mm 0 2mm 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
  page-break-after: avoid !important;
  break-after: avoid !important;
}

html body .prose h3,
html body .prose .text-xl,
html body .print-subsection-title,
html body h3 {
  font-size: 10pt !important;
  font-weight: 600 !important;
  color: #333 !important;
  margin: 3mm 0 1.5mm 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
  page-break-after: avoid !important;
  break-after: avoid !important;
}

html body .prose h4,
html body h4 {
  font-size: 9.5pt !important;
  font-weight: 600 !important;
  color: #444 !important;
  margin: 2mm 0 1mm 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
  page-break-after: avoid !important;
  break-after: avoid !important;
}

/* ============================================
   TYPOGRAFIE - TEXT
   ============================================ */

html body .prose p,
html body .prose,
html body .print-paragraph,
html body p {
  font-size: 9.5pt !important;
  line-height: 1.45 !important;
  margin: 0 0 2mm 0 !important;
  padding: 0 !important;
  orphans: 3 !important;
  widows: 3 !important;
  text-align: left !important;
}

html body .prose strong,
html body strong {
  font-weight: 600 !important;
}

html body .prose em,
html body em {
  font-style: italic !important;
}

/* ============================================
   TYPOGRAFIE - LISTEN
   ============================================ */

html body .prose ul,
html body .prose ol,
html body ul,
html body ol {
  font-size: 9.5pt !important;
  margin: 0 0 2mm 0 !important;
  padding-left: 5mm !important;
  page-break-inside: avoid !important;
}

html body .prose li,
html body li {
  font-size: 9.5pt !important;
  line-height: 1.4 !important;
  margin: 0 0 0.5mm 0 !important;
  padding: 0 !important;
}

/* Listen direkt nach Überschriften nicht trennen */
html body h2 + ul,
html body h2 + ol,
html body h3 + ul,
html body h3 + ol,
html body .prose h2 + ul,
html body .prose h3 + ul {
  page-break-before: avoid !important;
  break-before: avoid !important;
}

/* ============================================
   KARTEN UND BOXEN
   ============================================ */

html body .bg-white,
html body [class*="rounded-lg"],
html body [class*="rounded-xl"],
html body [class*="shadow"] {
  box-shadow: none !important;
  border-radius: 0 !important;
}

html body [class*="border-l-4"] {
  border-left-width: 2pt !important;
  padding: 2mm !important;
  margin: 2mm 0 !important;
  page-break-inside: avoid !important;
}

/* ============================================
   HINTERGRUNDFARBEN (dezent für Druck)
   ============================================ */

html body [class*="bg-purple-50"],
html body [class*="bg-blue-50"],
html body [class*="bg-green-50"],
html body [class*="bg-slate-50"],
html body [class*="bg-gray-50"],
html body [class*="bg-teal-50"],
html body [class*="bg-yellow-50"],
html body [class*="bg-red-50"] {
  background-color: #f9f9f9 !important;
}

/* Gradient Headers */
html body [class*="bg-gradient"] {
  background: #4a5568 !important;
  color: white !important;
  padding: 3mm !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

/* ============================================
   BORDER-FARBEN BEIBEHALTEN
   ============================================ */

html body .border-purple-500 { border-color: #8b5cf6 !important; }
html body .border-blue-500 { border-color: #3b82f6 !important; }
html body .border-green-500 { border-color: #22c55e !important; }
html body .border-teal-500 { border-color: #14b8a6 !important; }
html body .border-yellow-500 { border-color: #eab308 !important; }
html body .border-red-500 { border-color: #ef4444 !important; }

/* ============================================
   TEXT-FARBEN BEIBEHALTEN
   ============================================ */

html body .text-green-800, html body .text-green-700 { color: #166534 !important; }
html body .text-yellow-800, html body .text-yellow-700 { color: #854d0e !important; }
html body .text-red-800, html body .text-red-700 { color: #991b1b !important; }
html body .text-blue-800, html body .text-blue-700 { color: #1e40af !important; }
html body .text-purple-800, html body .text-purple-700 { color: #6b21a8 !important; }
html body .text-teal-800, html body .text-teal-700 { color: #115e59 !important; }

/* ============================================
   GRID ZU BLOCK
   ============================================ */

html body .grid {
  display: block !important;
}

html body .grid > div {
  display: block !important;
  width: 100% !important;
  margin-bottom: 2mm !important;
}

/* ============================================
   DETAILS/SUMMARY
   ============================================ */

html body details {
  display: block !important;
  page-break-inside: avoid !important;
}

html body details > summary {
  display: block !important;
  font-weight: 600 !important;
  font-size: 10pt !important;
  padding: 1mm 0 !important;
  margin-bottom: 1mm !important;
  list-style: none !important;
}

html body details > summary::-webkit-details-marker {
  display: none !important;
}

html body details[open] > *:not(summary) {
  display: block !important;
}

/* ============================================
   STICKY ELEMENTE
   ============================================ */

html body .sticky {
  position: static !important;
}

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

html body a {
  text-decoration: none !important;
  color: inherit !important;
}

/* ============================================
   BILDER
   ============================================ */

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

/* ============================================
   TABELLEN
   ============================================ */

html body table {
  font-size: 8.5pt !important;
  border-collapse: collapse !important;
  width: 100% !important;
  margin: 2mm 0 !important;
  page-break-inside: avoid !important;
}

html body th {
  background-color: #f0f0f0 !important;
  font-weight: 600 !important;
  text-align: left !important;
  padding: 1.5mm 2mm !important;
  border: 0.3pt solid #ccc !important;
  font-size: 8.5pt !important;
}

html body td {
  padding: 1mm 2mm !important;
  border: 0.3pt solid #ccc !important;
  vertical-align: top !important;
  font-size: 8.5pt !important;
}

/* ============================================
   SEITENUMBRUCH-KONTROLLE
   ============================================ */

html body .print-keep-together,
html body .printable-card,
html body .printable-details-section {
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}

html body .print-page-break-before {
  page-break-before: always !important;
  break-before: page !important;
}

/* Keine Leerseiten am Ende */
html body > div:last-child {
  page-break-after: avoid !important;
}

/* ============================================
   SPEZIELLE MODUL-ANPASSUNGEN
   ============================================ */

/* Role Detail Page */
html body #printable-role-card {
  box-shadow: none !important;
}

html body #role-card-header {
  background-color: #334155 !important;
  color: white !important;
  padding: 3mm !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

/* Assessment Report */
html body .bg-gradient-to-r.from-purple-600.to-blue-600 {
  background: #6b46c1 !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

/* Modal Content Padding */
html body .fixed.inset-0 .p-6 {
  padding: 0 !important;
}