body {
    background-color: #f8f9fa;
    color: #181111; /* White text for body */
    font-family: Arial, sans-serif;
}

.navbar {
    background-color: #4B5320; /* Army green */
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.navbar-brand, .nav-link {
    color: #31ab08 !important; /* White text for navbar */
}

.navbar-brand:hover, .nav-link:hover {
    color: #FFD700 !important; /* Lighter golden yellow for hover */
}

.container {
    max-width: 960px; /* Fixed width for centered content */
    margin: 0 auto;
    padding: 20px;
}

.banner {
    background-color: #4B5320; /* Army green */
    color: #0f0a0a; /* White text for banner */
    padding: 20px;
    text-align: center;
    border-radius: 8px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.banner .logo {
    max-width: 120px;
    height: auto;
    margin-bottom: 15px;
    color: #FFFFFF; /* White text for text-based logo */
}

.banner h2 {
    margin: 0;
    font-size: 1.8rem;
    color: #dfce19; /* White text */
}

.banner p {
    margin: 5px 0 0;
    font-size: 1rem;
    color: #FFFFFF; /* White text */
}

.sidebar, .sidebar-stats {
    background-color: #4B5320; /* Army green */
    color: #FFFFFF; /* White text for sidebars */
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.sidebar h3, .sidebar-stats h3 {
    font-size: 1.2rem;
    margin-bottom: 15px;
    color: #FFD700; /* Lighter golden yellow for headings */
}

.sidebar p, .sidebar ul, .sidebar-stats p {
    font-size: 0.9rem;
    color: #FFFFFF; /* White text */
}

.sidebar-stats .btn {
    background-color: #4B5320; /* Army green */
    border-color: #D4A017; /* Golden yellow border */
    color: #FFFFFF; /* White text */
    width: 100%;
    margin-top: 10px;
}

.sidebar-stats .btn:hover {
    background-color: #3C421A; /* Darker army green */
    border-color: #FFD700; /* Lighter golden yellow */
    color: #FFD700; /* Lighter golden yellow text */
}

.sidebar-stats .flash-red {
    color: #FFFFFF; /* Red for flashing text */
    animation: blink 1.5s infinite;
}

@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0.3; }
    100% { opacity: 1; }
}

.btn-primary {
    background-color: #4B5320; /* Army green */
    border-color: #4B5320;
    color: #FFFFFF; /* White text */
}

.btn-primary:hover {
    background-color: #3C421A; /* Darker army green */
    border-color: #3C421A;
    color: #FFD700; /* Lighter golden yellow text */
}

.table thead {
    background-color: #4B5320; /* Army green */
    color: #FFFFFF; /* White text */
}

.table tbody {
    color: #FFFFFF; /* White text for table body */
}

.table tbody tr:hover {
    background-color: #3C421A; /* Darker army green on hover */
}

.search-form {
    background-color: #4B5320; /* Army green */
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.search-form label {
    color: #FFFFFF; /* White text */
    margin-right: 10px;
}

.search-form input, .search-form select {
    background-color: #f8f9fa;
    color: #333;
    border: 1px solid #D4A017; /* Golden yellow border */
}

.search-form .btn {
    background-color: #4B5320; /* Army green */
    border-color: #D4A017; /* Golden yellow border */
    color: #FFFFFF; /* White text */
}

.search-form .btn:hover {
    background-color: #3C421A; /* Darker army green */
    border-color: #FFD700; /* Lighter golden yellow */
    color: #FFD700; /* Lighter golden yellow text */
}
.login-box {
    background-color: #4B5320; /* Army green */
    color: #FFFFFF; /* White text */
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    margin: 0 auto;
    max-width: 500px; /* Fixed width for login box */
}

.login-box .logo {
    max-width: 50px; /* Match banner logo size */
    height: auto;
    margin: 0 auto 15px;
    display: block;
}

.login-box label {
    color: #FFFFFF; /* White text */
}

.login-box input {
    background-color: #f8f9fa;
    color: #333;
    border: 1px solid #D4A017; /* Golden yellow border */
}

.login-box .btn {
    background-color: #4B5320; /* Army green */
    border-color: #D4A017; /* Golden yellow border */
    color: #FFFFFF; /* White text */
    width: 100%;
}

.login-box .btn:hover {
    background-color: #3C421A; /* Darker army green */
    border-color: #FFD700; /* Lighter golden yellow */
    color: #FFD700; /* Lighter golden yellow text */
}

.login-box .alert {
    color: #FF0000; /* Red for error messages */
}

/* Default Sidebar Style */
.sidebar {
    background-color: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Alternative Sidebar Style for is_medical and is_acceptance = 0 */
.sidebar-alt {
    background-color: #ffe6e6; /* Light red background */
    padding: 20px;
    border: 2px solid #dc3545; /* Red border */
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    color: #333;
}



.sidebar-alt ul li {
    color: #333;
    font-weight: 500;
    margin-bottom: 10px;
}

.sidebar-alt p {
    color: #dc3545; /* Red text for contact info */
    font-weight: 500;
}

.form_style 
    {
    width:500px;
    margin:50px ;
    float:right;
    top:-40px;
}

.footer {
            background-color: #4B5320; /* Army green */
            color: #FFFFFF;
            text-align: center;
            padding: 15px 0;
            width: 100%;
            position: relative;
            margin-top: 20px; /* Space above footer */
            flex-shrink: 0; /* Prevent footer from shrinking */
}

.footer p {
            margin: 0;
            font-size: 0.9rem;
        }
        
 @media print {
            body * { visibility: hidden; }
            .print-content, .print-content * { visibility: visible; }
            .print-content { position: absolute; top: 0; left: 0; width: 100%; }
            .instructions-sidebar, .btn-toggle-sidebar, .footer { display: none !important; }
        }
        
    .container-message {
            overflow: hidden;               /* fallback clearfix */
            display: flex;                   /* Flexbox layout */
            align-items: flex-start;         /* align tops */
            max-width: 800px;
            margin: 20px auto;
            padding: 15px;
            border: 1px solid #ddd;
            border-radius: 8px;
            background-color: #f9f9f9;
        }
        
    .profile-img {
            flex: 0 0 150px;                 /* fixed width */
            height: 200px;
            margin-right: 20px;
            border: 2px solid #ddd;
            object-fit: cover;
        }

        .message-box {
            flex: 1;                         /* take all remaining space */
            line-height: 1.5;
        }

        .message-box h4 {
            margin: 0 0 10px 0;
            color: #333;
            font-size: 1.4em;
        }

        .message-box p {
            margin: 0 0 12px 0;
            color: #555;
            font-size: 1em;
        }