
/* Стили для контейнера с текстурами */
#textures {
    display: grid; /* Используем CSS Grid для двух столбцов */
    grid-template-columns: repeat(2, 1fr); /* Два равных столбца */
    grid-gap: 10px; /* Отступы между элементами */
    justify-items: center; /* Центрируем элементы внутри ячеек */
}

/* Стили для изображений текстур и кнопок выбора стекла */
#textures img, #choose-glass {
    width: 80px; /* Ширина изображений и кнопок */
    height: 80px; /* Высота изображений и кнопок */
    cursor: pointer; /* Указатель на курсоре при наведении */
    border: 2px solid transparent; /* Прозрачная рамка по умолчанию */
    transition: border-color 0.3s; /* Анимация изменения цвета рамки */
    box-sizing: border-box; /* Учитываем рамку в размерах */
}

/* Стили для выбранной текстуры (с выделением рамкой) */
#textures img.selected {
    border: 9px solid  #152e4c; /* Синяя рамка для выделенной текстуры */
}

/* Стили для кнопки выбора стекла */
#choose-glass {
    background-color:  #e3e8ec;
    padding: 0;
    text-align: center;
    margin: 0;
    border: 2px solid transparent;
    box-sizing: border-box;
    cursor: pointer;
    color: #152e4c; /* Цвет текста */
}

/* Текст внутри кнопки выбора стекла */
#choose-glass span {
    display: block;
    font-size: 14px;
}

/* Стили для кнопки при наведении */
#choose-glass:hover {
    background-color: #152e4c; /* Темный оттенок при наведении */
    color: white;
}