/* FoeForge Theme v1: Parchment & Ink
   - Warm, readable background
   - Keeps Bootstrap structure intact
   - Minimal overrides via CSS variables
*/

:root{
  --ff-parchment: #f3eee3;
  --ff-parchment-2: #fbf6ec;
  --ff-ink: #2b2620;
  --ff-border: rgba(78, 59, 33, 0.22);

  /* Accent ("wax seal") */
  --ff-wax: #7a2e2e;
  --ff-wax-hover: #662626;

  /* Optional warm accent for warnings/highlights */
  --ff-gold: #b07d2b;

  /* Bootstrap variable overrides */
  --bs-body-bg: var(--ff-parchment);
  --bs-body-color: var(--ff-ink);

  --bs-border-color: var(--ff-border);
  --bs-secondary-bg: var(--ff-parchment-2);
  --bs-tertiary-bg: rgba(251, 246, 236, 0.65);

  --bs-primary: var(--ff-wax);
  --bs-primary-rgb: 122, 46, 46;

  --bs-link-color: var(--ff-wax);
  --bs-link-hover-color: var(--ff-wax-hover);

  /* Slightly warmer muted text */
  --bs-secondary-color: rgba(43, 38, 32, 0.72);
}

body{
  /* Subtle paper texture via gradients (no images) */
  background-image:
    radial-gradient(1200px 800px at 20% 0%, rgba(255,255,255,0.45), rgba(255,255,255,0) 60%),
    radial-gradient(900px 700px at 80% 20%, rgba(255,255,255,0.28), rgba(255,255,255,0) 55%),
    linear-gradient(0deg, rgba(0,0,0,0.02), rgba(0,0,0,0.02));
  background-attachment: fixed;
}

/* Display font (Google Font "Cinzel") for headings/brand */
h1, h2, h3, h4, .navbar-brand{
  font-family: "Cinzel", ui-serif, Georgia, serif;
  letter-spacing: 0.02em;
}

.navbar{
  background-color: rgba(251, 246, 236, 0.85) !important;
}

.navbar .nav-link{
  color: rgba(43, 38, 32, 0.85);
}

.navbar .nav-link:hover{
  color: rgba(43, 38, 32, 1);
}

.navbar .nav-link.active{
  color: rgba(43, 38, 32, 1) !important;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.card{
  background-color: rgba(255, 255, 255, 0.35);
  border-color: var(--bs-border-color);
}

/* Subtle “ink-wash” panels for form sections that hardcode white */
.section{
  background-color: rgba(255, 255, 255, 0.38) !important;
  border-color: var(--bs-border-color) !important;
}

.section-title{
  color: rgba(43, 38, 32, 0.78) !important;
}

/* Form fields: keep readable, less stark than pure white */
.form-control,
.form-select,
.form-check-input{
  background-color: rgba(255, 255, 255, 0.55);
  border-color: var(--bs-border-color);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus{
  border-color: rgba(122, 46, 46, 0.55);
  box-shadow: 0 0 0 .25rem rgba(122, 46, 46, 0.18);
}

/* Buttons: align primary with wax-seal, keep bootstrap sizing/spacing */
.btn-primary{
  --bs-btn-bg: var(--ff-wax);
  --bs-btn-border-color: rgba(78, 59, 33, 0.28);
  --bs-btn-hover-bg: var(--ff-wax-hover);
  --bs-btn-hover-border-color: rgba(78, 59, 33, 0.32);
  --bs-btn-active-bg: var(--ff-wax-hover);
  --bs-btn-active-border-color: rgba(78, 59, 33, 0.32);
}

.btn-outline-secondary{
  --bs-btn-color: rgba(43, 38, 32, 0.86);
  --bs-btn-border-color: var(--bs-border-color);
  --bs-btn-hover-bg: rgba(251, 246, 236, 0.75);
  --bs-btn-hover-border-color: rgba(78, 59, 33, 0.26);
  --bs-btn-hover-color: rgba(43, 38, 32, 1);
}

/* Alerts: less neon, more parchment */
.alert{
  border-color: rgba(78, 59, 33, 0.22);
}

.alert-success{
  background-color: rgba(176, 125, 43, 0.12);
  color: rgba(43, 38, 32, 0.95);
}

.alert-danger{
  background-color: rgba(122, 46, 46, 0.10);
  color: rgba(43, 38, 32, 0.95);
}

.alert-warning{
  background-color: rgba(176, 125, 43, 0.16);
  color: rgba(43, 38, 32, 0.95);
}

/* Tables: avoid harsh header contrast */
.table thead th{
  color: rgba(43, 38, 32, 0.9);
}

.table{
  --bs-table-bg: transparent;
}

/* Keep print/export clean */
@media print{
  body{
    background: #fff !important;
    background-image: none !important;
  }
}