styles.css

footer,nav{background:#333;padding:1rem;color:#fff;text-align:center}.confirm-btn,.summary{box-shadow:0 4px 6px rgba(0,0,0,.1)}.banner,.confirm-btn,.generate-lucky-btn,.ticket-btn,footer,nav,nav a{color:#fff}.banner,.modal-content,.ticket-btn{position:relative}.banner .btn-banner,.small-modal{top:50%;left:50%;transform:translate(-50%,-50%)}.ticket-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.banner,.input-container,.loading,.modal-content,.modal-header,.small-modal-header,footer,nav,section{text-align:center}*,.form-group input{box-sizing:border-box}*{margin:0;padding:0}body{font-family:Arial,sans-serif;line-height:1.6;background-color:#f4f4f9}nav a{text-decoration:none;margin:0 15px}.banner img{width:100%;height:auto}.banner .btn-banner{position:absolute;background:#ff5722;color:#fff;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-size:18px}section{padding:20px}footer{position:fixed;bottom:0;width:100%}.modal-content{max-height:80vh;overflow-y:auto}.modal-header{margin-bottom:15px;font-family:fantasy}.modal-header ul{display:flex;justify-content:center;align-items:center;list-style:none;padding:0;gap:20px}.modal-header p{font-size:16px;color:#333;margin:0;display:flex;align-items:center}.modal-header i{margin-left:5px;color:#4caf50}.summary{display:flex;flex-direction:column;align-items:center;margin-top:20px;padding:15px;background:linear-gradient(135deg,#fff,#f0f8ff);border-radius:10px}.summary-content{display:flex;justify-content:space-between;width:100%;margin-bottom:15px}.summary-left{display:flex;flex-direction:column;align-items:flex-start}.summary-left p,.summary-right p{font-size:16px;color:#333;margin:5px 0;display:flex;align-items:center}.summary-left i{margin-right:8px;color:#2196f3}.summary-left span{font-weight:700;color:#2196f3}.summary-right{display:flex;flex-direction:column;align-items:flex-end}.summary-right i{margin-left:8px;color:#4caf50}.summary-right span{font-weight:700;color:#4caf50}.summary-center{width:100%;display:flex;justify-content:center}.confirm-btn{background:linear-gradient(135deg,#ff7e5f,#feb47b);border:none;padding:12px 25px;margin-top:10px;font-size:16px;font-weight:700;border-radius:25px;cursor:pointer;transition:transform .3s,box-shadow .3s}.confirm-btn:disabled{background:#ccc;cursor:not-allowed;box-shadow:none}.confirm-btn:hover:not(:disabled),.continue-btn:hover,.footer-btn:hover,.generate-btn:hover,.submit-btn:hover{transform:scale(1.05);box-shadow:0 6px 10px rgba(0,0,0,.2)}.generate-lucky-btn{margin-top:20px;background:#2ecc71;border:none;padding:10px;border-radius:5px;cursor:pointer;width:100%;font-size:16px}.ticket-grid-container{width:100%;max-height:400px;overflow-y:auto;margin-top:20px;border:1px solid #ccc}.ticket-search{width:100%;padding:10px;margin-top:10px;border:1px solid #ccc;border-radius:5px}.ticket-grid{display:grid}.ticket-btn{background:#2196f3;border:none;padding:10px;border-radius:5px;cursor:pointer;font-size:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:background .3s}.ticket-btn i{font-size:24px;margin-bottom:5px}.ticket-btn.selected{background:#4caf50}#selectedNumbers{display:flex;flex-wrap:wrap;gap:5px}.selected-number{display:flex;align-items:center;gap:5px;padding:5px;border-radius:5px;background-color:#e0f7fa;cursor:pointer;transition:background-color .3s}.selected-number:hover{background-color:#ffebee}.selected-number:hover i{color:red}.small-modal{display:none;position:fixed;background:#fff;padding:20px;border-radius:10px;width:95%;max-width:600px;box-shadow:0 4px 8px rgba(0,0,0,.2);z-index:1000}.footer-btn,.generate-btn{cursor:pointer;font-weight:700;transition:transform .3s,box-shadow .3s;box-shadow:0 4px 6px rgba(0,0,0,.1);padding:10px}.small-modal-header{font-size:20px;font-weight:700;color:#333;margin-bottom:15px;border-bottom:1px solid #ccc;padding-bottom:10px}.input-container{margin-bottom:15px}.input-container label{font-size:16px;color:#333;display:block;margin-bottom:5px}.input-container input{width:100%;padding:10px;border:1px solid #ccc;border-radius:5px;font-size:16px;text-align:center}.generate-btn{background:linear-gradient(135deg,#ff7e5f,#feb47b);color:#fff;border:none;border-radius:5px;font-size:16px;width:100%}.continue-btn i,.generate-btn i,.submit-btn i{margin-left:5px}.loading{margin-top:20px}.loading img{width:50px;height:50px}.ticket-grid{display:grid;gap:10px;margin-top:15px;max-height:200px;overflow-y:auto;padding:10px;border:1px solid #ccc;border-radius:5px}.small-modal-footer{display:flex;justify-content:space-between;margin-top:20px}.footer-btn{flex:1;border:none;border-radius:5px;font-size:14px}.cancel-btn{background:#e74c3c;color:#fff}.save-btn{background:#2ecc71;color:#fff}.select-all-btn{background:#3498db;color:#fff}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);justify-content:center;align-items:center}.modal-content{background:#fff;padding:57px;border-radius:20px;width:90%;max-width:881px;box-shadow:0 4px 8px rgba(0,0,0,.2)}.continue-btn,.submit-btn{color:#fff;padding:12px;cursor:pointer;font-weight:700;transition:transform .3s,box-shadow .3s;box-shadow:0 4px 6px rgba(0,0,0,.1)}.modal-content h3{font-size:20px;font-weight:700;color:#333;margin-bottom:20px}.form-group{margin-bottom:15px;text-align:left}.form-group label{font-size:14px;color:#333;display:block;margin-bottom:5px}.continue-btn,.form-group input,.submit-btn{font-size:16px;width:100%}.form-group input{padding:10px;border:1px solid #ccc;border-radius:5px}.submit-btn{margin-top:10px;background:linear-gradient(135deg,#ff7e5f,#feb47b);border:none;border-radius:25px}.form-actions{display:flex;flex-direction:column;gap:10px;margin-top:15px}.continue-btn{background:#2196f3;border:none;border-radius:25px}