diff --git a/resources/views/admin/inc/citrus-design.blade.php b/resources/views/admin/inc/citrus-design.blade.php index 390cc51..a3a2d35 100644 --- a/resources/views/admin/inc/citrus-design.blade.php +++ b/resources/views/admin/inc/citrus-design.blade.php @@ -164,6 +164,114 @@ color: #1e1e1e; } + /* --- BUTTONS REFACTOR (Premium Look) --- */ + .btn { + font-family: 'Inter', sans-serif !important; + font-weight: 500 !important; + border-radius: 10px !important; /* Modern rounded corners */ + padding: 8px 18px !important; + font-size: 13px !important; + transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important; + display: inline-flex !important; + align-items: center !important; + justify-content: center !important; + gap: 8px !important; /* Spacing for icons */ + border: 1px solid transparent !important; + box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important; + } + + .btn i { + font-size: 14px !important; + } + + .btn:hover { + transform: translateY(-1px) !important; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important; + } + + .btn:active { + transform: translateY(0px) !important; + } + + .btn-primary { + background-color: #3b82f6 !important; /* Modern Blue */ + border-color: #3b82f6 !important; + color: #fff !important; + } + + .btn-primary:hover { + background-color: #2563eb !important; + border-color: #2563eb !important; + color: #fff !important; + } + + .btn-secondary { + background-color: #64748b !important; + border-color: #64748b !important; + color: #fff !important; + } + + .btn-secondary:hover { + background-color: #475569 !important; + border-color: #475569 !important; + color: #fff !important; + } + + .btn-success { + background-color: #10b981 !important; + border-color: #10b981 !important; + color: #fff !important; + } + + .btn-success:hover { + background-color: #059669 !important; + border-color: #059669 !important; + color: #fff !important; + } + + .btn-info { + background-color: #06b6d4 !important; + border-color: #06b6d4 !important; + color: #fff !important; + } + + .btn-warning { + background-color: #f59e0b !important; + border-color: #f59e0b !important; + color: #fff !important; + } + + .btn-danger { + background-color: #ef4444 !important; + border-color: #ef4444 !important; + color: #fff !important; + } + + /* Small and Large variants */ + .btn-sm { + padding: 5px 12px !important; + font-size: 12px !important; + border-radius: 8px !important; + } + + .btn-lg { + padding: 12px 24px !important; + font-size: 15px !important; + border-radius: 12px !important; + } + + /* Outline Buttons */ + .btn-outline-primary { + border-color: #3b82f6 !important; + color: #3b82f6 !important; + background: transparent !important; + } + + .btn-outline-primary:hover { + background: #3b82f6 !important; + color: #fff !important; + } + .nav-main li ul li a { padding: 4px 10px !important; font-size: 12.5px !important;