/* Подключаем шрифт Minecraft */
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

:root {
  --mc-dark-gray: #555555;
  --mc-light-gray: #c6c6c6;
  --mc-black: #000000;
  --mc-text-shadow: #3f3f3f;
  --bg-dark: rgba(20, 10, 30, 0.95);
  
  /* Твои новые цвета градиента */
  --accent-orange: #ff8c00;
  --accent-yellow: #fffacd; 
}

body {
  /* Не забудь заменить ссылку на свой фон */
  background-image: url('https://i.imgur.com/your_night_background.jpg'); 
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  color: #ffffff;
  font-family: 'Press+Start+2P', cursive;
  font-size: 11px;
}

/* ЗАГОЛОВКИ С КРАСИВЫМ ГРАДИЕНТОМ И ОБЪЕМОМ */
h1, h2, .item-title {
  font-size: 1.8em; /* Шрифт больше */
  background: linear-gradient(to bottom, var(--accent-orange), var(--accent-yellow));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  padding-bottom: 5px;
  text-shadow: none !important; /* Убираем стандартную тень */
  position: relative;
}

/* Эффект "объема" для текста с градиентом */
h1::after, h2::after, .item-title::after {
  content: attr(data-text); /* Добавь data-text="Текст" в HTML для эффекта */
  position: absolute;
  left: 3px;
  top: 3px;
  z-index: -1;
  background: none;
  -webkit-text-fill-color: #3f1a00; /* Темная тень градиента */
}

/* КАРТОЧКИ ТОВАРОВ (Инвентарь MC) */
.card, .shop-item, .modal-content {
  background: var(--mc-light-gray) !important;
  border: 4px solid var(--mc-black) !important;
  box-shadow: inset -4px -4px 0px var(--mc-dark-gray), inset 4px 4px 0px #ffffff, 0 10px 20px rgba(0,0,0,0.5);
  border-radius: 0px !important;
  transition: 0.3s;
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: inset -4px -4px 0px var(--mc-dark-gray), inset 4px 4px 0px #ffffff, 0 0 25px var(--accent-orange);
}

/* КНОПКИ (Стиль главного меню MC) */
.btn-primary, .button-buy, .btn-submit {
  background: #7c7c7c !important;
  border: 4px solid var(--mc-black) !important;
  box-shadow: inset -4px -4px 0px var(--mc-dark-gray), inset 4px 4px 0px #ffffff;
  color: #fff !important;
  text-transform: uppercase;
  font-family: inherit;
  font-size: 12px;
  text-shadow: 2px 2px var(--mc-text-shadow);
  border-radius: 0px !important;
  transition: 0.1s all;
  position: relative;
  top: 0;
}

/* Эффект наведения на кнопку */
.btn-primary:hover, .button-buy:hover {
  background: #a5e68d !important; /* Зеленый при наведении */
  box-shadow: inset -4px -4px 0px #5d8c5d, inset 4px 4px 0px #ffffff;
}

/* АНИМАЦИЯ НАЖАТИЯ (Вжимание) */
.btn-primary:active, .button-buy:active {
  top: 4px;
  box-shadow: inset 4px 4px 0px var(--mc-dark-gray), inset -4px -4px 0px #ffffff;
}

/* УВЕЛИЧЕННЫЕ КАТЕГОРИИ (Менюшка слева) */
.category-item, .nav-link-category {
  padding: 15px 25px !important; /* Увеличили отступы */
  font-size: 1.3em !important; /* Больше шрифт */
  margin-bottom: 10px;
  background: rgba(0,0,0,0.3) !important;
  border: 2px solid transparent;
  transition: 0.3s;
}

.category-item:hover {
  background: rgba(138, 43, 226, 0.2) !important;
  border-color: var(--accent-orange);
  color: var(--accent-yellow) !important;
}

/* ПОИСК ПО ЦЕНТРУ И УВЕЛИЧЕН */
.search-wrapper {
  max-width: 800px;
  margin: 0 auto 30px auto !important; /* Центрируем */
  padding: 10px;
}

.search-input {
  font-size: 1.5em !important; /* Больше шрифт */
  padding: 15px !important;
  background: rgba(0,0,0,0.5) !important;
  border: 2px solid var(--accent-orange) !important;
  box-shadow: 0 0 15px rgba(255, 140, 0, 0.3);
}

/* Остальные значки */
i, .fa, .icon {
  color: var(--accent-yellow) !important;
  filter: drop-shadow(0 0 5px var(--accent-orange));
}

* { border-radius: 0px !important; }