/* =====================================================================
   JSTE custom theme
   Converted from the original Tailwind/shadcn HSL design tokens into
   plain CSS variables + Bootstrap 5 overrides.
   ===================================================================== */

:root {
  --background: #fbfaf7;
  --foreground: #191d24;

  --card: #ffffff;
  --card-foreground: #191d24;

  --primary: #1a5566;          /* deep teal */
  --primary-foreground: #fbfaf7;
  --primary-dark: #16303f;

  --secondary: #f3f0e8;
  --secondary-foreground: #191d24;

  --muted: #f2efe7;
  --muted-foreground: #71767d;

  --accent: #e0932a;           /* warm gold */
  --accent-foreground: #191d24;

  --destructive: #d92b2b;
  --destructive-foreground: #fbfaf7;

  --success: #29915a;
  --warning: #e0932a;
  --info: #3182b5;

  --border: #e1e4e9;

  --radius: 0.5rem;

  --hero-gradient: linear-gradient(135deg, #1a5566, #16232f);
  --card-shadow: 0 1px 3px rgba(25, 29, 36, 0.06), 0 1px 2px rgba(25, 29, 36, 0.06);
  --card-shadow-hover: 0 10px 15px rgba(25, 29, 36, 0.08), 0 4px 6px rgba(25, 29, 36, 0.06);

  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Source Sans 3', 'Segoe UI', sans-serif;

  /* Map onto Bootstrap's own variables so utility classes pick these up */
  --bs-primary: var(--primary);
  --bs-primary-rgb: 26, 85, 102;
  --bs-body-font-family: var(--font-body);
  --bs-body-color: var(--foreground);
  --bs-body-bg: var(--background);
  --bs-border-radius: var(--radius);
}

body {
  font-family: var(--font-body);
  background-color: var(--background);
  color: var(--foreground);
}

.font-display,
h1, h2, h3, h4, .navbar-brand {
  font-family: var(--font-display);
}

a { color: var(--primary); }
a:hover { color: var(--accent); }

/* ---- Buttons ---------------------------------------------------- */
.btn-primary {
  background-color: var(--primary);
  border-color: var(--primary);
  color: var(--primary-foreground);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--primary-dark);
  border-color: var(--primary-dark);
}
.btn-accent {
  background-color: var(--accent);
  border-color: var(--accent);
  color: var(--accent-foreground);
}
.btn-outline-primary {
  color: var(--primary);
  border-color: var(--primary);
}
.btn-outline-primary:hover {
  background-color: var(--primary);
  color: var(--primary-foreground);
}

/* ---- Navbar ------------------------------------------------------- */
.navbar-jste {
  background-color: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 1030;
}
.navbar-jste .nav-link {
  color: var(--muted-foreground);
  font-weight: 500;
  border-radius: var(--radius);
  padding: 0.5rem 0.75rem;
}
.navbar-jste .nav-link.active,
.navbar-jste .nav-link:hover {
  background-color: var(--secondary);
  color: var(--foreground);
}

/* ---- Hero ----------------------------------------------------------- */
.hero-section {
  background: var(--hero-gradient);
  color: var(--primary-foreground);
}

/* ---- Cards ---------------------------------------------------------- */
.card-jste {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--card-shadow);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.card-jste:hover {
  box-shadow: var(--card-shadow-hover);
  transform: translateY(-2px);
}

/* ---- Badges / status pills ------------------------------------------ */
.badge-status-submitted        { background: #e6eef1; color: #1a5566; }
.badge-status-under_review     { background: #fdf1de; color: #8a5a13; }
.badge-status-revision_requested { background: #fdf1de; color: #8a5a13; }
.badge-status-accepted         { background: #e3f3ea; color: #1c6b41; }
.badge-status-published        { background: #e3f3ea; color: #1c6b41; }
.badge-status-rejected         { background: #fbe7e7; color: #a41f1f; }

/* ---- Footer ----------------------------------------------------------- */
.footer-jste {
  background: var(--card);
  border-top: 1px solid var(--border);
}
.footer-jste a {
  color: var(--muted-foreground);
  text-decoration: none;
}
.footer-jste a:hover { color: var(--primary); }

/* ---- Dashboard sidebar ------------------------------------------------- */
.sidebar-jste {
  background: var(--card);
  border-right: 1px solid var(--border);
  min-height: calc(100vh - 64px);
}
.sidebar-jste .nav-link {
  color: var(--muted-foreground);
  border-radius: var(--radius);
  padding: 0.6rem 0.9rem;
  margin-bottom: 0.15rem;
}
.sidebar-jste .nav-link.active {
  background: var(--primary);
  color: var(--primary-foreground);
}
.sidebar-jste .nav-link:hover:not(.active) {
  background: var(--secondary);
  color: var(--foreground);
}

/* AOS-safe: avoid layout shift before JS initializes */
[data-aos] { pointer-events: auto; }