/* Global Styles */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f8f9fa;
    color: #333;
}

.container {
    max-width: 1200px;
    padding: 20px;
}

/* Header Styles */
header {
    margin-bottom: 2rem;
}

header h1 {
    color: #0d6efd;
    font-weight: 600;
}

/* Medication Button Styles */
.medication-buttons {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.medication-buttons .btn {
    min-width: 150px;
    font-weight: 500;
    transition: all 0.3s ease;
}

/* Calculator Styles */
.sticky-top {
    top: 10px;
    z-index: 100;
}

.calculator-section h4 {
    margin-bottom: 0.75rem;
    font-weight: 600;
}

#calculationResult, #budgetResult {
    font-size: 0.9rem;
}

.calculation-result h4, .budget-result h4 {
    font-size: 1.1rem;
    margin-bottom: 0.75rem;
    color: #0d6efd;
}

.price, .price-result {
    font-size: 1.25rem;
    font-weight: 600;
    color: #198754;
}

.price-per-tab {
    font-size: 0.9rem;
    color: #6c757d;
}

.savings-per-tab {
    font-weight: 600;
    color: #0d6efd;
}

.savings, .quantity-result {
    font-weight: 600;
    color: #dc3545;
}

/* Pricing Table Styles */
.pricing-table {
    width: 100%;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}

.pricing-table th {
    background-color: #f8f9fa;
    font-weight: 600;
}

.pricing-table .price, 
.pricing-table .price-per-tab, 
.pricing-table .savings {
    font-weight: 600;
}

.dosage-header {
    margin-bottom: 1rem;
}

.dosage-header h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #0d6efd;
}

/* Medication-specific brand colors */
.sildenafil-color {
    color: #005DAA !important;
}

.tadalafil-color {
    color: #EFB631 !important;
}

.sildenafil-bg {
    background-color: #005DAA !important;
    border-color: #005DAA !important;
    color: #ffffff !important;
}

.tadalafil-bg {
    background-color: #EFB631 !important;
    border-color: #EFB631 !important;
    color: #212529 !important;
}

.sildenafil-btn.active {
    background-color: #005DAA !important;
    border-color: #005DAA !important;
    color: #ffffff !important;
}

.sildenafil-btn:not(.active) {
    color: #005DAA !important;
    border-color: #005DAA !important;
}

.tadalafil-btn.active {
    background-color: #EFB631 !important;
    border-color: #EFB631 !important;
    color: #212529 !important;
}

.tadalafil-btn:not(.active) {
    color: #EFB631 !important;
    border-color: #EFB631 !important;
}

/* Dosage header styling with medication colors */
.sildenafil-header h3 {
    color: #005DAA;
    border-left: 4px solid #005DAA;
    padding-left: 10px;
}

.tadalafil-header h3 {
    color: #EFB631;
    border-left: 4px solid #EFB631;
    padding-left: 10px;
}

/* Table background colors */
.sildenafil-table {
    background-color: #EBF5FF !important; /* Light blue background */
}

.sildenafil-table th {
    background-color: #D6EBFF !important; /* Slightly darker blue for headers */
}

.tadalafil-table {
    background-color: #FFF8E6 !important; /* Light yellow background */
}

.tadalafil-table th {
    background-color: #FFEFC2 !important; /* Slightly darker yellow for headers */
}

/* Highlight row colors adjusted for table backgrounds */
.sildenafil-table .highlight-row {
    background-color: rgba(0, 93, 170, 0.15) !important;
    border: 2px solid #005DAA !important;
}

.tadalafil-table .highlight-row {
    background-color: rgba(239, 182, 49, 0.25) !important;
    border: 2px solid #EFB631 !important;
}

/* Best Value and Highlight Styles */
.best-value {
    background-color: rgba(25, 135, 84, 0.1);
}

.best-price-per-tab {
    background-color: rgba(13, 110, 253, 0.1);
}

.highlight-row {
    background-color: rgba(255, 193, 7, 0.25) !important;
    border: 2px solid #ffc107 !important;
}

/* Tab Styles */
.nav-tabs .nav-link {
    font-weight: 500;
}

.nav-tabs .nav-link.active {
    font-weight: 600;
    color: #0d6efd;
}

/* Responsive Adjustments */
@media (max-width: 767.98px) {
    .medication-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .medication-buttons .btn {
        width: 100%;
        max-width: 250px;
    }
    
    .sticky-top {
        position: relative;
    }
}

/* Animation for calculation results */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

#calculationResult, #budgetResult {
    animation: fadeIn 0.3s ease-out;
}

/* Prevent scrolling to highlighted row */
html {
    scroll-behavior: smooth;
}

.scroll-target {
    scroll-margin-top: 100px;
}