/* === Wild Wild West Theme Enhancements === */

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&family=Playfair+Display:wght@700&display=swap');

body {
  background-color: #fff;
}

.highlighted-deals.block-highlighted-deals {
  background-color: #e5e2d5;
  background: url('/static/home/img/old-paper.jpg') center/cover no-repeat;
  padding: 1.3rem
}

h1, h2, h3 {
  font-family: 'Special Elite', cursive;
  letter-spacing: 1px;
}

/* Hero Section */
.bg-dark {
  background: url('/static/home/img/hero-saloon.jpg') center/cover no-repeat;
  border-bottom: 4px solid #c19a6b;
}

.btn-warning {
  background-color: #d4af37;
  color: #0b0a09;
  border: 2px solid #b8860b;
  font-weight: bold;
}

.btn-warning:hover {
  background-color: #b8860b;
}

/* MOST WANTED Poster Style */
.highlighted-deals__title {
  align-self: center;
  color: #3e1f0e;
  font-size: 2.5rem;
  border: transparent;
  font-family: 'Special Elite', cursive;
  text-align: center;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}

/* Deal Cards */
.highlighted-deals__tab {  
  border-radius: 5px;
  padding: 1rem;
  color: #646464;
} 

.swiper-slide {
  background-color: #b59e83;
  border: 1px solid #231b12;
  border-radius: 5px;
  padding: 1rem;
  color: #fff;
}

/* Buttons */
.btn1 {
  background-color: #a0522d;
  color: #fff;
  border: none;
  padding: 0.5rem 1.2rem;
  text-transform: uppercase;
  font-weight: bold;
  border-radius: 3px;
  text-decoration: none;
  display: inline-block;
  align-self: center; 
  margin-left: 2rem;    /* centers horizontally in the column */   
}

.btn1:hover {
  background-color: #8b4513;
}

/* Slide timer text */
.timer {
  font-family: 'Special Elite', cursive;
  color: #ffd700;
}

.hero-section {
  background: url('/static/home/img/hero-saloon-cartoon.png') center center / cover no-repeat;
  color: #fff3d1;
  padding: 6rem 1rem 5rem 1rem;
  text-shadow: 2px 2px #000;
  font-family: 'Playfair Display', serif;
}

.hero-section h1 {
  font-family: 'Special Elite', cursive;
  font-size: 3.5rem;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.6);
}

.hero-section .btn-warning {
  background-color: #d4af37;
  color: #0b0a09;
  border: 2px solid #b8860b;
  font-weight: bold;
}
.hero-section .btn-warning:hover {
  background-color: #b8860b;
}