Fixes #476 - keep @imports on top when restructuring.

It is the same story as with `@charset`s and important comments.

History.md

@@ -1,6 +1,7 @@
 [3.1.4 / 2015-xx-xx](https://github.com/jakubpawlowicz/clean-css/compare/v3.1.3...3.1)
 ==================
 
+* Fixes issue [#477](https://github.com/jakubpawlowicz/clean-css/issues/477) - `@import`s order in restructuring.
 * Fixes issue [#478](https://github.com/jakubpawlowicz/clean-css/issues/478) - ultimate fix to brace whitespace.
 
 [3.1.3 / 2015-03-03](https://github.com/jakubpawlowicz/clean-css/compare/v3.1.2...v3.1.3)

lib/selectors/optimizers/advanced.js

@@ -634,7 +634,9 @@ AdvancedOptimizer.prototype.restructure = function (tokens) {
 
   var position = tokens[0] && tokens[0].kind == 'at-rule' && tokens[0].value.indexOf('@charset') === 0 ? 1 : 0;
   for (; position < tokens.length - 1; position++) {
-    if (!tokens[position] || tokens[position].kind != 'text' || tokens[position].value.indexOf('__ESCAPED_COMMENT_SPECIAL') !== 0)
+    var isImportRule = tokens[position].kind === 'at-rule' && tokens[position].value.indexOf('@import') === 0;
+    var isEscapedCommentSpecial = tokens[position].kind === 'text' && tokens[position].value.indexOf('__ESCAPED_COMMENT_SPECIAL') === 0;
+    if (!(isImportRule || isEscapedCommentSpecial))
       break;
   }
 

test/selectors/optimizer-test.js

@@ -199,6 +199,14 @@ vows.describe(SelectorsOptimizer)
       'with important comment and charset': [
         '@charset "utf-8";__ESCAPED_COMMENT_SPECIAL_CLEAN_CSS0__a{width:100px}div{color:red}.one{display:block}.two{display:inline;color:red}',
         '@charset "utf-8";__ESCAPED_COMMENT_SPECIAL_CLEAN_CSS0__.two,div{color:red}a{width:100px}.one{display:block}.two{display:inline}'
+      ],
+      'with charset and import': [
+        '@charset "UTF-8";@import url(http://fonts.googleapis.com/css?family=Lora:400,700);a{width:100px}div{color:red}.one{display:block}.two{display:inline;color:red}',
+        '@charset "UTF-8";@import url(http://fonts.googleapis.com/css?family=Lora:400,700);.two,div{color:red}a{width:100px}.one{display:block}.two{display:inline}'
+      ],
+      'with charset and import and comments': [
+        '@charset "UTF-8";@import url(http://fonts.googleapis.com/css?family=Lora:400,700);__ESCAPED_COMMENT_SPECIAL_CLEAN_CSS0__a{width:100px}div{color:red}.one{display:block}.two{display:inline;color:red}',
+        '@charset "UTF-8";@import url(http://fonts.googleapis.com/css?family=Lora:400,700);__ESCAPED_COMMENT_SPECIAL_CLEAN_CSS0__.two,div{color:red}a{width:100px}.one{display:block}.two{display:inline}'
       ]
     }, { advanced: true })
   )