﻿/*body {
    background-color: #e6f2ff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.login-container {
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.login-left {
    background: url('/images/karnataka_logo.jpg') center/cover;
    min-height: 400px;
    position: relative;
}

.login-right {
    background: url('../images/dtelogo.jpg') center/cover;
    min-height: 400px;
    position: relative;
}

.overlay {
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

.bte-kannada {
    font-family: 'Kannada', 'Tunga', sans-serif;
    font-size: 2.5rem;
    font-weight: bold;
}

.form-container {
    padding: 2rem;
}

.user-type-indicator {
    font-size: 0.9rem;
    margin-top: -10px;
    margin-bottom: 15px;
    color: #4361ee;
    font-weight: 500;
}

.captcha-box {
    display: inline-block !important;
    width: 100px !important;
    height: 40px !important;
    background: linear-gradient(to right, orange, red) !important;
    font-size: 22px !important;
    text-align: center !important;
    line-height: 40px !important;
    font-weight: bold !important;
    color: white !important;
    border-radius: 8px !important;
    user-select: none;
}


.captcha-container {
    margin-top: 20px;
    margin-bottom: 20px;
}
*/

/* Base setup */
html, body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f5f5f5;
}
/* Heading section */
.heading-section {
    background-color: #e6f2ff;
    color: #003366;
    padding: 1rem;
    text-align: center;
    flex-shrink: 0;
}

.bte-kannada {
    font-family: 'Kannada', 'Tunga', sans-serif;
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
    color: #003366;
}

.heading-overlay h2, .heading-overlay h3 {
    margin: 0.3rem 0;
    color: #003366;
}


/* Main layout container */
.full-screen-container {
    display: flex;
    flex: 1;
    margin: 2vh 5vw;
    border-radius: 20px;
    overflow: hidden;
}

/* Left panel with heading overlay */
.left-panel {
    flex: 1;
    position: relative;
    background-image: url('/images/vida_soudha.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 20px 0 0 20px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 2rem;
}

/* Make heading feel embedded */
.heading-overlay {
    position: absolute;
    top: 2rem;
    left: 2rem;
    right: 2rem;
    padding: 0;
    background: none; /* No overlay */
    text-align: center;
    z-index: 2;
}

    .heading-overlay h1,
    .heading-overlay h2,
    .heading-overlay h3 {
        margin: 0.5rem 0;
        font-weight: 600;
        color: #002147; /* Deep navy blue */
        text-shadow: 1px 1px 3px rgba(0,0,0,0.6); /* Adds contrast for readability */
    }

/* Animation keyframes */
@keyframes fadeScaleUp {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(-20px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.heading-overlay {
    animation: fadeScaleUp 1.2s ease-out 0.3s;
}






/* Right panel */
/* Right panel */
.right-panel {
    flex: 1;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 20px 20px 0;
    padding: 2rem;
}

/* Login box */
/*
.login-container {
    width: 100%;
    max-width: 400px;
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    padding: 30px;
}
*/

.login-container {
    width: 100%;
    max-width: 480px; /* Increased from 400px */
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    padding: 40px; /* Increased from 30px */
}

/* Tabs styling */
.nav-tabs .nav-link {
    font-weight: 600;
    color: #333;
    border: 1px solid #dee2e6;
}

    .nav-tabs .nav-link.active {
        background-color: #0d6efd;
        color: #fff;
        border-color: #0d6efd;
    }

/* Form labels */
.form-label {
    font-weight: 600;
}

/* Captcha styling */
.captcha-container {
    margin-top: 20px;
    margin-bottom: 20px;
}

.captcha-box {
    display: inline-block;
    width: 140px; /* reduced width */
    height: 45px; /* reduced height */
    background: linear-gradient(to right, orange, red);
    font-size: 30px; /* slightly smaller font */
    line-height: 45px; /* match height for vertical centering */
    font-weight: bold;
    color: white;
    border-radius: 6px;
    user-select: none;
    overflow: hidden; /* prevents spill */
    text-align: center; /* keep captcha centered */
}

/* Force text color and background */
.captcha-style-1 {
    background: linear-gradient(45deg, #ff9a9e, #fad0c4) !important;
    color: #002147 !important;
}

.captcha-style-2 {
    background: linear-gradient(45deg, #a18cd1, #fbc2eb) !important;
    color: #002147 !important;
}

.captcha-style-3 {
    background: linear-gradient(45deg, #f6d365, #fda085) !important;
    color: #002147 !important;
}

.captcha-style-4 {
    background: linear-gradient(45deg, #84fab0, #8fd3f4) !important;
    color: #002147 !important;
}

.captcha-style-5 {
    background: linear-gradient(45deg, #cfd9df, #e2ebf0) !important;
    color: #002147 !important;
}



/* User type indicator */
.user-type-indicator {
    font-size: 0.9rem;
    margin-top: -10px;
    margin-bottom: 15px;
    color: #4361ee;
    font-weight: 500;
}

/* Error labels */
.text-danger {
    font-size: 0.875rem;
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .full-screen-container {
        flex-direction: column;
        height: auto;
        margin: 2vh 5vw;
    }

    .left-panel, .right-panel {
        border-radius: 20px;
        flex: none;
        height: 300px;
    }

    .right-panel {
        height: auto;
        padding: 1rem;
    }
}
