/* CUNIMA Admission Portal - Main Stylesheet */

:root {
    --primary: #1e3a8a;
    --primary-dark: #1e293b;
    --secondary: #3b82f6;
    --accent: #60a5fa;
    --light: #f8f9fa;
    --dark: #212529;
    --success: #28a745;
    --warning: #ffc107;
    --danger: #dc3545;
    --info: #17a2b8;
    --gray: #6c757d;
    --gray-light: #e9ecef;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Georgia', serif;
    line-height: 1.6;
    color: var(--dark);
    overflow-x: hidden;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Crimson Text', serif;
    font-weight: 700;
    line-height: 1.2;
}

/* Parallax Hero Section */
.parallax-hero {
    position: relative;
    height: 100vh;
    background-image: linear-gradient(rgba(30, 58, 138, 0.85), rgba(30, 41, 59, 0.9)), 
                      url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 600"><rect fill="%231e3a8a" width="1200" height="600"/><path fill="%231e293b" d="M0 300L50 283.3C100 266.7 200 233.3 300 216.7C400 200 500 200 600 216.7C700 233.3 800 266.7 900 283.3C1000 300 1100 300 1150 300L1200 300L1200 601L1150 601C1100 601 1000 601 900 601C800 601 700 601 600 601C500 601 400 601 300 601C200 601 100 601 50 601L0 601Z"/></svg>');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-align: center;
}

.hero-content {
    z-index: 2;
    padding: 2rem;
    animation: fadeInUp 1s ease-out;
}

.hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 1rem;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
    letter-spacing: 2px;
}

.hero-content .subtitle {
    font-size: 1.5rem;
    margin-bottom: 2rem;
    opacity: 0.95;
    font-family: 'Georgia', serif;
}

.hero-cta {
    display: inline-block;
    padding: 15px 40px;
    background: var(--secondary);
    color: var(--primary-dark);
    text-decoration: none;
    border-radius: 50px;
    font-weight: bold;
    font-size: 1.1rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
}

.hero-cta:hover {
    background: var(--accent);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.5);
    color: white;
}

/* Navigation */
.navbar {
    background: var(--primary) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    padding: 1rem 0;
}

.navbar-brand {
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--secondary) !important;
    font-family: 'Crimson Text', serif;
}

.navbar-nav .nav-link {
    color: rgba(255,255,255,0.9) !important;
    margin: 0 10px;
    transition: color 0.3s ease;
    font-weight: 500;
}

.navbar-nav .nav-link:hover {
    color: var(--secondary) !important;
}

.btn-login, .btn-register {
    border-radius: 25px;
    padding: 8px 25px;
    margin-left: 10px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-login {
    background: transparent;
    border: 2px solid var(--secondary);
    color: var(--secondary);
}

.btn-login:hover {
    background: var(--secondary);
    color: var(--primary-dark);
}

.btn-register {
    background: var(--secondary);
    border: 2px solid var(--secondary);
    color: var(--primary-dark);
}

.btn-register:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: white;
}

/* Section Styling */
.section {
    padding: 80px 0;
    position: relative;
}

.section-light {
    background: #ffffff;
}

.section-dark {
    background: var(--gray-light);
}

.section-title {
    font-size: 2.5rem;
    color: var(--primary);
    margin-bottom: 1rem;
    position: relative;
    display: inline-block;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 60px;
    height: 4px;
    background: var(--secondary);
}

/* Programme Info Cards */
.info-card {
    background: white;
    padding: 2rem;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
    margin-bottom: 2rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-left: 4px solid var(--primary);
}

.info-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.15);
}

.info-card h3 {
    color: var(--primary);
    margin-bottom: 1rem;
    font-size: 1.5rem;
}

.info-card .highlight {
    color: var(--secondary);
    font-weight: bold;
    font-size: 1.3rem;
}

/* Payment Warning Box */
.payment-warning {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    padding: 2rem;
    border-radius: 10px;
    margin: 2rem 0;
    box-shadow: 0 5px 20px rgba(220, 53, 69, 0.3);
    animation: pulse 2s infinite;
}

.payment-warning h4 {
    color: white;
    margin-bottom: 1rem;
    font-size: 1.8rem;
}

.payment-warning ul {
    list-style: none;
    padding-left: 0;
}

.payment-warning li {
    padding: 0.5rem 0;
    font-size: 1.1rem;
}

.payment-warning .warning-icon {
    font-size: 3rem;
    margin-bottom: 1rem;
}

/* Banking Info Table */
.bank-table {
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
    margin: 2rem 0;
}

.bank-table table {
    width: 100%;
    margin: 0;
}

.bank-table th {
    background: var(--primary);
    color: white;
    padding: 1rem;
    font-weight: 600;
    text-align: left;
}

.bank-table td {
    padding: 1rem;
    border-bottom: 1px solid var(--gray-light);
}

.bank-table tr:last-child td {
    border-bottom: none;
}

.bank-table tr:hover {
    background: #f8f9fa;
}

/* Forms */
.form-container {
    background: white;
    padding: 3rem;
    border-radius: 15px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.1);
    margin: 2rem 0;
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-label {
    font-weight: 600;
    color: var(--primary);
    margin-bottom: 0.5rem;
    display: block;
}

.form-control {
    border: 2px solid var(--gray-light);
    border-radius: 8px;
    padding: 12px 15px;
    transition: border-color 0.3s ease;
    font-size: 1rem;
}

.form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 0.2rem rgba(26, 71, 42, 0.25);
    outline: none;
}

.btn-primary-custom {
    background: var(--primary);
    border: none;
    color: white;
    padding: 12px 40px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1.1rem;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-primary-custom:hover {
    background: var(--primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(26, 71, 42, 0.3);
}

/* Status Badge */
.status-badge {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.9rem;
}

.status-submitted {
    background: var(--info);
    color: white;
}

.status-accounts-verified {
    background: #17a2b8;
    color: white;
}

.status-under-review {
    background: var(--warning);
    color: var(--dark);
}

.status-accepted {
    background: var(--success);
    color: white;
}

.status-rejected {
    background: var(--danger);
    color: white;
}

/* Footer */
.footer {
    background: var(--primary-dark);
    color: white;
    padding: 3rem 0 1rem;
    margin-top: 4rem;
}

.footer h5 {
    color: var(--secondary);
    margin-bottom: 1rem;
}

.footer a {
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer a:hover {
    color: var(--secondary);
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    margin-top: 2rem;
    padding-top: 1rem;
    text-align: center;
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pulse {
    0%, 100% {
        box-shadow: 0 5px 20px rgba(220, 53, 69, 0.3);
    }
    50% {
        box-shadow: 0 5px 30px rgba(220, 53, 69, 0.5);
    }
}

/* Alert Messages */
.alert-custom {
    padding: 1rem 1.5rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    border-left: 4px solid;
}

.alert-success {
    background: #d4edda;
    border-color: var(--success);
    color: #155724;
}

.alert-error {
    background: #f8d7da;
    border-color: var(--danger);
    color: #721c24;
}

.alert-info {
    background: #d1ecf1;
    border-color: var(--info);
    color: #0c5460;
}

/* Responsive Design */
@media (max-width: 768px) {
    .hero-content h1 {
        font-size: 2rem;
    }
    
    .hero-content .subtitle {
        font-size: 1.1rem;
    }
    
    .section {
        padding: 50px 0;
    }
    
    .section-title {
        font-size: 2rem;
    }
    
    .form-container {
        padding: 2rem 1.5rem;
    }
}

/* Loading Spinner */
.spinner {
    border: 3px solid var(--gray-light);
    border-top: 3px solid var(--primary);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
    margin: 2rem auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}