*,*:before,*:after{box-sizing:border-box}html{font-size:16px;background-color:#f4f4f8;display:flex;justify-content:center;align-content:center;margin-top:5%}body{margin:0;padding:0;font-family:Smythe,system-ui;width:600px;max-height:1400px;display:grid;grid-template-columns:2em 1fr 2em;grid-template-areas:" head head head " " .... main .... ";gap:4em 0;background-color:#fff}.site-header{grid-area:head}main{grid-area:main}h1,h2{font-weight:400}h1{font-size:2.45rem}h2{font-size:1.45rem}h3{font-size:1.75rem}ul{padding:0;margin:0}li{font-weight:400;list-style:none}.site-header{padding:3em 2em;background-image:url(/assets/ferks-guare-0gqH797v.png);background-repeat:no-repeat;background-size:cover;background-position:60% center;color:#fff}.site-header__title,.site-header__subtitle{margin:0}.site-header__title{margin-bottom:.125em}main{display:grid;gap:2em 0}.menu-item{display:grid;gap:3em 0}.menu-list{display:flex;justify-content:space-between;gap:2em}.menu-list>div{margin-right:auto;display:flex;flex-direction:column;gap:.4em}.menu-item__title{font-size:1.75rem}.menu-item__ingredients{font-size:1rem;color:#8b8b8b}.menu-item__price{font-size:1.25rem}.menu-item__add-btn{justify-self:end;width:50px;height:50px;background-color:#fff;border:none;border-radius:50%;border:1.5px solid #dedede}.menu-item__add-btn:hover,.menu-item__add-btn:active{background-color:#fcd34d}.divider{border-bottom:1px solid #d2d2d2;grid-column:1 / -1}.order-section{display:grid;gap:1em 0}.order-section__title{text-align:center;font-weight:400}.order-list{display:grid;gap:1em 0}.order-item{display:flex;justify-content:space-between;gap:1em}.order-item__name,.order-total__label{font-size:1.75rem}.order-item__remove-btn{margin-right:auto;border:none;background-color:unset;font-family:Verdana,Geneva,Tahoma,sans-serif;color:#bbb}.order-item__price,.order-total__amount{font-size:1.25rem}.order-total{display:flex;justify-content:space-between}.order-divider{border:2px solid #393333}.order-section__complete-btn{margin-top:2em;margin-bottom:4em;border:none;border-radius:3px;box-shadow:0 1px 2px #0000000d;padding:1.65em 2em;font-family:Verdana,Geneva,Tahoma,sans-serif;font-weight:700;color:#fff;background-color:#16db99}.order-complete{background-color:#ecfdf5;color:#065f46;text-align:center;border-radius:3px;font-size:2rem;padding:.5em;margin-bottom:2em}.hidden{display:none}.modal{display:none;position:fixed;inset:0;margin:auto;height:545px;width:525px;border-radius:5px;box-shadow:5.19px 5.19px 255.44px #00000080;background-color:#fff;font-family:Verdana,Geneva,Tahoma,sans-serif}.modal-inner{width:475px;margin:0 auto}.modal-title{margin-bottom:2em;font-size:1.5rem;color:#000;text-align:center}.close-modal-btn-container{text-align:right;margin:9px}.modal-close-btn{font-size:22px;font-weight:700;background-color:transparent;border:1px solid transparent;color:#000}.modal-close-btn:hover,.modal-close-btn:active{color:red;cursor:pointer}.modal-close-btn:disabled{opacity:.2;cursor:not-allowed}.modal-btn{border:none;border-radius:5px;padding:2em;width:100%;cursor:pointer;font-weight:700;color:#fff;background-color:#16db99}.modal-form{display:grid;grid-auto-rows:minmax(60px,70px);gap:2em 0}input{border:1.3px solid #757575;padding:1em 2em;width:100%;border-radius:3px;font-size:20px}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:0}input[type=number]{-moz-appearance:textfield;appearance:textfield}
