/* MS-Infotech Website - Unified Color Scheme */

:root {
    /* Primary Colors */
    --primary-dark: #1e2a78;    /* Deep blue */
    --primary-light: #6a4bc6;   /* Purple */
    --secondary: #f9d423;       /* Yellow accent */
    
    /* Background and Text Colors */
    --dark-color: #232526;      /* Almost black */
    --light-color: #f8f9fa;     /* Off white */
    --gray: #8d99ae;            /* Medium gray */
    --light-gray: #e9ecef;      /* Lighter gray */
    
    /* Gradients */
    --gradient-primary: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-light) 100%);
    --gradient-navbar: linear-gradient(90deg, var(--dark-color) 0%, var(--primary-light) 100%);
    --gradient-accent: linear-gradient(90deg, var(--primary-light) 0%, var(--secondary) 100%);
    
    /* Shadows */
    --card-shadow: 0 8px 32px rgba(106, 75, 198, 0.12);
    --hover-shadow: 0 16px 40px rgba(106, 75, 198, 0.22);
    --button-shadow: 0 6px 20px rgba(106, 75, 198, 0.3);
    
    /* Transitions */
    --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Common Background Styles */
body {
    background: var(--gradient-primary);
    background-attachment: fixed;
}

/* Navbar Styling */
.navbar, .bg-primary {
    background: var(--gradient-navbar) !important;
    box-shadow: 0 4px 18px rgba(30, 42, 120, 0.15);
}

/* Card Styling */
.card, .appointment-form, .job-listing, .accordion-item, .table {
    border-radius: 18px;
    box-shadow: var(--card-shadow);
    background: rgba(255, 255, 255, 0.92);
    transition: var(--transition-smooth);
    overflow: hidden;
}

.card:hover, .appointment-form:hover, .job-listing:hover {
    box-shadow: var(--hover-shadow);
    transform: translateY(-5px);
}

/* Button Styling */
.btn-primary {
    border-radius: 30px;
    font-weight: 600;
    background: var(--gradient-accent);
    border: none;
    transition: var(--transition-smooth);
}

.btn-primary:hover {
    box-shadow: var(--button-shadow);
    transform: translateY(-2px);
}

.btn-outline-primary {
    background: transparent;
    color: var(--primary-light);
    border: 2px solid var(--primary-light);
    border-radius: 30px;
    font-weight: 600;
    transition: var(--transition-smooth);
}

.btn-outline-primary:hover {
    background: var(--primary-light);
    color: white;
    box-shadow: var(--button-shadow);
    transform: translateY(-2px);
}

/* Heading Styles with Gradient Text */
h1, h2, h3, h4, h5 {
    font-weight: 700;
    background: var(--gradient-accent);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Table Styling */
.table-primary {
    background: var(--gradient-accent) !important;
    color: #fff;
}

/* Accordion Styling */
.accordion-button:not(.collapsed) {
    background: var(--gradient-accent);
    color: white;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: var(--light-color);
}

::-webkit-scrollbar-thumb {
    background: var(--primary-light);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--primary-dark);
}