:root {
    /* Brand / Actions: Primary and accent colors for branding and interactive elements */
    --color-primary: #1E40AF; /* Navy Blue: main brand color */
    --color-accent: #3B82F6; /* Bright Blue: accent for highlights */
    --color-standout: #F97316; /* Orange Accent: for standout actions */
    /* Feedback / Status: Colors for success, warning, error, info states */
    --color-success: #10B981; /* Emerald: success messages */
    --color-warning: #F59E0B; /* Amber: warning messages */
    --color-error: #EF4444; /* Red: error messages */
    --color-info: #06B6D4; /* Cyan: info messages */
    /* Backgrounds: Light background shades for panels and pages */
    --color-bg-light: #F1F5F9; /* Slate Tint: card backgrounds */
    --color-bg-lighter: #F8FAFC; /* Light Slate: page backgrounds */
    /* Borders / Shadows: Subtle border and shadow for depth */
    --color-border-light: #CBD5E1; /* Slate Border: for cards, panels */
    --color-shadow-sm: 0 2px 10px rgba(30, 64, 175, 0.08); /* Small shadow for elevation */
    /* Text: Main and muted text colors */
    --color-text: #0F172A; /* Slate 900: main text */
    --color-text-muted: #64748B; /* Muted text for less emphasis */
    --color-text-white: #FFFFFF; /* White text for dark backgrounds */
    /* Layout constants: Sidebar, navbar, and footer sizing */
    --sidebar-width: 200px;
    --navbar-height: 56px;
    --footer-height: 60px;
    /* Gradients: Used for backgrounds and highlights */
    --gradient-primary: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%);
    --gradient-primary-deep: linear-gradient(135deg, #0F172A 0%, #1E40AF 50%, #3B82F6 100%);
    --gradient-primary-soft: linear-gradient(135deg, #1E40AF 0%, #3B82F6 70%, #F8FAFC 100%);
    --fax-justify-content: center;
}

html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

/* Alert customizations for trial status and feedback messages */
.alert {
    border-radius: 0.5rem;
    border: 1px solid;
}

.alert-success {
    background-color: rgba(16, 185, 129, 0.1);
    border-color: var(--color-success);
    color: var(--color-success);
}

.alert-warning {
    background-color: rgba(245, 158, 11, 0.1);
    border-color: var(--color-warning);
    color: var(--color-warning);
}

.alert-danger {
    background-color: rgba(239, 68, 68, 0.1);
    border-color: var(--color-error);
    color: var(--color-error);
}

.alert-info {
    background-color: rgba(6, 182, 212, 0.1);
    border-color: var(--color-info);
    color: var(--color-info);
}

.btn-primary {
    background: linear-gradient(90deg, #2196f3 0%, #3f51b5 100%);
    border: none;
    transition: all 0.3s ease;
}
.btn-primary:hover {
    background: linear-gradient(90deg, #1976d2 0%, #303f9f 100%);
    transform: scale(1.05);
    box-shadow: 0 0.5rem 1rem rgba(33, 150, 243, 0.3);
}
.fw-semibold {
    font-weight: 600 !important;
}
.btn:hover {
    color: var(--bs-btn-hover-color);
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-border-color);
}
.btn-secondary {
    transition: all 0.3s ease;
}
.btn-secondary:hover {
    transform: scale(1.05);
}

.modal-header.bg-primary {
    background: linear-gradient(90deg, #2196f3 0%, #3f51b5 100%);
}