/* * If you need any modifications to the existing styles, please override here. * So that it won't break your template in case of future updates. * once added, do not forget to add the as well. * */ /* Beta Modal Styling */ .modal-backdrop { backdrop-filter: blur(8px); background-color: rgba(15, 25, 35, 0.7); } .modal-content { background: linear-gradient(135deg, #18346c 0%, #0f1923 100%); color: #fff; border: 1px solid rgba(67, 83, 254, 0.3); border-radius: 12px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5); } .modal-header { border-bottom: 1px solid rgba(67, 83, 254, 0.2); padding: 1.5rem; } .modal-title { font-size: 1.75rem; font-weight: 700; color: #fff; background: linear-gradient(90deg, #4353fe 0%, #00d4ff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .modal-header .close { color: #fff; opacity: 0.8; text-shadow: none; font-size: 2rem; font-weight: 300; } .modal-header .close:hover { opacity: 1; color: #4353fe; } .modal-body { padding: 1.5rem; } .modal-footer { border-top: 1px solid rgba(67, 83, 254, 0.2); padding: 1.5rem; } .modal-body .form-group { margin-bottom: 1.5rem; } .modal-body .form-control { background-color: rgba(15, 25, 35, 0.6); color: #fff; border: 1px solid rgba(67, 83, 254, 0.3); border-radius: 6px; padding: 0.75rem 1rem; font-size: 1rem; transition: all 0.3s ease; height: auto; min-height: 48px; line-height: 1.5; } .modal-body .form-control:focus { background-color: rgba(15, 25, 35, 0.8); color: #fff; border-color: #4353fe; box-shadow: 0 0 0 0.2rem rgba(67, 83, 254, 0.25); outline: none; } .modal-body label { color: #fff; margin-bottom: 0.5rem; font-weight: 500; font-size: 0.95rem; } .modal-body .form-control::placeholder { color: rgba(255, 255, 255, 0.4); } .modal-body select.form-control { cursor: pointer; height: auto; min-height: 48px; padding: 0.75rem 2.5rem 0.75rem 1rem; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 1rem center; background-size: 1.2rem; } .modal-body select.form-control option { background-color: #18346c; color: #fff; padding: 0.75rem 1rem; line-height: 1.5; min-height: 40px; } .modal-footer .btn-secondary { background-color: rgba(108, 117, 125, 0.3); border: 1px solid rgba(108, 117, 125, 0.5); color: #fff; } .modal-footer .btn-secondary:hover { background-color: rgba(108, 117, 125, 0.5); border-color: rgba(108, 117, 125, 0.7); } .modal-footer .btn-primary { background: linear-gradient(90deg, #4353fe 0%, #00d4ff 100%); border: none; padding: 0.5rem 2rem; font-weight: 600; }