.modal-backdrop{position:fixed;inset:0;background-color:#00000080;z-index:1000;animation:fadeIn .2s ease-out}.modal-container{position:fixed;inset:0;z-index:1001;display:flex;align-items:center;justify-content:center;padding:20px}.modal-content{background:#fff;border-radius:8px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;max-height:90vh;display:flex;flex-direction:column;animation:slideUp .3s ease-out}.modal-small{width:100%;max-width:400px}.modal-medium{width:100%;max-width:600px}.modal-large{width:100%;max-width:900px}.modal-extra-large{width:100%;max-width:1600px}.modal-super-large{width:95%;max-width:1200px}.modal-super-large .recipe-form,.modal-super-large .form{max-width:none!important;width:100%!important}.modal-header{padding:20px 24px;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:1.25rem;font-weight:600;color:#111827;margin:0}.modal-close{background:none;border:none;font-size:1.5rem;color:#6b7280;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:4px;transition:all .2s}.modal-close:hover{background-color:#f3f4f6;color:#111827}.modal-body{padding:24px;overflow-y:auto;flex:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-body .form-group{margin-bottom:1rem}.modal-body .form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.modal-body .form-actions{margin-top:1.5rem;padding-top:1rem;border-top:1px solid #e5e7eb;display:flex;justify-content:flex-end;gap:.75rem}.dark .modal-content{background:#1f2937}.dark .modal-header{border-bottom-color:#374151}.dark .modal-title{color:#f9fafb}.dark .modal-close{color:#9ca3af}.dark .modal-close:hover{background-color:#374151;color:#f3f4f6}.dark .modal-body .form-group label{color:#e5e7eb}.dark .modal-body .form-control,.dark .modal-body input,.dark .modal-body textarea,.dark .modal-body select{background:#374151;border-color:#4b5563;color:#f9fafb}.dark .modal-body .form-control:focus,.dark .modal-body input:focus,.dark .modal-body textarea:focus,.dark .modal-body select:focus{border-color:#3b82f6;background:#374151}.dark .modal-body .form-actions{border-top-color:#374151}@media(max-width:640px){.modal-container{padding:10px}.modal-content{max-height:95vh}.modal-body{padding:8px}.modal-body .form-row{flex-direction:column}.modal-body .recipe-form,.modal-body .form{padding:.5rem!important}}