/* Academic International University Portal Styling */

/* Base Font Override */
body {
    font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, .font-serif {
    font-family: 'Merriweather', Georgia, serif;
}

/* Custom Input Fields */
.input-field {
    width: 100%;
    padding: 0.65rem 1rem;
    border-radius: 0.375rem; /* rounded-md */
    border: 1px solid #cbd5e1; /* slate-300 */
    background-color: #ffffff;
    color: #0f172a; /* slate-900 */
    font-size: 0.875rem;
    transition: all 0.2s ease;
}

.input-field:focus {
    outline: none;
    border-color: #0A124D; /* Midnight Navy */
    box-shadow: 0 0 0 1.5px #0A124D;
}

.input-field-sm {
    width: 100%;
    padding: 0.45rem 0.85rem;
    border-radius: 0.375rem;
    border: 1px solid #cbd5e1;
    background-color: #ffffff;
    color: #0f172a;
    font-size: 0.825rem;
    transition: all 0.2s ease;
}

.input-field-sm:focus {
    outline: none;
    border-color: #0A124D; /* Midnight Navy */
    box-shadow: 0 0 0 1.5px #0A124D;
}

/* Form Section Transitions */
.form-step {
    animation: fadeIn 0.35s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Dark Mode Overrides */
.dark body {
    background-color: #0f172a !important; /* slate-900 */
    color: #f1f5f9 !important; /* slate-100 */
}

.dark header {
    background-color: #1e293b !important; /* slate-800 */
    border-color: #334155 !important; /* slate-700 */
}

.dark .bg-white {
    background-color: #1e293b !important; /* slate-800 */
}

.dark .bg-slate-50 {
    background-color: #0f172a !important; /* slate-900 */
    border-color: #334155 !important;
}

.dark .bg-slate-100 {
    background-color: #334155 !important; /* slate-700 */
}

.dark .border-slate-200, 
.dark .border-slate-200\/60,
.dark .border-slate-300,
.dark .border-slate-100 {
    border-color: #334155 !important;
}

.dark h2, .dark h1.text-lg {
    color: #f8fafc !important;
    border-color: #334155 !important;
}

.dark h2 i, .dark h1.text-lg i, .dark h4 i {
    color: #818cf8 !important; /* Indigo-400 */
}

.dark label {
    color: #cbd5e1 !important; /* slate-300 */
}

.dark .text-slate-800 {
    color: #f1f5f9 !important;
}

.dark .text-slate-700 {
    color: #cbd5e1 !important;
}

.dark .text-slate-600 {
    color: #cbd5e1 !important;
}

.dark .text-slate-500 {
    color: #94a3b8 !important;
}

.dark .text-slate-400 {
    color: #64748b !important;
}

.dark .text-accent {
    color: #818cf8 !important;
}

.dark .text-indigo-600 {
    color: #818cf8 !important;
}

/* Specific component overrides */
.dark #photoUploadContainer {
    background-color: #0f172a !important;
    border-color: #475569 !important;
}

.dark #photoUploadContainer p {
    color: #94a3b8 !important;
}

.dark .bg-yellow-50 {
    background-color: rgba(120, 53, 4, 0.2) !important;
    border-color: rgba(120, 53, 4, 0.4) !important;
}

.dark .text-yellow-900 {
    color: #fde047 !important; /* Amber-300 */
}

.dark #prevBtn {
    border-color: #475569 !important;
    color: #cbd5e1 !important;
}

.dark #prevBtn:hover {
    background-color: #334155 !important;
}

.dark #saveDraftBtn {
    background-color: #334155 !important;
    color: #cbd5e1 !important;
    border-color: #475569 !important;
}

.dark #saveDraftBtn:hover {
    background-color: #475569 !important;
}

/* Modals */
.dark #successModalContent {
    background-color: #1e293b !important;
    border: 1px solid #334155 !important;
}

/* Dynamic status cards in tracking page */
.dark #resSymbol {
    background-color: rgba(99, 102, 241, 0.15) !important;
    color: #818cf8 !important;
    border-color: rgba(99, 102, 241, 0.3) !important;
}

.dark .bg-red-50 {
    background-color: rgba(225, 29, 72, 0.1) !important;
    border-color: rgba(225, 29, 72, 0.25) !important;
    color: #fda4af !important; /* rose-300 */
}

.dark .text-red-850 {
    color: #fda4af !important;
}

.dark .text-red-800 {
    color: #fca5a5 !important;
}

.dark .text-red-500 {
    color: #f43f5e !important;
}

.dark .bg-yellow-100 {
    background-color: rgba(234, 179, 8, 0.15) !important;
    color: #fef08a !important;
    border: 1px solid rgba(234, 179, 8, 0.3) !important;
}

.dark .bg-blue-100 {
    background-color: rgba(59, 130, 246, 0.15) !important;
    color: #93c5fd !important;
    border: 1px solid rgba(59, 130, 246, 0.3) !important;
}

.dark .bg-green-100 {
    background-color: rgba(34, 197, 94, 0.15) !important;
    color: #86efac !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
}

.dark .bg-emerald-100 {
    background-color: rgba(16, 185, 129, 0.15) !important;
    color: #6ee7b7 !important;
    border: 1px solid rgba(16, 185, 129, 0.3) !important;
}

.dark .bg-rose-100 {
    background-color: rgba(244, 63, 94, 0.15) !important;
    color: #fca5a5 !important;
    border: 1px solid rgba(244, 63, 94, 0.3) !important;
}

.dark .input-field {
    background-color: #1e293b; /* slate-800 */
    color: #f8fafc; /* slate-50 */
    border-color: #475569; /* slate-600 */
}
.dark .input-field:focus {
    border-color: #6366f1; /* Indigo */
    box-shadow: 0 0 0 1.5px #6366f1;
}

.dark .input-field-sm {
    background-color: #1e293b;
    color: #f8fafc;
    border-color: #475569;
}
.dark .input-field-sm:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 1.5px #6366f1;
}

/* Print Styles */
@media print {
    body { background: none; }
    .progress-bar, #prevBtn, #nextBtn, #submitBtn, #saveDraftBtn, header, nav, .step-node { display: none !important; }
    .form-step { display: block !important; opacity: 1; }
    .form-step { page-break-inside: avoid; margin-bottom: 20px; }
}