:root{--primary-color: #71e2a4;--primary-hover-color: #5db987;--secondary-color: #ffffff;--secondary-hover-color: #ffffff;--tertiary-color: #ffffff;--tertiary-hover-color: #f5f5f5;--quaternary-color: #000000;--quaternary-hover-color: #000000}body{font-family:Arial,sans-serif;background-color:#f0f0f0;margin:0;padding:0}.container{width:90%;height:100vh;margin:auto;background-color:#f0f0f0;padding:0 20px;max-width:900px;display:flex;flex-direction:column;resize:vertical;overflow:auto;min-height:428px}h1,h2{text-align:center;color:#4f4f4f}h3{text-align:center;margin:0}.input-group{display:flex;justify-content:center;gap:2%;margin-top:-10px}.input-group input{width:30%;padding:10px;font-size:16px;border:none;outline:none;border-bottom:2px solid #33333314;background-color:transparent;text-align:center}.input-group input:focus{background-color:#9b9b9b2f;transition:all .3s ease}.input-lock{display:flex;justify-content:center;gap:2%;margin-top:10px}.input-lock input{width:30%;padding:10px;font-size:16px;font-weight:700;color:#4f4f4f;border:none;outline:none;background-color:transparent;text-align:center}button{border-radius:50px}.hapus-button{border-radius:12px;margin:2px;background:#f0f0f0;color:#333;padding:10px 20px;font-size:16px;font-weight:600;border:none;box-shadow:6px 6px 12px #00000012,-6px -6px 12px #ffffffb3;cursor:pointer;transition:box-shadow .4s ease,transform .2s ease,background .3s ease}.hapus-button:hover{box-shadow:inset 4px 4px 10px #0000000f,inset -4px -4px 10px #fffc;transform:translateY(-2px);background:#e8e8e8}.input-group button{background:#f0f0f0;color:#333;padding:14px 30px;font-size:16px;font-weight:600;border:none;border-radius:12px;box-shadow:6px 6px 12px #00000012,-6px -6px 12px #ffffffb3;cursor:pointer;transition:box-shadow .4s ease,transform .2s ease}.input-group button:hover{box-shadow:3px 3px 6px #00000009,-3px -3px 6px #ffffff80;transform:translateY(-1px)}.input-group button:active{box-shadow:inset 4px 4px 8px #00000007,inset -4px -4px 8px #ffffff67;transform:scale(.99)}.cart{margin-top:20px}.cart ul{list-style-type:none;padding:0}.cart li{display:flex;justify-content:space-between;gap:30px;padding:4px 10px;border-bottom:1px solid #ddd;align-items:center;font-size:18px}.cart .total{text-align:right;margin-top:20px}.cart button{background:#f0f0f0;color:#333;padding:5px 11px;font-size:16px;font-weight:600;border:none;border-radius:12px;box-shadow:6px 6px 12px #00000012,-6px -6px 12px #ffffffb3;cursor:pointer;transition:box-shadow .4s ease,transform .2s ease}.cart button:hover{box-shadow:3px 3px 6px #00000009,-3px -3px 6px #ffffff80;transform:translateY(-1px)}.cart button:active{box-shadow:inset 4px 4px 8px #00000007,inset -4px -4px 8px #ffffff67;transform:scale(.99)}#cartItems{height:200px}.button-container{display:flex;flex-direction:column;gap:10px}.button{background:#f0f0f0;color:#333;padding:14px 30px;font-size:16px;font-weight:600;border:none;border-radius:12px;box-shadow:6px 6px 12px #00000012,-6px -6px 12px #ffffffb3;cursor:pointer;transition:box-shadow .4s ease,transform .2s ease}.button:hover{box-shadow:3px 3px 6px #00000009,-3px -3px 6px #ffffff80;transform:translateY(-1px)}.button:active{box-shadow:inset 4px 4px 8px #00000007,inset -4px -4px 8px #ffffff67;transform:scale(.99)}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:#f0f0f0;border-radius:10px;box-shadow:inset 4px 4px 8px #0000000d,inset -4px -4px 8px #fff9}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:10px;box-shadow:inset 2px 2px 5px #0000000d,inset -2px -2px 5px #ffffff80;transition:background .3s ease}::-webkit-scrollbar-thumb:hover{background:silver}.button-master{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:10px;margin-top:auto}#donationIframe{position:fixed;bottom:20px;left:20px;width:500px;height:300px;border:none;transform:scale(.4);transform-origin:bottom left}#donationIframe2{position:fixed;bottom:20px;right:20px;width:480px;height:120px;border:none;transform:scale(.6);transform-origin:bottom right}
