/* Utility Classes */

/* Text Alignment */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.text-justify { text-align: justify; }

/* Colors */
.text-primary { color: var(--primary-color); }
.text-secondary { color: var(--secondary-color); }
.text-muted { color: var(--text-muted); }
.text-danger { color: var(--error-color); }
.text-success { color: var(--success-color); }

.bg-primary { background-color: var(--primary-color); color: white; }
.bg-secondary { background-color: var(--secondary-color); color: white; }
.bg-light { background-color: var(--bg-body); }
.bg-white { background-color: var(--bg-card); }

/* Spacing */
.m-0 { margin: 0; }
.mt-1 { margin-top: var(--spacing-xs); }
.mt-2 { margin-top: var(--spacing-sm); }
.mt-3 { margin-top: var(--spacing-md); }
.mt-4 { margin-top: var(--spacing-lg); }
.mt-5 { margin-top: var(--spacing-xl); }

.mb-1 { margin-bottom: var(--spacing-xs); }
.mb-2 { margin-bottom: var(--spacing-sm); }
.mb-3 { margin-bottom: var(--spacing-md); }
.mb-4 { margin-bottom: var(--spacing-lg); }
.mb-5 { margin-bottom: var(--spacing-xl); }

.p-0 { padding: 0; }
.p-1 { padding: var(--spacing-xs); }
.p-2 { padding: var(--spacing-sm); }
.p-3 { padding: var(--spacing-md); }
.p-4 { padding: var(--spacing-lg); }
.p-5 { padding: var(--spacing-xl); }

/* Display */
.d-none { display: none !important; }
.d-block { display: block !important; }
.d-flex { display: flex !important; }
.d-grid { display: grid !important; }

/* Flexbox Helpers */
.justify-content-between { justify-content: space-between; }
.justify-content-center { justify-content: center; }
.align-items-center { align-items: center; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.gap-1 { gap: var(--spacing-sm); }
.gap-2 { gap: var(--spacing-md); }

/* Width */
.w-100 { width: 100%; }
.w-50 { width: 50%; }

/* Print Styles */
@media print {
    .site-header, .site-footer, .btn-primary, .btn-secondary, .faq-section {
        display: none !important;
    }
    
    .container {
        width: 100%;
        max-width: none;
        padding: 0;
        margin: 0;
    }
    
    .calculator-layout {
        display: block;
    }
    
    .result-section {
        position: static;
        box-shadow: none;
        border: 1px solid #000;
        color: black;
        background-color: white;
    }
    
    .input-section {
        box-shadow: none;
        margin-bottom: 20px;
    }
    
    body {
        background-color: white;
        font-size: 12pt;
    }
    
    h1, h2, h3 {
        color: black;
    }
}