/* Custom styles to complement TailwindCSS */
.custom-file-upload {
    @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500;
}

.custom-file-input::-webkit-file-upload-button {
    @apply hidden;
}

.file-upload-wrapper {
    @apply relative;
}

.file-upload-button {
    @apply absolute inset-y-0 right-0 px-4 py-2 bg-indigo-600 text-white font-semibold rounded-r-md cursor-pointer hover:bg-indigo-700 transition-colors;
}

.form-error {
    @apply text-red-500 text-sm mt-1;
}

.flash-message {
    @apply p-4 mb-4 rounded;
}

.flash-success {
    @apply bg-green-100 text-green-800 border border-green-200;
}

.flash-error {
    @apply bg-red-100 text-red-800 border border-red-200;
}

/* Hero section animation */
@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-animate {
    animation: fadeIn 0.8s ease-out;
}

.hero-animate-delay {
    animation: fadeIn 0.8s ease-out 0.3s forwards;
    opacity: 0;
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .container {
        @apply px-4;
    }
}

/* Final Answer markdown styling */
.markdown {
  line-height: 1.65;
  font-size: 0.98rem;
  color: #1e293b;
}
.markdown h1,.markdown h2,.markdown h3,.markdown h4 {
  font-weight: 700; margin: 1.1rem 0 .5rem;
  color: #0f172a;
}
.markdown h1 { font-size: 1.55rem; }
.markdown h2 { font-size: 1.3rem; border-bottom: 1px solid rgba(0,0,0,.08); padding-bottom:.25rem; }
.markdown h3 { font-size: 1.12rem; }
.markdown p, .markdown ul, .markdown ol, .markdown blockquote, .markdown table {
  margin: .65rem 0;
}
.markdown ul { padding-left: 1.25rem; list-style: disc; }
.markdown ol { padding-left: 1.25rem; list-style: decimal; }
.markdown li { margin: .25rem 0; }
.markdown code {
  background: rgba(15,23,42,.08); padding: .15rem .35rem; border-radius: .35rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: .92em;
  color: #0f172a;
}
.markdown pre {
  position: relative;
  background: #0f1629; border: 1px solid #1f2a44; border-radius: .75rem;
  padding: 1rem; overflow: auto; margin: .85rem 0;
}
.markdown pre > code { background: transparent; padding: 0; color: #e6eefb; }
.markdown a { color: #0ea5e9; text-decoration: none; }
.markdown a:hover { text-decoration: underline; }
.markdown hr { border: none; border-top: 1px solid rgba(0,0,0,.08); margin: 1rem 0; }
.markdown blockquote {
  border-left: 3px solid #0ea5e9; background: rgba(14,165,233,.07);
  padding: .6rem .8rem; border-radius: .35rem; color: #0f172a;
}
.markdown .callout {
  border-left: 3px solid #fbbf24; background: rgba(251,191,36,.08);
  padding: .6rem .8rem; border-radius: .35rem;
}
.markdown .good {
  border-left: 3px solid #10b981; background: rgba(16,185,129,.08);
  padding: .6rem .8rem; border-radius: .35rem;
}
.markdown table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
}
.markdown table th,
.markdown table td {
  border: 1px solid rgba(0,0,0,.08);
  padding: .5rem .75rem;
  text-align: left;
}
.markdown table th {
  background: rgba(15,23,42,.05);
  font-weight: 600;
}
.copy-code {
  position: absolute; top: .5rem; right: .5rem;
  padding: .2rem .45rem; font-size: .75rem; border: 1px solid #1f2a44;
  border-radius: .35rem; background: rgba(255,255,255,.04); cursor: pointer;
  color: #e6eefb;
}
.copy-code:hover {
  background: rgba(255,255,255,.08);
}