body {
    font-family: 'Inter', sans-serif;
}
@media print {
    body * {
        visibility: hidden;
    }
    #invoice-preview-content, #invoice-preview-content * {
        visibility: visible;
    }
    #invoice-preview-content {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background-color: white;
        color: black;
    }
    .no-print {
        display: none;
    }
}
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #f8fafc;
}
.dark ::-webkit-scrollbar-track {
    background: #020617;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}
.dark ::-webkit-scrollbar-thumb {
    background: #334155;
}
::-webkit-scrollbar-thumb:hover {
     background: #94a3b8;
}
.dark ::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}
.nav-btn-active {
    background-color: #0f172a;
    color: white;
}
.dark .nav-btn-active {
    background-color: white;
    color: #0f172a;
}
#templatePreviewContent, #invoice-preview-content, #historyPreviewContent, #modal-preview-text {
    white-space: pre-wrap;
    word-wrap: break-word;
}
.calendar-day.selected {
    background-color: #0f172a;
    color: white;
    border-radius: 50%;
}
.dark .calendar-day.selected {
    background-color: white;
    color: #0f172a;
}
.calendar-day:not(.empty):hover {
    background-color: #e2e8f0;
    border-radius: 50%;
}
.dark .calendar-day:not(.empty):hover {
    background-color: #334155;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input[type=number] {
  -moz-appearance: textfield;
}
.autocomplete-item:hover, .autocomplete-item.active {
    background-color: #e2e8f0;
}
.dark .autocomplete-item:hover, .dark .autocomplete-item.active {
    background-color: #334155;
}

/* Page Load Animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.animate-fade-in-up {
    animation: fadeInUp 0.3s ease-out forwards;
}