// Utilities :: Surface

.u-surface {
  box-sizing: border-box;
  @include fabric-size(100%, auto);
}

@each $fabric-surface-key, $fabric-surface in $fabric-surfaces {
  .u-surface--l#{$fabric-surface-key} {
    box-shadow: #{$fabric-surface};
  }
}

// [class~='u-surface--x'] {
//   box-shadow: $fabric-global-shadow;
// }
//
// [class~='u-surface--sheets'] {
//   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 10px 0 -5px #eee,
//     0 10px 1px -4px rgba(0, 0, 0, 0.15), 0 20px 0 -10px #eee,
//     0 20px 1px -9px rgba(0, 0, 0, 0.15);
// }