/* Custom styling enhancements for Ankavidya Antique Dull Gold & Warm Parchment Theme */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Outfit:wght@400;500;600;700;800;900&display=swap');

:root {
  --canvas-bg: #f6eedd;
  --accent-gold: #d4af37;
  --dull-gold-dark: #2a1d07;
  --saffron-primary: #d97706;
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background-color: #f6eedd;
  background-image:
    linear-gradient(rgba(246, 238, 221, 0.80), rgba(246, 238, 221, 0.80)),
    url('/static/images/astro-bg.jpg');
  background-repeat: repeat;
  background-size: auto, 350px;
  background-attachment: fixed;
  color: #0f172a;
}

h1,
h2,
h3,
h4,
h5,
.font-heading {
  font-family: 'Outfit', 'Inter', system-ui, sans-serif;
}

/* Actionable White Input Card */
.action-input-card {
  background-color: #ffffff !important;
  border: 2px solid #f59e0b !important;
  border-radius: 1rem;
  box-shadow: 0 4px 20px -2px rgba(217, 119, 6, 0.15), 0 2px 6px -1px rgba(0, 0, 0, 0.05);
}

/* Read-Only Muted Amber Parchment Card */
.readonly-parchment-card {
  background-color: #fef8eb !important;
  border: 1px solid rgba(245, 158, 11, 0.4) !important;
  border-radius: 1rem;
  box-shadow: 0 2px 10px -2px rgba(180, 83, 9, 0.06);
}

/* Antique Dull Gold & Dark Orange Prediction Container */
.dull-gold-container {
  background: linear-gradient(135deg, #2a1d07 0%, #38260a 50%, #241704 100%) !important;
  border: 2px solid #d4af37 !important;
  border-radius: 1.5rem;
  box-shadow: 0 20px 45px -10px rgba(42, 29, 7, 0.4), 0 0 30px rgba(212, 175, 55, 0.12);
  color: #fef3c7;
}

/* Radiant grade glow effects */
.grade-badge-emerald {
  background: linear-gradient(135deg, #059669 0%, #047857 100%);
  border: 2px solid #34d399;
  box-shadow: 0 4px 15px rgba(5, 150, 105, 0.35);
  color: #ffffff;
}

.grade-badge-amber {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
  border: 2px solid #fcd34d;
  box-shadow: 0 4px 15px rgba(217, 119, 6, 0.35);
  color: #ffffff;
}

.grade-badge-rose {
  background: linear-gradient(135deg, #be123c 0%, #9f1239 100%);
  border: 2px solid #fda4af;
  box-shadow: 0 4px 15px rgba(190, 18, 60, 0.35);
  color: #ffffff;
}

/* HTMX Loading Indicator Animations */
.htmx-indicator {
  display: none !important;
}

.htmx-request.htmx-indicator,
.htmx-request .htmx-indicator,
#loading-indicator.htmx-request,
.htmx-request #loading-indicator {
  display: flex !important;
  animation: slideUpFade 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Smooth Reveal Animations */
@keyframes slideUpFade {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-reveal {
  animation: slideUpFade 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-fade-in {
  animation: slideUpFade 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.htmx-swapping {
  opacity: 0;
  transition: opacity 150ms ease-out;
}

.htmx-settling {
  opacity: 1;
  transition: opacity 250ms ease-in;
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #ede0c8;
}

::-webkit-scrollbar-thumb {
  background: #d4af37;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #b45309;
}

/* Semantic Status Badges & Progress Bars */
.status-badge-favourable {
  background-color: #d1fae5 !important; /* bg-emerald-100 */
  color: #064e3b !important; /* text-emerald-900 */
  border: 1px solid #a7f3d0 !important; /* border-emerald-200 */
}

.status-badge-neutral {
  background-color: #fef3c7 !important; /* bg-amber-100 */
  color: #78350f !important; /* text-amber-900 */
  border: 1px solid #fde68a !important; /* border-amber-200 */
}

.status-badge-caution {
  background-color: #ffe4e6 !important; /* bg-rose-100 */
  color: #4c0519 !important; /* text-rose-900 */
  border: 1px solid #fecdd3 !important; /* border-rose-200 */
}

.status-badge-info {
  background-color: #f1f5f9 !important; /* bg-slate-100 */
  color: #334155 !important; /* text-slate-700 */
  border: 1px solid #cbd5e1 !important; /* border-slate-200 */
}


.progress-fill-favourable {
  background-color: #10b981 !important; /* bg-emerald-500 */
}

.progress-fill-neutral {
  background-color: #f59e0b !important; /* bg-amber-500 */
}

.progress-fill-caution {
  background-color: #f43f5e !important; /* bg-rose-500 */
}

/* Theme Overrides & Surface Variants */
.theme-override-dark-ephemeris {
  background-color: #0f172a !important; /* bg-slate-900 */
  border: 1px solid #334155 !important; /* border-slate-700 */
  color: #f8fafc !important; /* text-slate-50 */
}

.theme-override-gold-luxury {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important; /* saffron/gold gradient */
  border: 1px solid #fbbf24 !important; /* border-amber-400 */
  color: #78350f !important; /* text-amber-900 */
}

/* Semantic Status Cards */
.status-card-favourable {
  background-color: rgba(236, 253, 245, 0.5) !important; /* bg-emerald-50/50 */
  border-color: #a7f3d0 !important; /* border-emerald-200 */
  --tw-ring-color: #a7f3d0 !important; /* ring-emerald-200 */
  color: #064e3b;
}

.status-card-neutral {
  background-color: rgba(254, 243, 199, 0.5) !important; /* bg-amber-50/50 */
  border-color: #fde68a !important; /* border-amber-200 */
  --tw-ring-color: #fde68a !important; /* ring-amber-200 */
  color: #78350f;
}

.status-card-caution {
  background-color: rgba(255, 241, 242, 0.5) !important; /* bg-rose-50/50 */
  border-color: #fecdd3 !important; /* border-rose-200 */
  --tw-ring-color: #fecdd3 !important; /* ring-rose-200 */
  color: #4c0519;
}

.status-card-info {
  background-color: rgba(241, 245, 249, 0.5) !important; /* bg-slate-50/50 */
  border-color: #cbd5e1 !important; /* border-slate-200 */
  --tw-ring-color: #cbd5e1 !important; /* ring-slate-200 */
  color: #334155; /* text-slate-700 */
}


/* Specific Status Scorecards (White background with status borders/rings) */
.status-scorecard-favourable {
  background-color: #ffffff !important;
  border-color: #10b981 !important;
  --tw-ring-color: #10b981 !important;
  color: #064e3b !important;
}

.status-scorecard-neutral {
  background-color: #ffffff !important;
  border-color: #f59e0b !important;
  --tw-ring-color: #f59e0b !important;
  color: #78350f !important;
}

.status-scorecard-caution {
  background-color: #ffffff !important;
  border-color: #f43f5e !important;
  --tw-ring-color: #f43f5e !important;
  color: #4c0519 !important;
}