/*
Theme Name:  Listeo ChildTheme
Theme URI: http://listeo.pro
Author: Purethemes
Author URI: http://themeforest.net/user/purethemes
Description: Directory WordPress Theme by Purethemes
Version: 1.0
License: ThemeForest
License URI: http://themeforest.net/licenses
Text Domain: listeo
Domain Path: /languages/
Tags: light, responsive-layout, post-formats, theme-options, translation-ready, two-columns
Template:  listeo
*/

.button-container {
    position: relative;
    width: 100%; /* Prispôsobí sa šírke rodiča */
    max-width: 350px; /* Maximálna šírka tlačidla */
    height: auto;
    margin: 5% auto;
    transform-style: preserve-3d;
    border: 0px solid #000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-button {
    width: 100%; /* Automatická šírka */
    max-width: 350px; /* Maximálna šírka na veľkých obrazovkách */
    height: 50px;
    background-color: #8224e3;
    border: none;
    border-radius: 10px;
    font-size: 18px;
    font-weight: bold;
    color: white;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    position: relative;
    z-index: 2;
}

/* Responzivita pre menšie obrazovky */
@media (max-width: 768px) {
    .custom-button {
        font-size: 16px;
        height: 45px;
    }

    .button-container {
        max-width: 280px; /* Menšie tlačidlo na mobiloch */
    }
}

/* Responzivita pre veľmi malé obrazovky (napr. iPhone SE) */
@media (max-width: 480px) {
    .custom-button {
        font-size: 14px;
        height: 40px;
    }

    .button-container {
        max-width: 250px;
    }
}

/* ✅ Kontajner na logá, ktorý sa otáča */
.logo-container {
    position: absolute;
    width: 100px;
    height: 50px;
    left: 70%;
    transform-style: preserve-3d;
    animation: rotateBubon 6s infinite linear;
}

/* ✅ Štvorcové logá rovnomerne rozmiestnené */
.logo img {
    width: 100%;
    height: 100%;
    max-width: 60px;
    max-height: 60px;
    object-fit: contain;
    display: block;
    margin: auto;
}

/* ✅ Logá sú rovnomerne rozložené na menšom kruhu */
.logo:nth-child(1) { transform: rotateX(0deg) translateZ(60px); }
.logo:nth-child(2) { transform: rotateX(120deg) translateZ(90px); }
.logo:nth-child(3) { transform: rotateX(240deg) translateZ(0px); }

/* ✅ Animácia nekonečnej rotácie okolo osi X */
@keyframes rotateBubon {
    from { transform: rotateX(0deg); }
    to { transform: rotateX(360deg); }
}