:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;justify-content:center;place-items:center;min-height:100vh;overflow-x:hidden}h1{font-size:3.2em;line-height:1.1}button{background-color:transparent;outline:none;border:none}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{font-size:16px;--vermelho: #e50914;--vermelho-hover: #c7242c;--cinza: #221f1f;--preto: #000000;--branco: #fff}*{margin:0;padding:0;box-sizing:border-box}section{min-height:100vh;min-width:100vw;width:100vw;background-color:var(--preto);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;z-index:1}#login{background-image:url(/redflix/background.jpg)}#login:after{content:"";width:100%;height:100%;top:0;left:0;position:absolute;background-color:#000000b3}.login-container{padding:2rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;border-radius:15px;color:#fff;gap:1rem;position:relative;z-index:11;background-color:#000000b3;width:30%;min-width:300px;margin:6rem 0 2rem}.login-container h1{width:100%;text-align:center;font-size:2rem}.login-container form{width:100%}.login-container form .form-control{margin:2rem 0;position:relative;display:flex;align-items:center}.form-control input{padding:1rem 1.5rem;background-color:transparent;border:solid 1px red;border-radius:10px;width:100%;color:#fff;font-size:1rem}.login-container form .form-control .password{position:absolute;right:15px;background-color:transparent;color:#fff;border:none;border-radius:50%;width:10px;display:flex;justify-content:center;outline:none;min-width:0;transition:.5s}.login-container form .form-control .password:hover{color:var(--vermelho)}.login-container form .form-control i{cursor:pointer}.login-container form input[type=submit],.login-container a button,.create{background-color:var(--vermelho);border:none;border-radius:10px;width:100%;padding:1rem 0;cursor:pointer;color:#fff;transition:.5s;font-size:1rem}.login-container form input[type=submit]:hover{background-color:var(--vermelho-hover)}.login-container a{width:100%;text-decoration:none;color:#fff;text-align:center;font-size:1rem;padding:1rem 0;transition:.5s}.login-container a button,.create{background-color:#fff3;border:none;transition:.5s;border-radius:10px;font-size:1rem;cursor:pointer}.login-container a button:hover{background-color:#fff6}.login-container .recuperar-senha:hover{color:var(--vermelho-hover)}.login-container .photo-user{width:100px;height:100px;object-fit:cover;border-radius:50%;align-self:center;border:solid 4px #fff;margin-top:2rem}.login-container .photo-user img{width:100%}.modal-background{background-color:#000c;position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;z-index:500}.modal{padding:2rem;color:var(--cinza);background-color:#fff;width:30%;min-height:200px;display:flex;justify-content:center;align-items:center;border-radius:15px;position:relative;font-size:1rem;text-align:center}.modal i{position:absolute;right:10px;top:5px;font-size:1.2rem;cursor:pointer;color:var(--vermelho)}@media (max-width: 1024px){.modal{transform:translate(-18%);width:80%}}.input-arquivo{display:none}.enviar-arquivo{background-color:var(--vermelho);width:100%;padding:1.2rem;color:#fff;border-radius:10px;outline:none;font-size:1rem;cursor:pointer;transition:.2s}.enviar-arquivo:hover{background-color:var(--vermelho-hover)}.container-file{display:flex;flex-direction:column}header{position:fixed;top:0;z-index:21;width:100vw;display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:var(--cinza)}header a{color:#fff;transition:.5s}header a:hover{color:var(--vermelho)}header img{width:150px;cursor:pointer}header .left-container{display:flex;align-items:center;gap:1rem}.user{display:flex;align-items:center;gap:2rem;font-size:1rem}header .left-container a{text-align:center}.user button{background-color:transparent;color:#fff;border:none;outline:none;font-size:1.8rem;transition:.5s}.user button:hover{color:var(--vermelho)}.user input{background-color:transparent;border:#fff solid 1px;border-radius:15px;padding:.5rem 1rem;font-size:1rem;color:#fff}.user input:focus{background-color:transparent;border:var(--vermelho)}.user input:-webkit-autofill,.user input:-webkit-autofill:hover,.user input:-webkit-autofill:focus{-webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0px 1000px transparent inset;transition:background-color 5000s ease-in-out 0s}.action-container,.user-stats{display:flex;align-items:center;color:#fff;font-size:1rem;gap:1rem;margin:0 1rem}.user-stats{gap:.8rem}.user-stats img{width:30px;border-radius:50%;border:solid 2px #fff}.user-stats i{font-size:1.5rem}.action-container a{font-size:1rem}.action-container button{font-size:1rem;cursor:pointer;display:flex;align-items:center;gap:.5rem;background-color:transparent;border:none;outline:none;color:#fff}.action-container .category{position:relative}.action-container .category i{font-size:.8rem}.action-container .category .category-button{transform:translateY(8%)}.action-container .category p,.action-container .category .category-button{cursor:pointer;transition:.5s}.action-container .category p:hover,.action-container .category .category-button:hover{color:var(--vermelho)}.action-container .category .category-container{position:absolute;display:flex;flex-direction:column;gap:.8rem;background-color:var(--cinza);padding:1rem;list-style:none;font-size:.8rem}@media (min-width: 1024px){header{padding:1rem 3rem}}.mobile{display:flex;justify-content:space-between;align-items:center;gap:1rem;width:100vw}.mobile .left-container{display:flex;align-items:center;justify-content:center}.mobile .left-container img{width:4rem}.mobile .center-container input{background-color:transparent;border:solid 2px #fff;border-radius:15px;padding:.5rem;color:#fff}.mobile{position:relative}.mobile .right-container .menu-toggle{color:var(--vermelho);font-size:2rem}.mobile .menu-mobile-open{background-color:var(--cinza);position:fixed;color:red;top:4rem;right:0;height:96vh;list-style:none;padding:2rem;overflow:scroll;min-width:255px}.mobile .menu-mobile-open ul{list-style:none;display:flex;flex-direction:column;gap:2rem}.mobile .menu-mobile-open .user-stats{display:flex;flex-direction:column-reverse;margin-bottom:1rem}.mobile .menu-mobile-open button{background-color:transparent;color:#fff;border:none;outline:none;display:flex;gap:.5rem;font-size:1rem}.mobile .menu-mobile-open .logout{display:flex;gap:1rem;position:absolute;top:.5rem;right:2rem}.mobile .menu-mobile-open .category-container{display:grid;grid-template-columns:repeat(2,1fr);color:#fff;font-size:.8rem;gap:.8rem;margin-top:1rem}#highlight{position:relative;width:100%;min-height:100vh;overflow:hidden;margin-bottom:4rem;display:flex;flex-direction:column}#highlight .video-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center}#highlight .video-container button{position:absolute;z-index:50;right:2rem;color:#fff;background-color:transparent;border-radius:50%;width:60px;height:60px;font-size:1.5rem;display:flex;align-items:center;justify-content:center;border:solid 2px #fff;outline:none;transition:.5s}#highlight .video-container button:hover{transform:scale(1.1);border:solid 2px var(--vermelho);color:var(--vermelho)}#highlight .video-container iframe,#highlight .video-container img{width:120%;height:120%;object-fit:cover;-webkit-user-select:none;user-select:none;border:none}.video-container:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:auto;background:transparent;z-index:2}#highlight .description{position:absolute;bottom:0;width:100%;padding:4rem;color:#fff;z-index:3;display:flex;flex-direction:column;gap:1rem;background:linear-gradient(to top,#000000e6 70%,#0000)}#highlight .description h2{font-size:2rem;color:var(--vermelho)}@media (min-width: 1024px){#highlight .video-container button{right:8rem}}.movies-container{padding:0 2rem;width:100%;height:100%;margin:0 auto}.movies-container .genre-name{text-align:center;font-size:1.5rem;margin-bottom:2rem;color:var(--vermelho)}.movies-container ul{display:grid;grid-template-columns:repeat(auto-fill,250px);align-items:center;gap:4rem 1rem;list-style:none;justify-content:center}.movies-container ul li{cursor:pointer;transition:.5s;position:relative;z-index:20;border-radius:5px}.movies-container ul li:hover{transform:scale(1.2);position:relative;z-index:200}.movies-container ul li img{width:100%;height:150px;object-fit:cover;object-position:bottom;position:relative;border-radius:5px}.movies-container ul li .description{background-color:#222222d9;color:#fff;position:absolute;display:flex;flex-direction:column;bottom:0;padding:1rem;gap:.5rem;z-index:50;width:100%}.movies-container ul li button{position:absolute;right:5px;top:5px;font-size:1.2rem;z-index:100;background-color:transparent;color:#fff;cursor:pointer}.movies-container ul li .description .genres{display:flex;flex-wrap:wrap;gap:5px;color:var(--vermelho);text-align:center}.movies-container ul li .description .row{display:flex;justify-content:space-between;align-items:center}.movies-container ul li .description .row .year,.movies-container ul li .description .row .genres{font-size:.7rem;font-weight:700}.movies-container ul li .rating{display:flex}.movies-container ul li .rating .bi-star-fill{color:var(--vermelho)}.movies-container ul li .rating .bi-star{color:#fff}.loading-spinner{width:40px;height:40px;border:4px solid var(--vermelho);border-top-color:#000;border-radius:50%;animation:spin .8s linear infinite;margin:2rem auto}.title-movie,.title-mobile{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.title-mobile{color:var(--vermelho);text-align:center}@keyframes spin{to{transform:rotate(360deg)}}#movie h3{font-size:1.5rem;color:var(--vermelho);text-align:center}#movie .add-coment{width:80%;display:flex;flex-direction:column;gap:1rem;margin-top:2rem}#movie .add-coment .form-control{position:relative;display:flex;justify-content:center;align-items:center}#movie .add-coment textarea{padding:2rem 1.5rem;background-color:transparent;border:solid 2px #fff;border-radius:25px;width:100%;height:200px;color:#fff;outline:none;font-size:1.2rem}#movie .add-coment button{position:absolute;right:40px;background-color:transparent;color:#fff;font-size:3rem;width:20px;display:flex;align-items:center;justify-content:center;outline:none;transition:.5s;border:none;cursor:pointer}#movie .add-coment button:hover{color:var(--vermelho);outline:none;border:none}.comments-container{width:100%;padding:4rem;display:flex;gap:2rem;flex-direction:column;align-items:center;justify-content:center}.comments-container .actions{display:flex;flex-direction:column-reverse;justify-content:space-between;align-items:center;width:100%}.comments-container .actions-buttons{display:flex;font-size:1.3rem;gap:1rem}.comments-container .actions-buttons i{cursor:pointer;transition:.5s}.comments-container .actions-buttons i:hover{color:var(--vermelho)}blockquote{width:100%;display:flex;gap:1rem;flex-direction:column;align-items:center;color:#fff;justify-content:space-between;border:solid 3px rgba(255,0,0,.2);border-radius:15px;padding:2rem;position:relative}blockquote h4{color:var(--vermelho);font-size:1.5rem}blockquote .user{display:flex;gap:1rem;position:absolute;top:1rem}blockquote .user img{width:40px;height:40px;border-radius:50%;border:solid 3px #fff}blockquote .user small{font-weight:600;color:var(--vermelho);font-size:1.2rem}blockquote .user i{font-size:.8rem}blockquote figcaption{font-size:1rem;text-align:center;font-weight:400;margin-top:2rem}blockquote .likes{display:flex;position:relative}blockquote .likes i{margin-right:.5rem}blockquote .likes p{background-color:var(--vermelho);border-radius:50%;width:30px;height:30px;text-align:center;font-size:.9rem;position:absolute;display:flex;justify-content:center;align-items:center;top:-15px;right:35px}@media (min-width: 1024px){#movie .add-coment{width:60%}blockquote .user img{width:60px;height:60px}.comments-container .actions{flex-direction:row;align-items:center;position:relative;right:0}blockquote{width:50%}blockquote .user{position:relative;font-size:1.2rem;top:0}}#movie{display:flex;flex-direction:column;align-items:center}.movie-detail{display:flex;justify-content:center;min-height:92vh;width:100%;align-items:flex-end;position:relative;overflow:hidden}.movie-detail img{width:100%;object-fit:cover;position:absolute;z-index:1}.movie-detail .description{display:flex;flex-direction:column;width:100%;gap:1rem;z-index:5;position:absolute;bottom:0;padding:2rem;color:#fff;background:linear-gradient(to top,#000000e6 20%,#0000)}.movie-detail .description .stats{display:flex;gap:2rem}.movie-detail .description .overview{width:100%}.movie-detail .description .genres{display:flex;gap:10px;font-size:.8rem}.movie-detail .description p{display:flex;flex-direction:column}.movie-detail .description p strong{font-size:1.2rem}.movie-detail .video-container{width:100%;height:85vh;display:flex;justify-content:center;align-items:center}.movie-detail .video-container iframe,.movie-detail .video-container img{width:150%;height:150%;object-fit:cover;-webkit-user-select:none;user-select:none;border:none;transform:translateY(-20%)}.movie-detail .video-container button{position:absolute;z-index:50;right:2rem;top:8rem;color:#fff;background-color:transparent;border-radius:50%;width:40px;height:40px;font-size:1.5rem;display:flex;align-items:center;justify-content:center;border:solid 2px #fff;outline:none;transition:.5s}.movie-detail .video-container button:hover{transform:scale(1.1);border:solid 2px var(--vermelho);color:var(--vermelho)}#movie h3{font-size:2rem;color:var(--vermelho);text-align:center}@media (min-width: 1024px){.movie-detail .video-container button{right:8rem;top:0;width:60px;height:60px}.movie-detail .description{padding:2rem 4rem}.movie-detail .description .overview{width:50%}.movie-detail .video-container iframe,.movie-detail .video-container img{transform:translate(0)}}#my-list{color:#fff;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:8rem 4rem;gap:4rem;font-size:1.2rem}#my-list h2{align-self:center;color:var(--vermelho)}.empty-list{display:flex;text-align:center;justify-content:center;width:100%;align-self:center}.modal{display:flex;flex-direction:column;justify-content:space-around;align-items:center;height:fit-content}.modal button{background-color:var(--cinza);color:#fff;padding:.8rem;cursor:pointer;border-radius:15px;min-width:150px;margin:5px;transition:.5s;font-size:1rem}.modal button:hover{background-color:var(--vermelho)}.modal form{display:flex;flex-direction:column;gap:1rem}.modal .form-control{position:relative}.modal .form-control button{background-color:transparent;min-width:0;position:absolute;right:0;color:var(--vermelho);outline:none}.modal .form-control button:hover,.modal form input{color:var(--cinza)}.delete span{font-size:1rem;text-align:center;width:70%;margin-bottom:2rem;color:var(--vermelho);line-height:25px}.delete img{height:150px;margin-bottom:2rem;-webkit-user-select:none;user-select:none}.delete .cancel{background-color:var(--vermelho)}.deleted{background-color:var(--cinza);color:#fff}.deleted img{height:350px;margin-bottom:1rem}@media (min-width: 1024px){.delete img{height:350px}}#configs{color:#fff;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:8rem 4rem;gap:4rem}#configs h2{align-self:center;color:var(--vermelho)}#configs h3{border-bottom:solid .2px var(--vermelho);width:100%}.user-info,.user-container,.count-config{display:flex;flex-direction:column;gap:1rem;width:100%}.user-photo{display:flex;flex-direction:column;text-align:center;align-items:center;gap:1rem;justify-content:center;width:150px;height:150px;align-self:center;font-size:10rem;position:relative;color:var(--vermelho)}.user-photo img{width:150px;height:150px;border:solid 4px #fff;object-fit:cover;border-radius:50%}.switch-photo{position:absolute;color:#fff;background-color:#ff0505;width:150px;height:150px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:50%;font-size:5rem;cursor:pointer}.switch-photo small{font-size:.8rem}.user-photo .container-file{width:20%;height:15px;font-size:.5rem}.user-photo .container-file button{font-size:.8rem;height:15px;display:flex;justify-content:center;align-items:center;text-align:center}.config-action{cursor:pointer;transition:.5s;font-size:.8rem}.config-action:hover{color:var(--vermelho)}#configs .actions-container{display:flex;gap:1rem}.small{text-align:center;font-size:.7rem;margin-top:.5rem}
