@charset "UTF-8";

        /* Main layout container */
        .main-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            /* justify-content: center;
            height: 100vh; */
        }

        .progress-container {
            position: relative;
            width: 90%;
            height: 30px;
            background-color: #e0e0e0;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
            cursor: pointer;
        }

        .progress-bar {
            height: 100%;
            width: 0%;
/*             background-color: #4caf50;            */
            background-color: #9292af;
            transition: width 0.1s linear;
        }

        .progress-label {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            /* font-weight: bold; */
            color: #fff;
            font-size: 10px;
            text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
        }

        .control-button {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: none;
            border: none;
            font-size: 20px;
            font-weight: bold;
            cursor: pointer;
            color: white;
            z-index: 1;
            pointer-events: none; /* Prevent interfering with progress-container clicks */
        }

        .control-button:hover {
            color: #f5f5f5;
        }


        /* Styling for additional elements */
        .additional-elements-container {
            position: relative;
            /* width: 150px;
            height: 150px; */
            width: 90%;
            height: 90%;
        }

        .additional-elements {
            margin-top: 20px;
            text-align: center;
       }

        .additional-elements p {
            margin: 5px 0;
            font-size: 16px;
            color: #333;
        }

        .additional-elements-non-centered {
            margin-top: 20px;
       }

        .additional-elements-non-centered p {
            margin: 5px 0;
            font-size: 16px;
            color: #333;
        }

