/**
 * Wakefield Peanut Company – Brand styles
 * Extracted from wakefieldpeanutco.com (styles_sec.min.css).
 * Use with Bootstrap 5.3.x and local fonts (css/fonts.css).
 *
 * Link in layout (after Bootstrap):
 *   <link rel="stylesheet" href="~/css/fonts.css" />
 *   <link rel="stylesheet" href="~/css/wakefield-brand.css" />
 */

/* ---------------------------------------------------------------------------
   Design tokens (green & white theme from wakefieldpeanutco.com)
   --------------------------------------------------------------------------- */
:root {
  /* Primary brand */
  --wakefield-green: #31662d;
  --wakefield-green-hover: #392929;
  /* Logo scroll / banner yellow (see wwwroot/images/wakefield-logo.png) */
  --wakefield-logo-yellow: #f2e394;
  /* Text */
  --wakefield-text: #392929;
  --wakefield-text-muted: #474747;
  --wakefield-text-light: #555;
  /* Accent (links, secondary actions) */
  --wakefield-accent: #145b76;
  /* Neutrals */
  --wakefield-gray-border: #999;
  --wakefield-gray-bg: #f0f0f0;
  --wakefield-gray-bg-alt: #e7e6e6;
  --wakefield-gray-input: #555;
  /* Feedback */
  --wakefield-danger: #c00;
  --wakefield-danger-bg: #f2dede;
  --wakefield-success-border: #28a745;
  --wakefield-invalid-border: #dc3545;
  /* Typography */
  --wakefield-font-sans: 'Nunito Sans', sans-serif;
  --wakefield-font-serif: 'Cinzel', serif;
  --wakefield-body-size: 1.1rem;
  --wakefield-body-line: 1.5rem;
}

/* ---------------------------------------------------------------------------
   Base
   --------------------------------------------------------------------------- */
body {
  background: #fff;
  font: var(--wakefield-body-size) / var(--wakefield-body-line) var(--wakefield-font-sans);
  font-weight: 500;
  color: var(--wakefield-text);
}

body,
select,
input,
textarea {
  color: var(--wakefield-text);
}

/* ---------------------------------------------------------------------------
   Headings (Cinzel for h1–h4, Nunito Sans for h5–h6; green, uppercase)
   --------------------------------------------------------------------------- */
h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
  font-family: var(--wakefield-font-serif);
  text-transform: uppercase;
  color: var(--wakefield-green);
  font-weight: 700;
}

h5, .h5, h6, .h6 {
  font-family: var(--wakefield-font-sans);
  text-transform: uppercase;
  color: var(--wakefield-green);
  font-weight: 700;
}

.serif {
  font-family: var(--wakefield-font-serif);
}

/* ---------------------------------------------------------------------------
   Links
   --------------------------------------------------------------------------- */
a {
  color: var(--wakefield-green);
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--wakefield-green-hover);
}

.btn-link {
  color: var(--wakefield-green);
}

/* ---------------------------------------------------------------------------
   Nav dropdowns (match public site: black text, green rollover)
   --------------------------------------------------------------------------- */
.navbar .dropdown-menu .dropdown-item {
  color: var(--wakefield-text);
}

.navbar .dropdown-menu .dropdown-item:hover,
.navbar .dropdown-menu .dropdown-item:focus {
  color: var(--wakefield-green);
  background-color: transparent;
}

/* ---------------------------------------------------------------------------
   Buttons (from wakefieldpeanutco.com)
   --------------------------------------------------------------------------- */
.btn-primary {
  background-color: var(--wakefield-green);
  border: 1px solid var(--wakefield-green);
  color: #fff;
  font-family: var(--wakefield-font-serif);
  font-size: 1.1rem;
  border-radius: 0;
  padding: 10px 20px;
  font-weight: 700;
  text-transform: uppercase;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--wakefield-green-hover);
  border-color: var(--wakefield-green-hover);
  color: #fff;
}

.btn-primary.disabled,
.btn-primary:disabled {
  background-color: var(--wakefield-text-light);
  border-color: var(--wakefield-text-light);
  color: #fff;
  opacity: 1;
}

.btn-secondary {
  background-color: var(--wakefield-green-hover);
  border: 1px solid var(--wakefield-green-hover);
  color: #fff;
  font-family: var(--wakefield-font-serif);
  font-size: 1.1rem;
  border-radius: 0;
  padding: 10px 20px;
  font-weight: 700;
  text-transform: uppercase;
}

