/* =============================================
   STYLES.CSS — Contract Tool custom styles
   Tailwind (CDN) handles most utility styling.
   Only non-Tailwind patterns live here.
   ============================================= */

/* Font stacks */
body           { font-family: 'Inter', sans-serif; }
.document-font { font-family: 'Merriweather', serif; }

/* --- Status & payment badge variants --- */
.badge-draft     { background-color: rgb(241 245 249); color: rgb(51  65  85); }
.badge-active    { background-color: rgb(219 234 254); color: rgb(29  78 216); }
.badge-completed { background-color: rgb(220 252 231); color: rgb(21 128  61); }
.badge-partial   { background-color: rgb(254 249 195); color: rgb(161 98   7); }
.badge-paid      { background-color: rgb(220 252 231); color: rgb(21 128  61); }
.badge-unpaid    { background-color: rgb(248 250 252); color: rgb(71  85 105); }

/* --- Drag-and-drop zone --- */
.drop-zone         { transition: all 0.2s ease; }
.drop-zone.dragover { background-color: #f0fdfa; border-color: #0d9488; }

/* --- View transitions --- */
.app-view        { display: none; }
.app-view.active {
    display: block;
    animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to   { opacity: 1; transform: translateY(0);   }
}

/* --- Print: hide all UI chrome --- */
@media print {
    @page { margin: 10mm; }
    body       { background: white; margin: 0; padding: 0; }
    .no-print  { display: none !important; }

    /* When printing a specific element, hide everything except the clone */
    body.printing > *:not(#print-clone) { display: none !important; }
    body.printing #print-clone {
        display: block !important;
        position: static !important;
        margin: 0;
        padding: 0;
        box-shadow: none !important;
        border-radius: 0 !important;
        /* Remove min-height so content doesn't force a second page */
        min-height: 0 !important;
        max-width: 100% !important;
    }
}