/* =========================================================
   FOR THE RANCH - FOUNDATION OVERRIDE THEME
   Rugged western / Yellowstone-inspired
   ========================================================= */

:root {
  --ftr-black: #15100a;
  --ftr-charcoal: #241a10;
  --ftr-brown: #3a2414;
  --ftr-leather: #6f451f;
  --ftr-gold: #d99a2b;
  --ftr-yellow: #f2c14e;
  --ftr-cream: #f3e2bd;
  --ftr-muted: #b9955b;
  --ftr-red: #8a2f1b;
  --ftr-green: #2f3b24;

  --ftr-border: rgba(242, 193, 78, 0.45);
  --ftr-shadow: rgba(0, 0, 0, 0.55);
}

/* Base */
body {
  background:
    linear-gradient(rgba(16, 10, 5, 0.9), rgba(16, 10, 5, 0.95)),
    radial-gradient(circle at top, #5a3417 0%, #15100a 65%);
  color: var(--ftr-cream);
  font-family: Georgia, "Times New Roman", serif;
}

/* Links */
a {
  color: var(--ftr-yellow);
  font-weight: bold;
}

a:hover,
a:focus {
  color: var(--ftr-gold);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  color: var(--ftr-yellow);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-shadow: 2px 2px 0 var(--ftr-black);
}

/* Panels / Cards / Callouts */
.callout,
.card,
.panel {
  background: linear-gradient(180deg, #2d1c10, #1b120b);
  border: 2px solid var(--ftr-border);
  color: var(--ftr-cream);
  box-shadow: 0 6px 18px var(--ftr-shadow);
  border-radius: 6px;
}

.callout.primary {
  background: linear-gradient(180deg, #4a2a12, #24150b);
  border-color: var(--ftr-gold);
}

.callout.warning {
  background: linear-gradient(180deg, #6f451f, #2d1c10);
  border-color: var(--ftr-yellow);
}

.callout.alert {
  background: linear-gradient(180deg, #6b2115, #2b0f0a);
  border-color: #b94a2c;
}

/* Buttons */
.button,
button,
input[type="submit"] {
  background: linear-gradient(180deg, var(--ftr-yellow), var(--ftr-gold));
  color: #1b120b;
  border: 2px solid #8a5b1f;
  border-radius: 4px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1px;
  box-shadow: 0 4px 0 #4a2a12;
}

.button:hover,
button:hover,
input[type="submit"]:hover {
  background: linear-gradient(180deg, #ffd86a, #c9841f);
  color: #000;
}

.button.secondary {
  background: linear-gradient(180deg, #5b3820, #2b1a0e);
  color: var(--ftr-cream);
  border-color: var(--ftr-muted);
}

.button.alert {
  background: linear-gradient(180deg, #9c3a20, #4b160d);
  color: #fff;
}

/* Top Bar */
.top-bar,
.top-bar ul {
  background: linear-gradient(180deg, #2b1a0e, #120c07);
  border-bottom: 3px solid var(--ftr-gold);
}

.top-bar a {
  color: var(--ftr-cream);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.top-bar a:hover {
  color: var(--ftr-yellow);
  background: rgba(242, 193, 78, 0.1);
}

/* Menus */
.menu a {
  color: var(--ftr-cream);
}

.menu a:hover {
  color: var(--ftr-yellow);
}

/* Forms */
label {
  color: var(--ftr-muted);
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

input,
textarea,
select {
  background: #120c07;
  color: var(--ftr-cream);
  border: 2px solid #5b3820;
  border-radius: 4px;
}

input:focus,
textarea:focus,
select:focus {
  background: #1b120b;
  border-color: var(--ftr-yellow);
  box-shadow: 0 0 8px rgba(242, 193, 78, 0.45);
}

/* Tables */
table {
  background: #1b120b;
  border: 2px solid var(--ftr-border);
  color: var(--ftr-cream);
}

thead,
tfoot {
  background: linear-gradient(180deg, #4a2a12, #24150b);
  color: var(--ftr-yellow);
  text-transform: uppercase;
}

tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.035);
}

tbody tr:hover {
  background: rgba(242, 193, 78, 0.08);
}

/* Badges / Labels */
.badge,
.label {
  background: var(--ftr-gold);
  color: #1b120b;
  font-weight: bold;
  text-transform: uppercase;
}

.label.success {
  background: var(--ftr-green);
  color: #fff;
}

.label.alert {
  background: var(--ftr-red);
  color: #fff;
}

/* Progress Bars */
.progress {
  background: #120c07;
  border: 1px solid #5b3820;
}

.progress-meter {
  background: linear-gradient(90deg, var(--ftr-gold), var(--ftr-yellow));
}

.progress-meter-text {
  color: #1b120b;
  font-weight: bold;
}

/* Reveal / Modal */
.reveal {
  background: linear-gradient(180deg, #2d1c10, #15100a);
  border: 3px solid var(--ftr-gold);
  color: var(--ftr-cream);
  box-shadow: 0 0 30px #000;
}

/* Pagination */
.pagination .current {
  background: var(--ftr-gold);
  color: #1b120b;
}

.pagination a {
  color: var(--ftr-cream);
}

.pagination a:hover {
  background: rgba(242, 193, 78, 0.15);
}

/* Ranch-style utility classes */
.ftr-box {
  background: linear-gradient(180deg, #2d1c10, #15100a);
  border: 2px solid var(--ftr-border);
  padding: 1rem;
  border-radius: 6px;
  box-shadow: 0 5px 15px var(--ftr-shadow);
}

.ftr-title {
  color: var(--ftr-yellow);
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 900;
}

.ftr-muted {
  color: var(--ftr-muted);
}

.ftr-divider {
  border: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--ftr-gold), transparent);
  margin: 1.5rem 0;
}

/* Optional branded page background */
.ftr-ranch-bg {
  background:
    linear-gradient(rgba(12, 8, 4, 0.85), rgba(12, 8, 4, 0.95)),
    url("/images/ranch-bg.jpg") center center / cover no-repeat fixed;
}

/* Inputs placeholder */
::placeholder {
  color: #8f754d;
}

/* Selection */
::selection {
  background: var(--ftr-gold);
  color: #120c07;
}