body{margin:0;padding:0}#root{display:grid;grid-template-rows:minmax(50px,60px) 10fr;height:100vh}.main-cart{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;height:100%;margin-top:1rem;margin-bottom:3rem}.phone-cart-box{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;max-width:45%;border:1px solid;border-color:#80808023;border-radius:20px;padding-bottom:17px;padding-right:15px}.img-cart{display:flex;justify-content:center;align-items:center;width:40%}.img-cart>img{width:100%;height:100%;border-radius:20px}.data-cart{display:flex;flex-direction:column;align-items:flex-end;width:60%;padding:5px}.qty-text{padding-left:10px;font-weight:700}.cart-resume{display:flex;flex-direction:column;justify-content:center;align-items:center;font-weight:700}.cart-resume>h3{margin-bottom:15px}.cart-phone-title:hover{color:orange}.button-cart{display:inline-block;padding:12px 24px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;overflow:hidden;font-size:19px;color:#000;z-index:1;margin-bottom:30px}.button-cart:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-cart:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:orange;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-cart:hover{color:#fff;border:1px solid orange}.button-cart:hover:before{top:-35%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-cart:hover:after{top:-45%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-cart-qty{display:inline-block;width:30px;padding:2px;margin-left:10px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;overflow:hidden;font-size:19px;color:#000;z-index:1}.button-cart-qty:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-cart-qty:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:orange;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-cart-qty:hover{color:#fff;border:1px solid orange}.button-cart-qty:hover:before{top:-35%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-cart-qty:hover:after{top:-45%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-cart-delete{display:inline-block;padding:5px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;overflow:hidden;color:#000;z-index:1;margin-right:10px}.button-cart-delete:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-cart-delete:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:red;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-cart-delete:hover{color:#fff;border:1px solid red}.button-cart-delete:hover:before{top:-35%;background-color:red;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-cart-delete:hover:after{top:-45%;background-color:red;transform:translate(-50%) scaleY(1.3) scaleX(.8)}@media (max-width: 600px){.phone-cart-box{max-width:70%}}.main-aftersales{display:flex;flex-direction:column;align-items:center;margin-top:2rem}.form-container{display:flex;flex-direction:row;gap:4rem;margin-top:2rem;margin-bottom:1rem}.form-container-data1,.form-container-data2{display:flex;flex-direction:column}form{display:flex;flex-direction:column;width:100%;justify-content:center;align-items:center}form>label,input{margin:10px;border:none}.form-container-data1>label{font-size:20px;font-weight:700;margin-left:10px}.form-container-data1>input{width:100%;font-size:15px;background-color:orange;color:#fff;font-weight:700}.form-container-data1>input[type=text]{width:100%;padding:5px 20px;border:none}textarea:focus,input:focus,input[type]:focus{outline:0 none}.form-container-data2>label{font-size:20px;font-weight:700;margin-left:10px}.form-container-data2>input{width:100%;font-size:15px;background-color:orange;color:#fff;font-weight:700}.form-container-data2>input[type=text]{width:100%;padding:5px 20px;border:none}select{background-color:#fff;border:thin solid gray;border-radius:4px;display:inline-block;font:inherit;line-height:1.5em;padding:.5em 3.5em .5em 1em;margin:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none}select.classic{background-image:linear-gradient(45deg,transparent 50%,white 50%),linear-gradient(135deg,white 50%,transparent 50%),linear-gradient(to right,gray,gray);background-position:calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),100% 0;background-size:5px 5px,5px 5px,2.5em 2.5em;background-repeat:no-repeat}select.classic:focus{background-image:linear-gradient(45deg,white 50%,transparent 50%),linear-gradient(135deg,transparent 50%,white 50%),linear-gradient(to right,orange,orange);background-position:calc(100% - 15px) 1em,calc(100% - 20px) 1em,100% 0;background-size:5px 5px,5px 5px,2.5em 2.5em;background-repeat:no-repeat;border-color:orange;outline:0}.button-form{display:inline-block;padding:12px 24px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;overflow:hidden;font-size:19px;color:#000;z-index:1;margin-bottom:30px}.button-form:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-form:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:orange;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-form:hover{color:#fff;border:1px solid orange}.button-form:hover:before{top:-35%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-form:hover:after{top:-45%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.done{display:none}.done-show{display:flex;flex-direction:column;align-items:center;margin-top:2rem}.main-aftersales-close{display:none}.home-box{width:100%;text-align:center;background-color:#f7f7f7;font-family:Camphor Pro VF,Camphor Pro,sans-serif}.box-top-sales{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:center;background-color:#f7f7f7;width:100%;margin-bottom:50px}.phone-box-card{display:flex;flex-direction:column;justify-content:center;align-items:center;width:275px;padding:20px;background-color:#fff}.phone-box-card:after{content:"";position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;box-shadow:0 5px 15px #0000004d;opacity:0;-webkit-transition:all .6s cubic-bezier(.165,.84,.44,1);transition:all .6s cubic-bezier(.165,.84,.44,1)}.phone-box-card:hover{-webkit-transform:scale(1.02,1.02);transform:scale(1.02)}.phone-box-card:hover:after{opacity:1}img{height:70%;width:70%;margin-top:20px}h2{font-size:1rem;margin-bottom:0}p{margin-bottom:0}.phone{display:flex;flex-direction:row;justify-content:center;align-items:flex-start;background-color:#fff;margin-top:60px;height:95%;width:90%;border-top-left-radius:30px;border-top-right-radius:30px;padding:40px}.img-single-phone{display:flex;justify-content:center;align-items:center;width:40%}.img-single-phone>img{width:100%;height:100%}.content-single-phone{display:flex;flex-direction:column;justify-content:center;width:60%;margin-left:30px}.cart-buttons{display:flex}.button-detail-add{display:inline-block;padding:12px 24px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;font-weight:700;overflow:hidden;font-size:19px;color:#000;z-index:1;margin-bottom:30px}.button-detail-add:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-detail-add:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:orange;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-detail-add:hover{color:#fff;border:1px solid orange}.button-detail-add:hover:before{top:-35%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-detail-add:hover:after{top:-45%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-detail-qty{display:inline-block;padding:2px 12px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;font-weight:700;overflow:hidden;font-size:19px;color:#000;z-index:1;margin-bottom:30px}.button-detail-qty:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-detail-qty:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:orange;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-detail-qty:hover{color:#fff;border:1px solid orange}.button-detail-qty:hover:before{top:-35%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-detail-qty:hover:after{top:-45%;background-color:orange;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.product-added{display:flex;flex-direction:row;justify-content:center;align-items:center;background-color:orange;color:#fff;padding:0 10px;height:40px;border-radius:10px;margin-right:10px}.button-detail-trash{display:inline-block;padding:4.6px 8px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;font-weight:700;overflow:hidden;color:#000;z-index:1}.button-detail-trash:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-detail-trash:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:red;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.button-detail-trash:hover{color:#fff;border:1px solid red}.button-detail-trash:hover:before{top:-35%;background-color:red;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.button-detail-trash:hover:after{top:-45%;background-color:red;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.breadcrumbs-container{display:flex;flex-direction:row;justify-content:center;align-items:center}@media (max-width: 600px){.phone{flex-direction:column;width:90%;height:95%;margin-top:30px}.img-single-phone{width:100%}.img-single-phone>img{width:80%;height:80%;margin-bottom:40px}.content-single-phone{width:100%}}.main-box{display:flex;justify-content:center;align-items:end;width:100%;background-color:#f7f7f7}.main{text-align:center;background-color:#f7f7f7;font-family:Camphor Pro VF,Camphor Pro,sans-serif}.title{margin-top:3.5rem;margin-bottom:2rem}.phone-boxes{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:center;background-color:#f7f7f7;width:100%;margin-bottom:50px}.filter{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-bottom:3rem}.filter>label{margin-right:15px}.clear-filter-button{display:inline-block;padding:5px;border:1px solid #4f4f4f;background-color:#fff;border-radius:4px;transition:all .2s ease-in;position:relative;overflow:hidden;color:#000;z-index:1;margin-left:15px}.clear-filter-button:before{content:"";position:absolute;left:50%;transform:translate(-50%) scaleY(1) scaleX(1.25);top:100%;width:140%;height:180%;background-color:#0000000d;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.clear-filter-button:after{content:"";position:absolute;left:55%;transform:translate(-50%) scaleY(1) scaleX(1.45);top:180%;width:160%;height:190%;background-color:red;border-radius:50%;display:block;transition:all .5s .1s cubic-bezier(.55,0,.1,1);z-index:-1}.clear-filter-button:hover{color:#fff;border:1px solid red}.clear-filter-button:hover:before{top:-35%;background-color:red;transform:translate(-50%) scaleY(1.3) scaleX(.8)}.clear-filter-button:hover:after{top:-45%;background-color:red;transform:translate(-50%) scaleY(1.3) scaleX(.8)}
