/* Mathematical Finance Quarto Book Styles */

:root {
  --mf-blue: #1f4e79;
  --mf-green: #1f7a5c;
  --mf-gold: #b7791f;
  --mf-slate: #334155;
  --mf-light: #f8fafc;
}

.hero-box {
  padding: 1.35rem 1.6rem;
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(31,78,121,.12), rgba(31,122,92,.10));
  border: 1px solid rgba(31,78,121,.20);
  margin: 1rem 0 1.5rem 0;
}

.chapter-objectives {
  padding: 1rem 1.25rem;
  border-left: 5px solid var(--mf-blue);
  background: rgba(31,78,121,.06);
  border-radius: .6rem;
  margin: 1rem 0 1.4rem 0;
}

.definition, .theorem, .example, .remark {
  padding: 1rem 1.25rem;
  border-radius: .75rem;
  margin: 1rem 0;
  border: 1px solid rgba(100,116,139,.28);
  background: rgba(248,250,252,.75);
}

.theorem {
  border-left: 5px solid var(--mf-green);
}

.definition {
  border-left: 5px solid var(--mf-blue);
}

.example {
  border-left: 5px solid var(--mf-gold);
}

.plotly-demo {
  width: 100%;
  min-height: 430px;
  height: 430px;
  margin: 1rem 0;
}

.math-display {
  overflow-x: auto;
}

table {
  font-size: .95rem;
}

.interactive-card {
  border: 1px solid rgba(100,116,139,.25);
  border-radius: .9rem;
  padding: 1rem 1.15rem;
  margin: 1.1rem 0 1.4rem 0;
  background: rgba(248,250,252,.70);
}

.warning {
  padding: 1rem 1.25rem;
  border-left: 5px solid #d97706;
  border-radius: .75rem;
  margin: 1rem 0;
  border-top: 1px solid rgba(217,119,6,.25);
  border-right: 1px solid rgba(217,119,6,.25);
  border-bottom: 1px solid rgba(217,119,6,.25);
  background: rgba(217,119,6,.08);
}

/* Chapter 1 interactive and AI support */
.mf-controls {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 64px;
  gap: .45rem .8rem;
  align-items: center;
  margin: .75rem 0 1rem 0;
}
.mf-controls label {
  font-weight: 600;
}
.mf-controls input[type="range"] {
  width: 100%;
}
.mf-output {
  padding: .85rem 1rem;
  border-radius: .75rem;
  border: 1px solid rgba(100,116,139,.25);
  background: rgba(31,78,121,.06);
  margin-top: .75rem;
}
.ai-box {
  padding: 1rem 1.25rem;
  border-radius: .75rem;
  margin: 1rem 0;
  border: 1px solid rgba(124,58,237,.25);
  border-left: 5px solid #7c3aed;
  background: rgba(124,58,237,.07);
}
