/* =========================
   GLOBAL
   ========================= */
html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;

  background-color: #141414;
  background-image: url("https://fireandiron.us/images/backgrounds/metal07.jpg");
  background-repeat: repeat;
  background-position: top left;
  background-attachment: fixed;

  color: #e0e0e0;
}


h1, h2, h3, h4, h5, h6 {
  color: #ffb300;
}
/* Links */
a {
  color: #ffb300;
}
a:hover {
  color: #ffd54f;
}
legend {
  padding: 7px 0;
  margin-bottom: 20px;
  border-bottom: 1px solid #444;
}

label {
  font-size: 12px;
  font-weight: normal;
  color: #ccc;
}

button:focus {
  outline: none !important;
}



/* =========================
   GLOBAL LIST-GROUP (KILL WHITE EVERYWHERE)
   ========================= */

.list-group {
  background-color: transparent;
  border: none;
}

.list-group-item {
  background-color: #1b1b1b;
  color: #e0e0e0;
  border: 1px solid #444;
}

/* Hover state */
.list-group-item:hover {
  background-color: #262626;
  color: #ffb300;
}

/* Active state */
.list-group-item.active,
.list-group-item.active:hover {
  background-color: #333;
  border-color: #555;
  color: #ffb300;
}



/* =========================
   LAYOUT
   ========================= */
#container {
  width: 100%;
  min-height: 100%;
  position: relative;
  margin-bottom: 300px;
}

#content,
#column-left,
#column-right {
  padding-bottom: 700px;
  background-color: transparent;
}

@media (min-width: 576px) {
  #content,
  #column-left,
  #column-right {
    padding-bottom: 400px;
  }
}

/* =========================
   RIGHT COLUMN – KILL ALL WHITE
   ========================= */

/* Column container */
#column-right {
  background-color: #333333 !important;
}

/* Bootstrap cards and wrappers */
#column-right .card,
#column-right .card-body,
#column-right .list-group,
#column-right .list-group-item,
#column-right .bg-white {
  background-color: #333333 !important;
  color: #ffffff !important;
  border-color: #444 !important;
}

/* Links inside right column */
#column-right a {
  color: #ffffff !important;
}

/* Hover */
#column-right a:hover {
  background-color: #2a2a2a !important;
  color: #ffb300 !important;
}

/* Remove Bootstrap shadows that highlight white */
#column-right .card {
  box-shadow: none !important;
}


/* =========================
   ALERTS
   ========================= */
#alert {
  z-index: 9999;
  position: fixed;
  top: 30%;
  left: 50%;
  width: 400px;
  margin-left: -200px;
}

@media (min-width: 992px) {
  #alert {
    width: 600px;
    margin-left: -300px;
  }
}

#alert .alert {
  margin-bottom: 15px;
  background-color: #222;
  color: #fff;
  border-color: #444;
}

/* =========================
   TOP BAR
   ========================= */
#top {
  background-color: #0f0f0f;
  border-bottom: 1px solid #333;
  margin-bottom: 20px;
  padding-bottom: 5px;
}

#top .list-inline-item > a,
#top .list-inline-item .dropdown > a {
  font-size: 1.05em;
  color: #ccc;
  line-height: 40px;
  padding: 10px 0 5px;
}

#top a:hover {
  color: #ffb300;
}

/* =========================
   LOGO
   ========================= */
#logo {
  text-align: center;
  margin: 7px 0;
}

#logo img {
  max-width: 220px;
}

@media (min-width: 768px) {
  #logo {
    text-align: left;
  }
}

/* =========================
   SEARCH
   ========================= */
#search .form-control-lg {
  height: 40px;
  font-size: 13px;
  background-color: #1e1e1e;
  color: #fff;
  border: 1px solid #555;
}

#search .btn-lg {
  background-color: #ff9800;
  border-color: #ff9800;
  color: #000;
}

/* =========================
   CART
   ========================= */
#cart .dropdown-menu {
  background-color: #1e1e1e;
  color: #fff;
  border-color: #444;
}

/* =========================
   MAIN MENU
   ========================= */
/* =========================
   MAIN MENU – FORCE DARK (BOOTSTRAP OVERRIDE)
   ========================= */
#menu {
  background: #0f0f0f !important;
  border: 1px solid #222;
  border-radius: 4px;
  padding: 0 1rem;
  margin-bottom: 20px;
}

/* Kill Bootstrap navbar background */
#menu.navbar,
#menu .navbar,
#menu .navbar-collapse {
  background: #333333 !important;
}

/* Menu links */
#menu .navbar-nav > li > a,
#menu .nav-link {
  color: #ffffff !important;
  background: transparent !important;
  padding: 10px 15px;
  font-weight: 600;
}

/* Hover state – matches your screenshot */
#menu .navbar-nav > li > a:hover,
#menu .nav-link:hover {
  background-color: #1b1b1b !important;
  color: #ffb300 !important;
}

/* Active menu item */
#menu .nav-item.active > a,
#menu .nav-item.show > a {
  background-color: #1b1b1b !important;
  color: #ffb300 !important;
}

/* Dropdown menu */
#menu .dropdown-menu {
  background-color: #1b1b1b !important;
  border: 1px solid #333;
}

/* Dropdown items */
#menu .dropdown-menu a {
  color: #e0e0e0 !important;
}

#menu .dropdown-menu a:hover {
  background-color: #262626 !important;
  color: #ffb300 !important;
}

/* Mobile hamburger icon */
#menu .navbar-toggler {
  border-color: #444;
}

#menu .navbar-toggler-icon {
  filter: invert(1);
}


/* =========================
   FORMS
   ========================= */
.form-control,
.form-select {
  background-color: #1e1e1e;
  color: #fff;
  border: 1px solid #555;
}

.form-control:focus,
.form-select:focus {
  border-color: #ff9800;
  box-shadow: none;
}

/* =========================
   FOOTER
   ========================= */
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding-top: 30px;
  background-color: #0f0f0f;
  border-top: 1px solid #333;
  color: #ccc;
}

footer a {
  color: #ccc;
}

footer a:hover {
  color: #ffb300;
}

footer h5 {
  font-size: 13px;
  font-weight: bold;
  color: #fff;
}

/* =========================
   BREADCRUMB
   ========================= */
.breadcrumb {
  margin: 0 0 20px;
  padding: 8px 0;
  background-color: #1b1b1b;
  border: 1px solid #444;
}

.breadcrumb a {
  color: #ffb300;
}

/* =========================
   PRODUCT THUMB
   ========================= */
.product-thumb {
  border: 1px solid #444;
  background-color: #1b1b1b;
  height: 100%;
}

.product-thumb .description {
  padding: 15px;
}

.product-thumb .button button {
  background-color: #222;
  color: #ccc;
  border-top: 1px solid #444;
}

.product-thumb .button button:hover {
  background-color: #333;
  color: #ffb300;
}

/* =========================
   PRICING
   ========================= */
.price {
  color: #ffb300;
}

.price-old {
  color: #ff6f00;
  text-decoration: line-through;
}

.price-tax {
  color: #999;
  font-size: 12px;
}

/* =========================
   RATINGS
   ========================= */
.rating .fa-star {
  color: #ffb300;
}

/* =========================
   BLOG
   ========================= */
.blog-thumb {
  border: 1px solid #444;
  background-color: #1b1b1b;
}

/* =========================
   COOKIE NOTICE
   ========================= */
#cookie {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  z-index: 9999;
  opacity: 0.95;
  background-color: #111;
  color: #fff;
}

#cookie div {
  font-size: 15px;
}
