@import "/ui/Hud/Style.scss";

PauseMenu {
   
    pointer-events: all;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    z-index: 0;
    padding: 130px;
    background-color: $fullscreen-bg;
    backdrop-filter: $fullscreen-blur;
    background-image: url(/ui/hud/pausemenu.png);
    
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: all 0.5s ease-in-out;
    font-size: 32px;
    
    
    
    


    .pause {
        background-color: aqua;
        padding: 8px;
        color:white;
        border-radius: 42px;

        font-size: 64px;
        bottom:10%;
    }

    > .options {
        border-radius: 32px;
        flex-direction: column;
        align-items: center;
        gap: 32px;

        .button1 {
            font-size: 64px;
            background: linear-gradient(to left, rgba(black, 0.8) 0%, rgba(black, 0.2) 50%, rgba(black, 0) 100%);
            padding: 8px;
            border-radius: 32px;

            &:hover {
					background-color: #06571a;
					sound-in: 'hover';
                    transform:scale(1.1);

					
				}

				&:active:not(.disabled) {
					sound-in: 'light_click';
				}
        }


        .button {
            background: linear-gradient(to left, rgba(black, 0.8) 0%, rgba(black, 0.2) 50%, rgba(black, 0) 100%);
            color: rgb(255, 82, 82);
            padding: 8px;
            border-radius: 32px;
            &:hover {
                background-color: #06571a;
                sound-in: 'hover';
                transform:scale(1.1);
                

                
            }

            &:active:not(.disabled) {
                sound-in: 'light_click';
            }
        }
    }

    
}