Css files of liberary can not be load I'm trying to add Zurb Foundation framework to my theme library file. However, when I add the following code to my library, the java script file load without any probleme or difficulty but css files only can not be load.

I would be grateful to hear what is the problem with the code and what is the right way to load a css of the library?

This is my theme folder structure (Zurb Foundation folder location):

|-Theme Name
|  |-includes
|  |  |-foundation
|  |  |  |-css
|  |  |  |-js


Library file:

foundation:
  version: 6.x
  css:
    includes/foundation/css/app.css: {}
    includes/foundation/css/foundation.css: {}
    includes/foundation/css/foundation.min.css: {}
  js:
    includes/foundation/js/app.js: {}
    includes/foundation/js/foundation.js: {}
    includes/foundation/js/foundation.min.js: {}
    includes/foundation/js/jquery.js: {}
    includes/foundation/js/what-input.js: {}
  dependencies:
    - core/drupal
    - core/jquery
    - core/jquery.once


[theme_name].info.yml file:

name: Theme Name
type: theme
core: 8.x
base theme: classy
libraries:
  - Theme Name/foundation
  - Theme Name/global


And finally, I uncheckmark Aggregate CSS and  Aggregate JavaScript files boxes in performance, flush caches and clear my browser cache.

screenshot of Source page:

As you can see the javascript files load witout any problem.
You can follow document


  You may notice the 'theme' key for css which is not present for js. This indicates the style type the css file belongs to.
  
  You can set CSS weights with 5 different levels of styling:



base key assigns a weight of CSS_BASE = -200 
layout key assigns a weight of CSS_LAYOUT = -100 
component key assigns a weight of CSS_COMPONENT = 0; 
state key assigns a weight of CSS_STATE = 100
theme key assigns a weight of CSS_THEME = 200



  This is defined by the SMACSS standard. So here if you specify theme
  it means that the CSS file contains theme related styling which is
  pure look and feel. More info here. You cannot use other keys as these
  will cause strict warnings.


In your case you can use key theme

foundation:
  version: 6.x
  css:
    theme:
      includes/foundation/css/app.css: {}
      includes/foundation/css/foundation.css: {}
      includes/foundation/css/foundation.min.css: {}
  js:
    includes/foundation/js/app.js: {}
    includes/foundation/js/foundation.js: {}
    includes/foundation/js/foundation.min.js: {}
    includes/foundation/js/jquery.js: {}
    includes/foundation/js/what-input.js: {}
  dependencies:
    - core/drupal
    - core/jquery
    - core/jquery.once