.btn-secondary.disabled,
.btn-secondary:disabled {
  background-color: var(--wakefield-text-light);
  border-color: var(--wakefield-text-light);
}

/* ---------------------------------------------------------------------------
   Forms
   --------------------------------------------------------------------------- */
/* Value text matches body/labels (--wakefield-text). Border stays gray; placeholder stays lighter via ::placeholder. */
.form-control {
  border-color: var(--wakefield-gray-input);
  color: var(--wakefield-text);
  font-weight: 500;
  border-radius: 10px;
  height: 45px;
  padding: 10px 15px;
}

.form-select {
  border-color: var(--wakefield-gray-input);
  color: var(--wakefield-text);
  font-weight: 500;
}

.form-control::placeholder {
  color: var(--wakefield-gray-border);
}

.form-control.is-valid,
.valid-feedback .form-control {
  border-color: var(--wakefield-success-border);
}

.form-control.is-invalid,
.invalid-feedback .form-control {
  border-color: var(--wakefield-invalid-border);
}

/* ---------------------------------------------------------------------------
   Cards & panels
   --------------------------------------------------------------------------- */
.card-header {
  background-color: var(--wakefield-gray-bg);
  font-weight: 600;
}

/* ---------------------------------------------------------------------------
   List group (sidebar / nav style from original site)
   --------------------------------------------------------------------------- */
.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover,
.list-group-item-action:focus,
.list-group-item-action:hover {
  background-color: unset;
  border-color: var(--wakefield-gray-bg-alt);
  color: var(--wakefield-accent);
  font-style: italic;
}

.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: transparent;
  border: 0;
  margin-top: 2px;
  margin-left: 2px;
  border-bottom: 1px solid var(--wakefield-gray-bg-alt);
}

/* ---------------------------------------------------------------------------
   Navbar (application nav)
   --------------------------------------------------------------------------- */
.navbar-nav .nav-link {
  color: var(--wakefield-text);
  font-size: 1.1rem;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
  color: var(--wakefield-green);
}

.navbar-nav .dropdown-item:hover,
.navbar-nav .dropdown-item:focus {
  background-color: #fff;
  color: var(--wakefield-green);
}

/* ---------------------------------------------------------------------------
   Alerts & validation
   --------------------------------------------------------------------------- */
.text-muted {
  color: var(--wakefield-text-muted) !important;
}

.red, .req, .error,
.errors p em {
  color: var(--wakefield-danger);
  font-style: normal;
  font-weight: 700;
}

.errors .alert-danger {
  border-color: #721c24;
}

.valid-feedback {
  color: #126224;
}

/* ---------------------------------------------------------------------------
   Utility
   --------------------------------------------------------------------------- */
.double-border {
  border-top: 1px solid var(--wakefield-gray-border);
  border-bottom: 1px solid var(--wakefield-gray-border);
  padding-top: 0.25rem;
}

hr {
  border-color: var(--wakefield-gray-border);
}

.clickable {
  cursor: pointer;
}

/* ---------------------------------------------------------------------------
   Promo / banner (e.g. above content)
   --------------------------------------------------------------------------- */
.promo-banner {
  background: var(--wakefield-green);
  color: #fff;
  font-size: 1rem;
  padding: 10px;
  text-align: center;
  margin-top: 0;
}

.promo-banner a {
  color: #fff;
  text-decoration: underline;
}

.promo-banner a:hover {
  outline: none;
}

/* ---------------------------------------------------------------------------
   Footer
   --------------------------------------------------------------------------- */
footer {
  padding-top: 3rem;
  line-height: 2.2rem;
}

footer .footer-heading {
  margin: 1.5rem 0;
  font-weight: 700;
}

footer a {
  color: var(--wakefield-text);
  line-height: 2.2rem;
  display: block;
}

footer a:hover {
  text-decoration: underline;
}

footer ul {
  list-style: none;
  padding-left: 0;
}

/* ---------------------------------------------------------------------------
   Page header / tagline (e.g. under logo)
   --------------------------------------------------------------------------- */
.header-tagline {
  font-family: var(--wakefield-font-serif);
  color: var(--wakefield-green);
  font-size: 1.38rem;
  line-height: 2rem;
  font-weight: 700;
}

/* ---------------------------------------------------------------------------
   Table / data (optional)
   --------------------------------------------------------------------------- */
.table thead th {
  color: var(--wakefield-green);
  font-family: var(--wakefield-font-serif);
  text-transform: uppercase;
  font-weight: 700;
}