/* style.css */
@media (max-width: 1023px) {
    .nav-Right {
        display: none;
    }


    .input {
        display: none;
    }

}



@media (min-width: 1024px) {
    .Resp-Menu-Wrapper {
        display: none;
    }


    .Responsive-Menu{
        display: none;
    }
}



@media (max-width: 500px) {
    body {
        font-size: 14px;
    }


    :root {
        --paddingBodyLR: 0 12px;
    }


    .Poke-Card {
        width: clamp(200px, 90%, 300px);
    }


    .Nav-Bar{
        height: 64px;
    }


    .Nav-Left{
        width: 128px;
    }


    /* singlePokeCard.css */

    .Wrapper-Single-Card {
        height: calc(100dvh + -67px);
    }


    .Single-Poke-Card{
        width: clamp(280px, 100%, 300px);
    }


    .Card-Details img {
        height: 24px;
        width: 24px;
    }


    .Head-Icon {
        padding-top: 12px;
        padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 0;
    }


    .Head-Left h1 {
        font-size: 24px;    
    }


    .active {
        text-underline-offset: 14.5px; 
    }


    .Poke-Img {
        padding: 0;
        height: 112px;
    }


    .Poke-Img img {
        width: 128px;
        position: absolute;
        bottom: -16px;
        aspect-ratio: 1 / 1;
    }


    .doubleArrow {
        height: 32px;
        right: 0px;
        top: -84px;
        border-radius: 0;
        border-top-left-radius: 50%;
        border-bottom-left-radius: 50%;
    }


    .doubleArrowLeft {
        height: 32px;
        left: 0px;
        top: -84px;
        border-radius: 0;
        border-top-left-radius: 50%;
        border-bottom-left-radius: 50%;
    }


    .About {
        gap: 10px;
        height: 250px;
    }


    .Types {
        gap: 8px;
    }


    .Types p {
        margin: 0;
    }


    .Type-Border {
        font-size: 10px;

        padding: 0;
    }


    /* style.css -> LoadingBall */

    .laodingBall {
        display: flex;
        justify-content: center;
        position: fixed;
        top: 0;
        z-index: 1;
    }


    .loadingBall img {
        position: absolute;
        left: calc(50% - 200px);
        top: calc(50% - 150px);
        /* top: 50%; */
        /* left: 50%; */
        z-index: 1;
        width: 400px;
        height: 300px;
    }


    .evolution-image {
        width: 70px;
    }


    /* respMenu.css */

    .Responsive-Menu{
        top: 67px !important;
    }
}





@media (max-height: 850px) {
    .Single-Poke-Card{
        width: clamp(280px, 100%, 300px);
    }


    .Wrapper-Single-Card {
        height: calc(100dvh + -67px);
    }


    .Card-Details img {
        height: 24px;
        width: 24px;
    }


    .Head-Icon {
        padding-top: 12px;
        padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 0;
    }


    .Head-Left h1 {
        font-size: 24px;    
    }


    .active {
        text-underline-offset: 14.5px; 
    }


    .Poke-Img {
        padding: 0;
        height: 112px;
    }


    .Poke-Img img {
        width: 128px;
        position: absolute;
        bottom: -16px;
        aspect-ratio: 1 / 1;
    }


    .doubleArrow {
        height: 32px;
        right: 0px;
        top: -84px;
        border-radius: 0;
        border-top-left-radius: 50%;
        border-bottom-left-radius: 50%;
    }


    .doubleArrowLeft {
        height: 32px;
        left: 0px;
        top: -84px;
        border-radius: 0;
        border-top-left-radius: 50%;
        border-bottom-left-radius: 50%;
    }


    .About {
        gap: 10px;
        height: 250px;
    }


    .Types {
        gap: 8px;
    }


    .Types p {
        margin: 0;
    }

    
    .Type-Border {
        font-size: 10px;
        padding: 0;
    }
}