.planos-titulo {
    font-size: 100%;
    color: #ED5F10; 
    letter-spacing: 5px;
}

.planos-subtitulo {
    font-family: 'Catamaran', sans-serif;
    font-size: 300%;
    font-weight: 600;
}

.container-ticket {
    display: flex;
    flex-direction: column;
}

.ticket {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    height: 100%; 
    margin: 1%;
}

/* .ticket-opcao-item {
    width: 70px;
    position: relative;
} */

.ticket-opcao-item:hover {
    color: #ED5F10;
}

.ticket-opcao-item-image::before {
    content: "+";
    position: absolute;
    font-weight: bold;
    margin-top: 40%;
    right: 120%;
    transform: translateY(-50%);
    color: #000;
}

.ticket-opcao-descricao {
    font-size: 10px;
    letter-spacing:0
}

/* Estilize o texto */
.texto {
    font-size: 16px; /* Tamanho da fonte */
    margin-top: 10%;
    margin-left: 10%;
}

.ticket:hover .ticket-container-left::before {
    left: 0 ;
    opacity: 0.9;
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

.ticket:hover .ticket-container-left {
    color: #fff;
}

.ticket-container-left .ticket-titulo {
    color: #ED5F10;
    font-size: 200%;
}

.ticket:hover .ticket-container-left .ticket-titulo {
    color: #fff;
}

.container-ticket-opcao {
    display: flex;
    /* flex-wrap: wrap; */
    flex-direction: column;
    justify-content: space-evenly;
    text-transform: capitalize;
    font-size: 20px;
}

.container-ticket-opcao ul {
    list-style: none;
    margin-left: 5%;
}

/* Ticket - container de descricao */
.ticket-container-left {
    position: relative;
    width: 25%;
    overflow: hidden;
    color: #000;
}

.ticket-container-left::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, rgba(249, 102, 20), rgba(0, 0, 0, 0)), 
        url(/img/ticket/left-pricing-img.jpg);
    background-size: contain; 
    background-position: center center;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, left 0.5s ease-in-out;
    background-position: -100% 0;
    z-index: -1;
    border-top-left-radius: var(--ebs-border-radius-lg);
    border-bottom-left-radius: var(--ebs-border-radius-lg);
}

.ticket-container-left-basic::before {
    background-image: linear-gradient(to right, rgba(249, 102, 20), rgba(0, 0, 0, 0)), 
        url(/img/ticket/pricing-table-image-basic.jpg);
    background-size: contain; 
}

.ticket-container-left-light::before {
    background-image: linear-gradient(to right, rgba(249, 102, 20), rgba(0, 0, 0, 0)), 
        url(/img/ticket/pricing-table-image-light.jpg);
    background-size: contain; 
}

.ticket-container-left-premium::before {
    background-image: linear-gradient(to right, rgba(249, 102, 20), rgba(0, 0, 0, 0)), 
        url(/img/ticket/pricing-table-image-premium.jpg);
    background-size: contain; 
}

.ticket-container-left-advanced::before {
    background-image: linear-gradient(to right, rgba(249, 102, 20), rgba(0, 0, 0, 0)), 
        url(/img/ticket/pricing-table-image-advanced.jpg.jpg);
    background-size: contain; 
}


/* Ticket - container de opcao */
.container-opcao {
    width: 50%;
    padding-top: 3%;
    align-content: center;
    border-left: solid .5px #dee2e6;
    border-right: solid .5px #dee2e6;
}

.ticket-opcao-item {
    display: flex;
    align-items: center;
    font-size: 15px;
}

.container-ticket-opcao-stream {
    display: flex; 
    justify-content: center;
    margin-bottom: 3%;
    
}


/* Ticket - container de valor */
.container-valor {
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: auto;
    padding: 20px;
}

.valor p {
    color: #000; 
    font-size: 20px; 
    font-weight: 600;    
}

.valor #val {
    font-weight: 700; 
    font-size: 400%; 
    font-family: Outfit, sans-serif;
}

.btn-assinar-plano {
    /* padding: 20px; */
}


/* stream */
.container-movies {
    display: flex;
    flex-direction: row;
}

.movie {
    margin: 1%;
  }

@media (max-width: 1400px) {
    .container-opcao {
        margin-top: 0;
    }
    
    .valor #val {
        font-weight: 700; 
        font-size: 250%; 
        font-family: Outfit, sans-serif;
    }
}

@media (max-width: 1200px) {
    .valor p {
        color: #000; 
        font-size: 15px; 
        font-weight: 600;    
    }
}

@media (max-width: 1000px) {
    .container-movies {
        flex-direction: column;
    }

    .ticket {
        flex-direction: column;
    }

    .planos-subtitulo {
        font-size: 200%;
    }

    .texto {
        margin: 5%;
    }

    .ticket-container-left  {
        width: 100%;
        text-align: center !important;
    }

    .ticket:hover .ticket-container-left::before {
        border-bottom-left-radius: 0;
        border-top-right-radius: 0.5rem;
    }

    .container-opcao {
        width: 100%;
        /* margin-top: 5%; */
        border-left: 0;
        border-right: 0;
        border-top: solid .5px #dee2e6;
        border-bottom: solid .5px #dee2e6;
    }

    .container-ticket-opcao {
        margin-top: 5%;
        margin-bottom: 5%;
    }

    .container-ticket-opcao-item {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .container-ticket-opcao-item ul {
        width: 100%;
        margin-left: 5%;
    }

    .valor {
        justify-content: inherit !important;
        align-self: center;
        justify-content: center;
    }
}

@media (max-width: 800px) {
    .planos-subtitulo {
        font-size: 200%;
    }

    .texto {
        margin-top: 5%;
        margin-left: 5%;
    }

    .ticket-container-left  {
        width: 100%;
        text-align: center !important;
    }

    .container-opcao {
        width: 100%;
    }
}

@media (max-width: 700px) {
    .planos-subtitulo {
        font-size: 150%;
    }
}

@media (max-width: 500px) {
    .planos-subtitulo {
        font-size: 100%;
    }

    .container-ticket-opcao-item ul {
        width: 100%;
        margin-left: 5%;
    }
}

@media (max-width: 400px) {

    /* ticket */
    .ticket-container-left {
        width: 100%;
        text-align: center !important;
    }

    .texto {
        margin-left: 0;
        margin-bottom: 10px;
    }

    /* opçao */
    .container-opcao {
        width: 100%;
    }

    .ticket-opcao-descricao {
        font-size: 12px;
    }

    .container-ticket-opcao-item ul {
        margin-left: 2%;
    }

    /* valor */
    .container-valor {
        width: 100%;
    }

    /* .valor {
        width: 100%;
    } */

    .valor #val {
        font-size: 400%;
    }
}