.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.3);backdrop-filter:blur(3px);z-index:1000}.modal.show{display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:white;border-radius:20px;width:95%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 25px 50px rgba(0,0,0,.3);animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{color:white;padding:25px 30px;border-radius:20px 20px 0 0;position:relative;flex-shrink:0}.modal-title{font-size:24px;font-weight:700;margin-bottom:5px}.booking-id{font-size:14px;opacity:.9}.close-btn{position:absolute;right:20px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.2);border:none;color:white;width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:18px;transition:all .3s ease}.close-btn:hover{background:rgba(255,255,255,.3);transform:translateY(-50%) scale(1.1)}.modal-body{padding:30px;flex:1;overflow-y:auto}.status-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.status-card{background:linear-gradient(135deg,#f8fafc,#e2e8f0);padding:20px;border-radius:15px;text-align:center;border:1px solid #e2e8f0}.status-card h3{color:#475569;font-size:14px;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.status-confirmed{background:linear-gradient(135deg,#10b981,#059669);color:white;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;display:inline-block}.amount{font-size:28px;font-weight:800;color:#059669}.section{background:white;border-radius:15px;padding:25px;margin-bottom:25px;box-shadow:0 4px 20px rgba(0,0,0,.08);border:1px solid #f1f5f9}.section-title{font-size:18px;font-weight:700;color:#1e293b;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #e2e8f0}.customer-info{background:linear-gradient(135deg,#dbeafe,#bfdbfe)}.ticket-info{background:linear-gradient(135deg,#dcfce7,#bbf7d0)}.payment-info{background:linear-gradient(135deg,#fae8ff,#e9d5ff)}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.info-item{margin-bottom:15px}.info-label{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;font-weight:600}.info-value{font-size:16px;color:#1e293b;font-weight:500}.ticket-card{background:white;border:2px solid #e2e8f0;border-radius:12px;padding:20px;margin-top:15px}.product-name{font-size:20px;font-weight:700;color:#1e293b;margin-bottom:5px}.product-type{background:#3b82f6;color:white;padding:4px 12px;border-radius:15px;font-size:12px;font-weight:600}.variant-info{background:#f8fafc;padding:15px;border-radius:10px;margin:15px 0}.pricing{text-align:right}.original-price{text-decoration:line-through;color:#64748b;font-size:14px}.sale-price{font-size:24px;font-weight:800;color:#059669}.ticket-detail{background:linear-gradient(135deg,#f1f5f9,#e2e8f0);padding:15px;border-radius:10px;margin-top:15px;border-left:4px solid #3b82f6}.payment-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #e2e8f0}.payment-row:last-child{border-bottom:none;font-size:18px;font-weight:700;padding-top:15px;border-top:2px solid #e2e8f0}.modal-footer{background:#f8fafc;padding:20px 30px;border-radius:0 0 20px 20px;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.footer-info{color:#64748b;font-size:14px}.btn-group{display:flex;gap:15px}.btn{padding:12px 24px;border-radius:10px;border:none;font-weight:600;cursor:pointer;transition:all .3s ease;font-size:14px}.btn-secondary{background:white;color:#475569;border:2px solid #e2e8f0}.btn-secondary:hover{background:#f1f5f9;transform:translateY(-1px)}.btn-primary{background:linear-gradient(45deg,#3b82f6,#1d4ed8);color:white;box-shadow:0 4px 15px rgba(59,130,246,.3)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(59,130,246,.4)}.btn-success{background:linear-gradient(45deg,#10b981,#059669);color:white;box-shadow:0 4px 15px rgba(16,185,129,.3)}.btn-success:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(16,185,129,.4)}@media (max-width:768px){.modal-content{width:98%;margin:10px}.info-grid,.status-cards{grid-template-columns:1fr}.btn-group,.modal-footer{flex-direction:column}.modal-footer{gap:15px}}