/* ===== Общий фон ===== */
body {
    background: url('https://i.imgur.com/5tLwFfO.png'); /* фон в стиле пикселей/кирпичей */
    background-size: cover;
    font-family: 'Minecraft', monospace;
    color: #fff;
}

/* ===== Карточки товаров ===== */
.card-product, .product-item {
    background-color: #2c2c2c;
    border: 3px solid #8b4513; /* коричневая рамка как дерево */
    border-radius: 4px;
    padding: 12px;
    box-shadow: 0 4px 0 #000; /* эффект “блочного рельефа” */
    transition: all 0.2s ease;
}

.card-product:hover, .product-item:hover {
    transform: translateY(-3px);
    border-color: #ffd700; /* золото при наведении */
}

/* ===== Названия товаров ===== */
.card-product .product-title, .product-item .title {
    color: #00ff00; /* зеленый как блок травы */
    font-weight: bold;
    font-size: 16px;
    text-shadow: 1px 1px #000;
}

/* ===== Кнопки ===== */
.button, .buy-button {
    background-color: #ff0000; /* красный как шерсть */
    color: #fff;
    border: 2px solid #000;
    border-radius: 2px;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
}

.button:hover, .buy-button:hover {
    background-color: #ff7f7f;
}

/* ===== Цены ===== */
.price, .product-price {
    color: #ffff00; /* ярко-желтый, как золото */
    font-size: 14px;
    font-weight: bold;
    text-shadow: 1px 1px #000;
}

/* ===== Фильтры и категории ===== */
.filters, .categories {
    background-color: #3d3d3d;
    border: 2px solid #8b4513;
    border-radius: 4px;
    padding: 8px;
    color: #fff;
}

/* ===== Эффект “пиксельного” тени ===== */
.card-product::before, .product-item::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    right: 2px; bottom: 2px;
    border: 1px dashed #000;
    pointer-events: none;
}