/* Custom styles to complement Tailwind CSS */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800&display=swap');

body {
    font-family: 'Inter', sans-serif;
}

/* Custom scrollbar for code blocks */
pre::-webkit-scrollbar { width: 8px; height: 8px; }
pre::-webkit-scrollbar-track { background: #0f172a; }
pre::-webkit-scrollbar-thumb { background-color: #334155; border-radius: 4px; }
pre::-webkit-scrollbar-thumb:hover { background-color: #475569; }

/* Styles for the contenteditable Div (Prikaz na ekranu) */
#vendor-email-content {
    font-family: 'Inter', 'Menlo', monospace; 
    line-height: 1.6;
    background-color: #0f172a; 
    color: #e2e8f0; 
    overflow-y: auto; 
    max-height: 500px; 
    white-space: pre-wrap; 
    box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.2); 
    padding: 1.5rem; 
}

#vendor-email-content::selection { background-color: #7c3aed; color: white; }
#vendor-email-content::-webkit-scrollbar { width: 8px; }
#vendor-email-content::-webkit-scrollbar-track { background: #0f172a; }
#vendor-email-content::-webkit-scrollbar-thumb { background-color: #334155; border-radius: 4px; }
#vendor-email-content::-webkit-scrollbar-thumb:hover { background-color: #475569; }


/* ==============================================================
   PRINT STYLES - TONER SAVER & LAYOUT FIX
   ============================================================== */
@media print {
    @page {
        margin: 1.2cm; /* Standardna A4 margina */
    }

    /* 1. TONER SAVER: Forsiran crni tekst i uklanjanje svih nepotrebnih pozadina */
    body, html {
        background-color: #ffffff !important;
        color: #000000 !important;
        font-size: 10pt;
    }

    .text-white, .text-gray-300, .text-indigo-200, .text-indigo-100,
    .text-pink-300, .text-blue-300, .text-purple-300, .text-orange-300,
    .text-cyan-400, .text-secondary, .text-slate-300, .text-primary, .text-copy,
    .text-green-400, .text-yellow-400, .text-red-300 {
        color: #000000 !important;
    }

    /* Uklanjamo obojene pozadine, ALI NE dodajemo okvir glavnim kontejnerima */
    .bg-slate-900, .bg-slate-800, .bg-slate-950, .bg-indigo-950, 
    .bg-indigo-950\/30, .bg-indigo-950\/50, .bg-pink-900\/10, 
    .bg-blue-900\/10, .bg-blue-900\/50, .bg-purple-900\/10, 
    .bg-orange-900\/10, .bg-background, .bg-surface, .border-slate-800 {
        background-color: #ffffff !important;
        color: #000000 !important;
        box-shadow: none !important;
    }

    /* 2. SAKRIJ UI ELEMENTE */
    header, main > div:first-child, section:not(.report-section), footer, 
    #analyze-form, #error-section, .report-header .flex.items-center,
    #app-container > div#header-placeholder, #app-container > main > section, 
    .download-options, button, .fas.fa-chevron-down, .opacity-10, .absolute.top-0.right-0 {
        display: none !important;
    }

    /* 3. DOZVOLA ZA PRELOM GLAVNIH KONTEJNERA (Rešava praznu prvu stranu i briše spoljni okvir) */
    body, html, #report-modal, #report-modal > div, #app-container, .bg-background, .bg-slate-900 {
        border: none !important;
        page-break-inside: auto !important;
        break-inside: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        position: static !important;
        width: 100% !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* Uklanja viška vertikalnih razmaka u modalu */
    #modal-report-content > .space-y-12 > * + * { margin-top: 0 !important; }

    /* 4. NASLOVNA STRANA (Cover Page Fix) */
    #print-cover-page {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        height: auto !important;
        min-height: 60vh !important; 
        page-break-after: always !important; 
        margin: 0 0 2rem 0 !important;
        padding: 0 !important;
        border: none !important;
    }

    #print-cover-page img {
        max-height: 250px !important; 
        width: auto !important;
        margin: 0 auto;
        display: block;
    }

    #print-cover-page h1 { font-size: 36pt !important; margin-bottom: 2rem !important; color: #000 !important; text-align: center; }
    #print-cover-page .cover-field p:first-child { font-size: 12pt !important; color: #333 !important; }
    #print-cover-page .cover-field p:last-child { font-size: 18pt !important; font-weight: bold !important; color: #000 !important; }

    /* 5. SEKCIJE I NASLOVI (Sprečavanje loma teksta) */
    .report-section {
        display: block !important;
        page-break-before: always !important;
        margin-top: 1rem !important;
    }

    /* Nema loma PRE prve sekcije (posle cover strane) */
    #print-cover-page + .report-section,
    #report-content > .report-section:first-child,
    #report-content > .report-section:first-of-type {
        page-break-before: avoid !important;
        margin-top: 0 !important;
    }

    /* Naslov mora ostati vezan za svoj sadržaj */
    .report-section-title {
        color: #000 !important;
        font-size: 1.5rem;
        font-weight: bold;
        margin-bottom: 1rem;
        border-bottom: 2px solid #000;
        padding-bottom: 0.5rem;
        page-break-after: avoid !important;
        break-after: avoid !important;
    }

    .report-section-title + * {
        page-break-before: avoid !important;
    }

    /* 6. FLEXBOX, KRUGOVI I BEDŽEVI (Fix za formatiranje) */
    .flex { display: flex !important; flex-wrap: wrap !important; }
    
    /* BEDŽEVI dobijaju okvir umesto boje */
    .badge, .inline-flex {
        display: inline-flex !important;
        align-items: center !important;
        border: 1px solid #000 !important;
        padding: 2px 6px !important;
        border-radius: 4px !important;
        background: transparent !important;
    }

    /* KRUGOVI (za ocenu 42, slovo D itd) - flex-shrink:0 ih čuva da ne postanu elipse */
    .rounded-full, .w-24.h-24, .w-32.h-32 {
        flex-shrink: 0 !important;
        border: 2px solid #000 !important; /* Jasan crni krug oko slova/broja */
        background-color: transparent !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* 7. KARTICE (Samo unutrašnje kartice dobijaju okvir i zabranu sečenja na pola) */
    .bg-surface, .rounded-xl, .bg-slate-800 {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        padding: 1rem !important;
        border: 1px solid #000000 !important; /* Okvir ide SAMO na kartice, ne na celu stranu */
        margin-bottom: 1.5rem !important;
    }

    /* 8. KODOVI, TABELE I SKROLOVI */
    .overflow-y-auto, .custom-scrollbar, .overflow-x-auto,
    .max-h-24, .max-h-32, .max-h-\[500px\] {
        max-height: none !important; 
        height: auto !important;      
        overflow: visible !important; 
        display: block !important;    
    }

    pre, code, #vendor-email-content {
        white-space: pre-wrap !important; 
        word-wrap: break-word !important; 
        word-break: break-all !important; /* Sprečava duge reči da izađu izvan ekrana */
        overflow: visible !important;
        max-width: 100% !important;
        max-height: none !important;
        background-color: transparent !important; 
        border: 1px dashed #000 !important;
        color: #000 !important;
        display: block !important;
        padding: 0.5rem !important;
        page-break-inside: avoid !important;
    }

    table {
        width: 100% !important;
        table-layout: fixed !important; 
        border-collapse: collapse !important;
    }
    
    td, th, tr {
        page-break-inside: avoid !important;
        word-wrap: break-word !important;
        border: 1px solid #ccc !important; /* Diskretan okvir tabele */
    }

    ::-webkit-scrollbar {
        display: none !important;
    }
}